JS註冊組｜瀏覽器點擊上／下一頁時能重新刷新頁面

前言

上次 PM 說他按瀏覽器的上一頁結果畫面當掉而且跑版，看了一下原來網頁這樣並不會自動刷新，所以會維持特效跑完的最後畫面，上網查才知道是緩存搞的鬼，明明照著網路上說的試來試去還是不行，後來找到這個就完美達到我的目的，筆記起來希望也可以幫助到更多人。

（ 圖片來源 ）

一開始先檢查 Html 是不是有些 Cache 相關機制有設定錯誤，設定方式如下:

<!-- HTTP 1.1 -->
<meta http-equiv="Cache-Control" content="no-cache"/>
<!-- HTTP 1.0 -->
<meta http-equiv="Pragma" content="no-cache"/>
<!-- Cache Expires -->
<meta http-equiv="Expires" content="0"/>

再來的最後通牒

使用 pageshow event ，判斷 event.persisted 屬性偵測網頁是否來自 BF Cache ，若是的話重新刷新頁面，或者因各自頁面需求來做一些改變即可。

window.onpageshow = function(event) {
  if (event.persisted) {
    window.location.reload() 
  }
};

資料來源

回到上一頁沒有reload