微信中h5頁面用window.history.go(-1)返回上一頁頁面不會從新加載問題

問題描述：

　　　　在實際開發中遇到這樣一個問題，業務需求涉及到返回上一頁問題，第一時間想到了window.history.go(-1)方法，這樣作自己沒有任何問題，可是在微信中，安卓手機還好返回上一頁頁面會從新加載，而ios卻不會從新加載頁面，這就很難受了。

解決方案：

　　　　網上查閱了不少資料發現不少方法都不可行，那些方法就不一一展現了，直接上最終代碼。

 

window.addEventListener('pageshow', function(e) {
    // 經過persisted屬性判斷是否存在 BF Cache
    if (e.persisted) {
        location.reload();
    }
});

 

原理：pageShow事件在頁面顯示即會觸發，不管頁面是否來自BF Cache。經過檢測persisted屬性便可判斷是否存在 BF Cache 行爲。
優勢：大部分瀏覽器都支持pageShow方法與persisted屬性，而且須要的代碼量只須要短短4行便可。
缺點：每種瀏覽器中BF Cache的機制是不一樣的，部分瀏覽器中的Bf Cache仍是會從新執行js代碼，會形成重複渲染效果。固然如今咱們只考慮Ios中的微信頁面， 因此是不存在問題。

 

關於瀏覽器前進/後退緩存（BF Cache）問題詳細參考：http://harttle.land/2017/03/12/backward-forward-cache.html