nginx设置不缓存静态入口资源
每当我们发布版本之后万恶的index.html的缓存老是需要手动清除一下，才能加载新的js文件（虽然我们使用了hash后缀打包js文件，但是html文件入口是固定的）。每次客户出现了问题，都只能在群里说下清一下缓存试试呢。这样也不是个事儿呀...
在使用缓存策略前
如上图所示，我访问系统时第一个资源文件就是我的入口地址（为什么不是index.html?这是使用了vue-router的history模式，nginx配置返回静态文件index.html，其实都一样），大家看一下它的状态是200，其他css,js文件都是200（http常用状态码后面会补充）。 当我刷新一下浏览器之后，如下 第一个websocket的咱们先不管，看第二个入口文件它的状态变成了304,而其他css,js文件是200 from memory cache，表示缓存过了。此时如果不强制清除缓存就会出现前面描述的情况一样，即使我下面的css,js文件都有hash后缀但是因为入口文件被缓存了，那么它还是会加载老的js文件，当然如果此css或js文件不存在可能会404错误。 上面两图分别是两种缓存状态。
结合以上表格可以看出，不管是304还是200 from memory cache都会有存在入口文件被缓存的风险。所以修改nginx配置如下：
location ~ .*\.(htm|html)?$ {
#原来这样设置的不管用
#expires -1;
#现在改为，增加缓存
add_header Cache-Control "private, no-store, no-cache, must-revalidate, proxy-revalidate";
access_log on;
复制代码在使用缓存策略后
不管刷新多少次，都是200正常状态，没有被缓存，但是检测到css,js文件还是原来的所以也不用担心他们会重新加载一遍。 我们再做个线上版本发布的测试，我重新发布项目后，所有文件后缀全部变了，如下图 轻轻刷新一下浏览器，会发现入口html文件状态还是正常的200，而其他js,css文件已经被重新加载了最新版本的，此时再刷新一下浏览器，便会和上面的上面那张图一样的状态。
到此，此问题解决，欢迎补充。
angelCopy JavaScript