Node.js----(十四）搭配静态资源服务和简单路由跳转

写在前面

前面我们已经掌握了，自己搭建一个服务器，以及请求参数，路由。下面我们将搭建一个静态资源和实现路由跳转。

关键词

public          公共的 存放静态资源，包括：html，css，js，images..... 
fsPromises      fs文件模块静态方法，优化文件解读
mime            第三方模块，获取文件类型
getType()       mime静态方法用于获取文件的类型
try...catch     js异常捕获
async           异步，promise语法糖
await   作用是：用同步的方式执行异步操作和async搭配使用

流程

1.引入模块
2.创建服务器
4.发送请求，触发request 
    {
      1.搭建路由：提取用户在url想要访问文件路径
      2.根据路径去静态资源的文件夹/目录下找到该文件对应文件在服务器上的真实路径
      3.使用mime模块里的getType（）获取文件类型
      4.使用try...catch  保证程序正常运行---读文件--设置响应报文头部
    }
3.监听端口 启动服务

手写代码

//1.引入模块
const http = require('http');//搭服务器
const url = require('url');//解析请求里的参数--地址
const path = require('path');//路径模块
const fsPromises = require('fs').promises;//操作文件---异步
const mime = require('mime');//第三方模块---获取文件类型

//2.使用方法 搭服务器
const app =  http.createServer();

//4.发送请求，触发request  async(异步)
app.on('request',async(req,res)=>{

    //1.搭建路由 提取用户在url中想要访问的文件的路径 
    let{ pathname } = url.parse(req.url);
    //判断用户想要访问的路径，是空就默认首页，不是就跳转到该路径下的页面
    pathname = pathname === '/' ? 'index.html' : pathname;
    
    //2.根据路径去静态资源的文件夹/目录下找到该文件对应文件在服务器上的真实路径
    let filePath = path.jion (__dirname,'public',pathname);
    
    //3.使用mime模块里的getType（）获取文件类型
    let fileFile = mime.getType(filepath);
    
    //4.使用try...catch  保证程序正常运行---文件ok走try,文件没有就走catch
      try {
         let data = await fsPromises.readFile (filePath);//读文件
         //响应报文头部，设置文件类型
         res.writeHead(200,{
             'Content-Type':fileFile;
         res.end(data);//响应，将数据发给前端
      }catch{
          res.end (404 NOT FOUND!);
      }
      
}

//3.监听端口 启动服务
app.listen (3001,()=>{
    console,log('请使用端口号：localhost:3001');
});

做到这些之后，当我们在静态资源里放入文件时，就可以在浏览器地址栏访问我们静态资源里的文件了

源代码