Take VUE as an example. When vUE is packaged, the CSS and JS names are hashed, so the JS and CSS generated after the changes are packaged are unique. The page requests new resources, and there is no cache problem. But the entry file index. HTML will cause update problems due to caching, and if we update it and the browser is using caching, we’ll have a problem. Therefore, you need to set the import file not to use the forced cache, and need to go to the server every time to verify whether the file is modified, that is, use the negotiated cache.

Use the nginx reverse proxy, set in the corresponding server of the nginx.conf file, at present I practice a feasible way to write: server {listen 80; Server_name domain; Root file directory; index index.html; Try_files $uri /index.html; try_files $uri /index.html; } location ~.*\.(HTML)${add_header cache-control no-store; // use add_header cache-control no-cache; Add_header Pragma no-cache; }}Copy the code

(1) Cache-control: no-cache and cache-control: no-store

No-cache means no cache, but no-cache is not no cache, it uses negotiation cache, so no cache can be disabled. In terms of bandwidth saving, no-cache is better. If the file is not changed, only a small packet size is transmitted. If the file is changed, the entire file size is transmitted. Instead of no-store transferring the entire file size no matter what.

Pragma: no-cache: is different from cache-control: no-cache

Pragma: no-cache is the same as cache-control: no-cache, Pragma: no-cache is compatible with HTTP 1.0, cache-control: no-cache is provided by HTTP 1.1. Therefore, Pragma: no-cache can be applied to HTTP 1.0 and HTTP 1.1, while cache-Control: no-cache can only be applied to HTTP 1.1.

Refer to the article

www.cnblogs.com/duiniweixia…

www.cnblogs.com/SallyShan/p…