Vite plugins学习之手写 Mock 插件

/**
 * @description: vite mock 插件
 * 做的最主要的事情就是拦截 http 请求
 */

const fs = require("fs");
const path = require("path");

function getMockResult() {
    
    
  let mockResult = [];
  const mockState = fs.statSync("mock");
  const isDirectory = mockState.isDirectory();
  if (isDirectory) {
    
    
    // process.cwd() --> 获取到当前执行的根目录
    mockResult = require(path.resolve(process.cwd(), "mock/index.js"));
  }
  return mockResult;
}

module.exports = (options) => {
    
    
  // 我们使用fetch 或 axios 请求，当打给本地的开发服务器时，Vite Server 服务接管
  return {
    
    
    // 配置开发服务器的钩子，常见的用例是在内部 connect 应用程序中添加自定义中间件
    configureServer(server) {
    
    
      // req：请求对象 -> 请求头、请求体、URL、cookie
      // res：响应对象 -> 响应头、响应体、状态码、cookie
      // next： 是否交给下一个中间件
      server.middlewares.use((req, res, next) => {
    
    
        const existItem = getMockResult().find((t) => t.url === req.url);
        if (existItem) {
    
    
          const response = existItem.response(req);
          res.setHeader("Content-type", "application/json;charset=utf-8");
          res.end(JSON.stringify(response));
        } else {
    
    
          next();
        }
      });
    },
  };
};