HTTP协议特性之缓存Cache——NodeJs版

说明：本篇文章以Chrome浏览器作为客户端，以Websrtom开启nodejs服务端，以请求图片资源示例做代码演示。

一、如何查看浏览器端的缓存

1、chrome://cache，如果出现如下界面，说明浏览器版本较高，不支持直接查看。请采用第二种方式。

2、使用chrome cache view工具

二、缓存控制

HTTP/1.1定义的 Cache-Control 头用来区分对缓存机制的支持情况， 请求头和响应头都支持这个属性。通过它提供的不同的值来定义缓存策略。

1、禁止进行缓存

缓存中不得存储任何关于客户端请求和服务端响应的内容。每次由客户端发起的请求都会下载完整的响应内容。

Cache-Control: no-store
Cache-Control: no-cache, no-store, must-revalidate

2、强制确认缓存

如下头部定义，此方式下，每次有请求发出时，缓存会将此请求发到服务器（译者注：该请求应该会带有与本地缓存相关的验证字段），服务器端会验证请求中所描述的缓存是否过期，若未过期（注：实际就是返回304），则缓存才使用本地缓存副本。

Cache-Control: no-cache

3、私有缓存和公共缓存

“public” 指令表示该响应可以被任何中间人（译者注：比如中间代理、CDN等）缓存。若指定了”public”，则一些通常不被中间人缓存的页面（译者注：因为默认是private）（比如 带有HTTP验证信息（帐号密码）的页面 或 某些特定影响状态码的页面），将会被其缓存。

而 “private” 则表示该响应是专用于某单个用户的，中间人不能缓存此响应，该响应只能应用于浏览器私有缓存中。

Cache-Control: private
Cache-Control: public

4、缓存过期机制

过期机制中，最重要的指令是 “max-age=”，表示资源能够被缓存（保持新鲜）的最大时间。相对Expires而言，max-age是距离请求发起的时间的秒数。针对应用中那些不会改变的文件，通常可以手动设置一定的时长以保证缓存有效，例如图片、css、js等静态资源。

详情看下文关于缓存有效性的内容。

Cache-Control: max-age=31536000

5、缓存验证确认

当使用了 “must-revalidate” 指令，那就意味着缓存在考虑使用一个陈旧的资源时，必须先验证它的状态，已过期的缓存将不被使用。详情看下文关于缓存校验的内容。

Cache-Control: must-revalidate

三、图片数据请求示例——不使用缓存

nodejs开启服务端，便于Chrome请求数据。
数据交互如下：
http://localhost:8080 ：返回字符串
http://localhost:8080/img： 返回图片资源。

server.js

const http = require("http")
const host = "127.0.0.1";
const port = 8080
const server = http.createServer();
const fs = require("fs")

server.on("request", (requstMsg, respone) => {
    if (requstMsg.url === "/") {
        respone.writeHead(200, "OK", {
    "Content-Type": "text/html; charset=utf-8"});
        respone.end("请求根路径");
    } else if (requstMsg.url === "/img") {
        const readStream = fs.createReadStream("../imgs/yxc.jpg")
        respone.writeHead(200,"OK",{
            "Content-Type":"image/jpeg"
        })
        readStream.pipe(respone);

    }

})
server.listen(port, host, () => {
    console.log("服务启动了")
})

说明：后续缓存代码处理，会以此代码为基础修改。

四、图片数据请求示例——使用强缓存