index.html緩存致使加載文件不是最新的解決方法

環境：
前端單頁面（Vue） + Nginx

問題：
http://xxx.com/a/ 訪問會跳轉到 http://xxx.com/a/Index 下，代碼有更新訪問 http://xxx.com/a/Index 完整連接index.html加載是最新的，訪問 http://xxx.com/a/ 仍是讀取的disk cache的內容，致使加載的頁面不是最新的。使得用戶不清理緩存展現的內容是錯誤的。

解決方法：
nginx下配置no-cache、no-store

示例：

location /a {
    add_header Cache-Control 'no-cache, no-store, must-revalidate,proxy-revalidate, max-age=0';
}

no-cache：能夠在本地緩存，能夠在代理服務器緩存，可是這個緩存要服務器驗證才能夠使用。index.html沒有改變，瀏覽器狀態碼是304。

no-store： 本地和代理服務器都不緩存，每次都從服務器獲取。index.html狀態碼始終是200。

must-revalidate： 緩存必須在使用以前驗證舊資源的狀態，而且不可以使用過時資源。表示若是頁面過時，則去服務器進行獲取。

proxy-revalidate： 與must-revalidate做用相同，但它僅適用於共享緩存（例如代理），並被私有緩存忽略。

max-age=<seconds>： 設置緩存存儲的最大週期，超過這個時間緩存被認爲過時(單位秒)。與Expires相反，時間是相對於請求的時間。max-age會覆蓋掉Expires。

在chrome network查看請求資源的時候，發現瀏覽器緩存有3中狀況。

• memory cache
  不訪問服務器，直接讀緩存。從內存中讀取，通常緩存資源不大的圖片等，瀏覽器關閉數據再也不。
• disk cache
  不訪問服務器，直接讀緩存，從磁盤中讀取緩存，當kill進程時，數據仍是存在。通常緩存資源較大的js、css等。
• 304
  訪問服務器，發現數據沒有更新，服務器返回此狀態碼。而後從緩存中讀取數據。

參考：
https://www.zhihu.com/question/64201378
https://blog.csdn.net/zs343961443/article/details/87258217