缓存问题（一）

现在SPA类型的前端项目，一般项目里入口index.html只有一个，打包后一般是有index.html几个js文件和一些静态文件组成，index.html中引入这些js文件和静态文件。
现在通用的策略是将js文件和静态文件做强缓存，设置很长时间的过期时间。为了服务器更新前端文件后客户端及时刷新，所以对这些文件打包时文件名加hash值，例如util.js会打包成uitl.hash123.js。
但是由于设置的是强缓存，而且这些文件的请求的触发是入口Index.html中script标签是否引入触发的，所以只有当index.html里引入的js文件的名称发生变化才会触发重新加载。强缓存是不会去请求接口的，直接在本地缓存查找，一般显示code:200(from hard disk)这样的就代表从本地查找的。即便这里会进行请求，服务端也没有了对应的文件，会出现白屏的情况。
所以index.html及时更新很重要，通用的做法是对index.html设置弱缓存，每次刷新页面index.html都会拿着etag去服务器进行请求。etag是服务器自动生成的一个识别码（服务器对每个文件都生成自己的etag码）,只有文件发生了变化才会更新，如果请求时此文件etag没有发生变化，会返回300类状态（重定向），一般是304，代表要求客户端去读自己的缓存。如果文件发生变化了，那么服务器会返回最新的html，上面引用的Js hash自然也变了，于是就请求到了最新版本的代码。
我们项目遇到的问题是，nginx服务没有设置弱缓存（maxage=0,nocache），当然浏览器默认也是弱缓存来处理，所以一直没发生什么事。但是当你的项目是在iframe里被引用的，那么浏览器会默认你的html也是强缓存，所以就出现了问题。所以这里我们重新更新了nginx的配置，对html结尾的文件设置maxage = 0 ,no-cache。这样就强制为弱缓存了。