本文引自
https://github.com/ant-design/ant-design-pro/issues/1365
瀏覽器中，默認(rèn)會(huì)對(duì) html css js 等靜態(tài)文件、以及重定向進(jìn)行緩存，如果在HEAD頭中指定：
<head>
<meta http-equiv="Expires" content="0">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Cache-control" content="no-cache">
<meta http-equiv="Cache" content="no-cache">
</head>
瀏覽器不會(huì)緩存html，但是還是會(huì)對(duì)重定向緩存，并且這種方式并不規(guī)范，可能有的瀏覽器不支持。
解決方案是：
1） 對(duì)hash過(guò)的靜態(tài)文件還是采用默認(rèn)方式，客戶(hù)端會(huì)緩存。
2）對(duì)html文件，返回時(shí)增加頭：Cache-Control，必須每次來(lái)服務(wù)端校驗(yàn)，根據(jù)etag返回200或者304
對(duì)應(yīng)的nginx配置如下：
server{
? ? listen? 80; #監(jiān)聽(tīng)端口
? ? server_name example.com
? ? # 前端靜態(tài)文件
? ? location ~* \.(gif|jpg|jpeg|png|css|js|ico|eot|otf|fon|font|ttf|ttc|woff|woff2)$ {
? ? ? ? root /var/www/example-fe/dist/;
? ? }
? ? # 前端html文件
? ? location / {
? ? ? ? # disable cache html
? ? ? ? add_header Cache-Control 'no-cache, must-revalidate, proxy-revalidate, max-age=0';
? ? ? ? root /var/www/example-fe/dist/;
? ? ? ? index index.html index.htm;
? ? ? ? try_files $uri /index.html;
? ? }
}
由于瀏覽器緩存靜態(tài)文件的時(shí)間不可控，我們可以在nginx上自己配置expires 1M（1個(gè)月）
? ? # 前端靜態(tài)文件
? ? location ~* \.(gif|jpg|jpeg|png|css|js|ico|eot|otf|fon|font|ttf|ttc|woff|woff2)$ {
? ? ? ? root /var/www/example-fe/dist/;
? ? ? ? expires 1M;
? ? ? ? add_header Cache-Control "public";
? ? }
