前端歌谣-第伍拾捌课-node之http模块之路由模(续)

35 阅读2分钟

前言

我是歌谣 微信公众号关注前端小歌谣一起学习前端知识 今天继续给大家讲解node中路由模块的讲解

案例

try....catch捕捉异常

index.js

const http = require("http")
const route=require("./route.js")
http.createServer((req, res) => {
    const myurl = new URL(req.url, "http://127.0.0.1")
    // console.log(myurl.pathname)
    try{
        route[myurl.pathname](res)
    }catch(error){
        route["/404"](res)
    }

    res.end()
}).listen(3000, () => {
    console.log("server start")
})

route.js

const fs = require("fs")
// function route(res,pathname){
//     switch (pathname) {
//         case "/login":
//             res.writeHead(200, { "content-Type": "text/html;charset=utf-8" })
//             res.write(fs.readFileSync("./static/login.html", "utf8"))
//             break
//         case "/home":
//             res.writeHead(200, { "content-Type": "text/html;charset=utf-8" })
//             res.write(fs.readFileSync("./static/home.html", "utf8"))
//             break
//         default:
//             res.writeHead(200, { "content-Type": "text/html;charset=utf-8" })
//             res.write(fs.readFileSync("./static/404.html", "utf8"))
//     }
// }
const route={
    "/login":(res)=>{
        res.writeHead(200, { "content-Type": "text/html;charset=utf-8" })
            res.write(fs.readFileSync("./static/login.html", "utf8"))
    },
    "/home":(res)=>{
        res.writeHead(200, { "content-Type": "text/html;charset=utf-8" })
            res.write(fs.readFileSync("./static/home.html", "utf8"))
    },
    "/404":(res)=>{
        res.writeHead(200, { "content-Type": "text/html;charset=utf-8" })
            res.write(fs.readFileSync("./static/404.html", "utf8"))
    }
}
module.exports = route

运行结果

在这里插入图片描述

优化增加render函数

route.js

const fs = require("fs")
// function route(res,pathname){
//     switch (pathname) {
//         case "/login":
//             res.writeHead(200, { "content-Type": "text/html;charset=utf-8" })
//             res.write(fs.readFileSync("./static/login.html", "utf8"))
//             break
//         case "/home":
//             res.writeHead(200, { "content-Type": "text/html;charset=utf-8" })
//             res.write(fs.readFileSync("./static/home.html", "utf8"))
//             break
//         default:
//             res.writeHead(200, { "content-Type": "text/html;charset=utf-8" })
//             res.write(fs.readFileSync("./static/404.html", "utf8"))
//     }
// }

function render(res,path){
    res.writeHead(200, { "content-Type": "text/html;charset=utf-8" })
            res.write(fs.readFileSync(path), "utf8")
}
const route={
    "/login":(res)=>{
        render(res,"./static/login.html")
    },
    "/home":(res)=>{
        render(res,"./static/home.html")
    },
    "/404":(res)=>{
        render(res,"./static/404.html")
    }
}
module.exports = route

运行结果

在这里插入图片描述

api.js

function render(res, data,type="") {
    res.writeHead(200, { "content-Type": `${type?type:"application/json"};charset=utf-8` })
    res.write(data)
    res.end()
}
const apiRouter = {
    "/api/login": (res) => {
        render(res,`{
            ok:"1"
        }`)
    }
}
module.exports = apiRouter

index.js

const server=require("./server")
server.start()

route.js

const fs = require("fs")
// function route(res,pathname){
//     switch (pathname) {
//         case "/login":
//             res.writeHead(200, { "content-Type": "text/html;charset=utf-8" })
//             res.write(fs.readFileSync("./static/login.html", "utf8"))
//             break
//         case "/home":
//             res.writeHead(200, { "content-Type": "text/html;charset=utf-8" })
//             res.write(fs.readFileSync("./static/home.html", "utf8"))
//             break
//         default:
//             res.writeHead(200, { "content-Type": "text/html;charset=utf-8" })
//             res.write(fs.readFileSync("./static/404.html", "utf8"))
//     }
// }

function render(res,path){
    res.writeHead(200, { "content-Type": "text/html;charset=utf-8" })
            res.write(fs.readFileSync(path), "utf8")
}
const route={
    "/login":(res)=>{
        render(res,"./static/login.html")
    },
    "/home":(res)=>{
        render(res,"./static/home.html")
    },
    "/404":(res)=>{
        render(res,"./static/404.html")
    }
}
module.exports = route

server.js

const http = require("http")
const route=require("./route.js")
const api=require("./api.js")

const Router={}
Object.assign(Router,route)
Object.assign(Router,api)
console.log(Router,"data is")
function start(){
    http.createServer((req, res) => {
        const myurl = new URL(req.url, "http://127.0.0.1")
        // console.log(myurl.pathname)
        try{
            Router[myurl.pathname](res)
        }catch(error){
            Router["/404"](res)
        }
    
        res.end()
    }).listen(3000, () => {
        console.log("server start")
    })
}


exports.start=start

运行结果

在这里插入图片描述