让你明明白白学知识，有代码，有讲解，抄的走，学的会！
我们知道，在做缓存处理的时候，如果某些静态资源（js、css、img）没有变化，那么服务端常见的是返回 304状态码， 浏览器直接从客户端的缓存中读取（disk cache硬盘或者 memory cache 内存）中读取资源
既然是 304，那就是服务端还是会受到这个请求，只是不会返回实体内容而已，但是这也是HTTP请求，也会消耗带宽，有没有一种办法，就是用户资源没变，，我就不再向服务端发送304请求？
答案是：有的
直接上代码
// 这里的案例，主要演示HTTP中的缓存
const express = require('express')
const path = require('path')
// 日志插件
const logger = require('morgan')
const app = express()
const router = express.Router()
app.use(logger('dev'))
// 直接干掉304，不在向服务端发送请求，服务端也不处理304
app.use((req, res, next)=> {
res.set('Cache-Control', "max-age=300, immutable")
next()
})
app.use(express.static(path.join(__dirname, 'public')))
app.use(router)
app.listen(3008, ()=> {
console.log(`http://localhost:3008`)
})
前端代码，没什么好演示的，就写一个最简单的包含 js, css， img的即可
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="/css/common.css">
</head>
<body>
<h3>后台服务器在第二次根本不会接收到304请求，都不处理，节约了带宽，减少HTTP请求</h3>
</div>
<div>
<div>这里有图片，有js, 有css资源</div>
<img src="/img/a.jpg" alt="">
</div>
<script src="/plugins/jquery.js"></script>
</body>
</html>
这里起了一个本地服务
演示步骤：
1、强制刷新，从服务端获取最新数据，HTTP状态码都是 200， 而且控制台也显示具体的Size大小； 观察右侧log日志，都是正常的
2、再次刷新，多刷新几次，我们看到，后台的log只会打印 kill-304.html这个记录，且返回的是304， js、css、img，资源在服务端都没有被更新过，都已经缓存到客户端，而且，服务端实实在在的是不需要处理304请求，那么就没有多余的带宽消耗
注意事项：
- immutable 拓展缓存指令不是核心HTTP缓存标准文档的一部分，存在兼容性问题，IE11-及以下的不支持，Chrome（81版本测试的）支持，FF支持
- immutable必须搭配 max-age使用
- 只要是设置了 immutable HTTP状态码返回的将不再是304，而是200
- max-age是配合缓存服务器使用的，单体服务器，没效果，即使过期了，也不会重新向服务器拉取最新的请求，如果是客户端----缓存服务器/CDN----源服务器， 这种情况，max-age过期，就会从源服务器拉取最新资源给客户端
- immutable主要应用场景是针对那些不会经常变的资源，比如图片，比如插件包jquery, vue等，不是让你长期一直缓存 所以 max-age不要设置的过长
- 设置了immutable， 明显看到后台是没有 js、css、img这些不会变的静态资源请求的
