解决网站部署后，需要浏览器刷新才能加载新版资源的问题

现象

公司的项目使用webpack打包，会自动在生成的资源文件名中加入hash，防止浏览器缓存。
但是有一个现象一直很令人费解：项目部署后，再次打开浏览器=>输入url=>回车， 会发现加载的仍然是旧版网页，只有按F5刷新后才会正常加载。

原因

经过观测浏览器network，发现该问题产生的问题如下：
当浏览器向服务器发起对index.html的请求时，服务器的返回头中没有对缓存进行设置，于是在浏览器的下一次非刷新请求时，就会自动在本地缓存中拿到之前缓存好的index.html，而且index.html中引用的资源文件也都是已经在浏览器中缓存好的，所以此时浏览的就一定是旧版网站。

解决

设置Nginx配置文件中的location项即可，使其返回index.html时,自动添加不要缓存的响应头，这样每次浏览器就都会去服务器拿最新的index.html了。
这里偷懒了，只匹配了html（返回资源路径中存在“html”就会带相应的缓存响应头），正确一点的做法其实是“html$”，匹配html结尾的资源。

  location / {
    index index.html;
    if ($uri ~* "html") {
        add_header Cache-Control "no-cache, no-store, max-age=0, must-revalidate";
    }
  }