如何利用node實現靜態文件緩存詳解

const http = require("http");
const url = require("url");
const fs = require("fs");
const path = require("path");
// 接收文件路徑 返回該文件對應的文件類型格式
const mime = require("mime");//npm i mime 

const server = http.createServer((req, res) => {
  let { pathname, query } = url.parse(req.url, true);
  //__dirname 當前文件所在的文件夾所處的絕對路徑 和請求路徑拼接
  let filePath = path.join(__dirname, "public", pathname);
  console.log(req.url);//10s內反復刷新頁面，查看是否持續打印，命中強緩存則10s打印一次
  // 設置頭部 緩存信息,規定的緩存時間內，客戶端無需再向服務器發起請求
  res.setHeader("Cache-Control", "max-age=10"); // 設置緩存時常；請求的當前時間+max-age 的相對時間內，優先級比Expires高
  res.setHeader("Expires", new Date(Date.now() + 10).toUTCString()); //兼容低版本瀏覽器,這個就是設置絕對時間，獲取的是服務器的當前時間
  // 獲取請求路徑 判斷是文件還是文件目錄
  fs.stat(filePath, function (err, statObj) {
    // url解析錯誤，則請求錯誤 沒有找到對應url資源 返回404
    if (err) {
      res.statusCode = 404;
      res.end("NOT FOUND");
    } else {
      // 如果是文件,用可讀流+管道 pipe 進行文件內容讀取,利用mime 獲取文件內容格式，並設置編碼規范為utf-8
      if (statObj.isFile()) {
        fs.createReadStream(filePath).pipe(res);
        res.setHeader(
          "Content-Type",
          mime.getType(filePath) + ";charset=utf-8"
        );
      } else {
        // 如果是文件目錄 找到 目錄下對應的index.html
        let htmlPath = path.join(filePath, "index.html");
        // fs.access判斷拼接的路徑是否可訪問
        fs.access(htmlPath, function (err) {
          if (err) {
            // 不可訪問 設置 狀態碼404
            res.statusCode = 404;
            res.end("NOT FOUND");
          } else {
            //可訪問，用可讀流加管道 pipe 進行文件內容讀取
            fs.createReadStream(htmlPath).pipe(res);
            res.setHeader("Content-Type", "text/html;charset=utf-8");
          }
        });
      }
    }
  });
  // 寫到這裡 可以 nodemon cache.js  啟動服務 查看 http://localhost:3000/ 
});
server.listen(3000, () => {
  console.log("server start 3000");
});

const http = require("http");
const url = require("url");
const fs = require("fs");
const path = require("path");
const mime = require("mime");


  let filePath = path.join(__dirname, "public", pathname);
  console.log(req.url);
  fs.stat(filePath, function (err, statObj) {
    if (err) {
      res.statusCode = 404;
      res.end("NOT FOUND");
    } else {
      if (statObj.isFile()) {
        // 判斷 瀏覽器請求的文件路徑 的change 時間 通過statObj.ctime
        const ctime = statObj.ctime.toUTCString();
        // 瀏覽器請求頭if-modified-since ===文件上次的修改時間 ，命中協商緩存，則返回 304 瀏覽器緩存中請求資源
        if (req.headers["if-modified-since"] === ctime) {
          res.statusCode = 304; //去瀏覽器緩存中找
          res.end(); //
        } else {
          //  if-modified-since !==文件上次的修改時間,響應頭Last-modified 設置 當前請求文件的 修改時間 做下次 瀏覽器請求的last-modify-since的對應值
          res.setHeader("Last-modified", ctime);
          fs.createReadStream(filePath).pipe(res);
          res.setHeader(
            "Content-Type",
            mime.getType(filePath) + ";charset=utf-8"
          );
        }
      } else {
        fs.access(htmlPath, function (err) {
          if (err) {
            // 不可訪問 設置 狀態碼404
            res.statusCode = 404;
            res.end("NOT FOUND");
          } else {
            fs.createReadStream(htmlPath).pipe(res);
            res.setHeader("Content-Type", "text/html;charset=utf-8");
          }
        });
      }
    }
  });
  // 寫到這裡 可以 nodemon cache2.js       啟動服務 查看 http://localhost:3000/ 
});
server.listen(3000, () => {
  console.log("server start 3000");
});