区分路由加载页面-httptext

区分路由加载页面

const http = require("http");  // 创建服务器
const fs = require("fs");  //  操作文件/目标
const url = require("url"); // 解析url字符串/url对象
const mime = require("./mime.json"); // 根据文件格式，获取对应的头部信息
const path = require("path");  // 处理文件路径

http.createServer((req,res)=>{

    //req:  客户端发送来的信息
    //res:  服务端返回给客户端的信息
    // console.log(req.url);
    // res.writeHead(200,{"content-type":"text/html;charset=utf-8"});
  
    ////流方式加载页面
    // let rs = fs.createReadStream("./view/index.html"); //读流
    // rs.pipe(res);

    //后端路由： 每次切换页面时，都会刷新
    //前端路由： spa 单页面应用 ，不会引起刷新
   
    // 1. http://localhost:8888/detail 
    // 2. http://localhost:8888/detail?name=zhangsan
    // 这两个地址是一个地址
    let obj = url.parse(req.url,true);
    console.log(obj);
    //加载主页
    if(obj.pathname == "/"){
        res.setHeader("content-type","text/html;charset=utf-8");

        let indexData = fs.readFileSync("./view/index.html");
        res.write(indexData);
    }else if(obj.pathname == "/detail"){
        res.setHeader("content-type","text/html;charset=utf-8");
        let indexData = fs.readFileSync("./view/detail.html");
        res.write(indexData);  
    }else if(obj.pathname == "/getData"){
        //api 接口
        let obj = {
            info: "sonme...value",
            status: 1
        }
        res.write(JSON.stringify(obj));
    }else{
        if(obj.pathname !== "/favicon.ico"){

            //1. 设置对应的头部 
            //  obj.pathname  :  /a.css   /b.js
            //  ext:    .css    .js
            //  mime是一个对象， 通过[] 取出对应的属性值
           let ext = path.extname(obj.pathname);
           console.log(ext);
           res.setHeader("content-type",mime[ext]);
          
           // 2. 读取资源文件写入到页面
           let resData = fs.readFileSync("view"+ obj.pathname);
           res.write(resData);
        }
    }
    res.end();
  
}).listen(8888);