前端，靜態(tài)頁(yè)面如何給index.html后綴增加index.html?v=xxxxx 隨機(jī)數(shù)？

問(wèn)題是這樣的：
目前在做微信頁(yè)面，由于緩存很厲害，所以需要給index.html主頁(yè)面的url添加隨機(jī)數(shù)，就是說(shuō)當(dāng)每刷新一次頁(yè)面就請(qǐng)求一個(gè)不同的頁(yè)面，
window.location.href=window.location.href+"?v="+new Date().getTime();
如果這樣來(lái)做，頁(yè)面會(huì)不停的跳轉(zhuǎn)（因?yàn)樗⑿乱淮胃囊幌?url,導(dǎo)致了再一次刷新，陷入了一直刷新的死循環(huán)），

所以，我這樣來(lái)判斷“？”是否存在

if(window.location.href.indexOf("?")==-1) {
    window.location.href=window.location.href+"?v="+new Date().getTime();
}

但是，這樣又只能跳轉(zhuǎn)一次？

如何讓每刷新一次，跳轉(zhuǎn)一個(gè)不同的頁(yè)面，就說(shuō)后面隨機(jī)數(shù)要變化，而又不陷入死循環(huán)呢？

回答

編輯回答

未命名

我想出兩種方案，

1、服務(wù)器端返回文件的時(shí)候，設(shè)置響應(yīng)頭，

cache-control:no-cache

貌似是這樣，告訴瀏覽器不要緩存；

2、前端控制，核心是，如何區(qū)分代碼里修改 url 導(dǎo)致的刷新和用戶(hù)的刷新，代碼：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>

<body>
    <script>
    let presentTime = (new Date()).getTime(),
        hrefWithoutSearch = location.protocol + '//' + location.host + location.pathname;

    if (localStorage.getItem('previousHref') === null) {
        localStorage.setItem('previousHref', hrefWithoutSearch + "?v=" + presentTime);
        localStorage.setItem('previousAccessTime', presentTime);
        location.href = hrefWithoutSearch + "?v=" + presentTime;
    } else {
        let interval = presentTime - parseInt(localStorage.getItem('previousAccessTime'), 10);
        if (interval > 2000) {
            localStorage.setItem('previousAccessTime', presentTime);
            location.href = hrefWithoutSearch + "?v=" + presentTime;
        }
    }
    </script>
</body>

</html>

原理：

代碼修改 url 的刷新，不能繼續(xù)刷新，否則陷入死循環(huán)；
用戶(hù)的刷新要修改 url，返回新的頁(yè)面；

所以，onbeforeunload,onunload 都無(wú)法來(lái)區(qū)分，我想到的可以區(qū)分的就是，用戶(hù)的操作

鍵盤(pán)事件：F5，CTRL+R，地址欄回車(chē)，地址欄旁邊的刷新按鈕
鼠標(biāo)事件: 右鍵刷新

我覺(jué)得比較困難，尤其是地址欄回車(chē)按鈕和地址欄旁的刷新；所以想了另外一個(gè)妥協(xié)的辦法：

頁(yè)面每次加載，都去 localStorage 里獲取上次加載的時(shí)間 previousAccessTime，和當(dāng)前時(shí)間一減，得出 interval ，假設(shè)跟 3秒比較；

3秒外，認(rèn)為是用戶(hù)刷新的，在用戶(hù)刷新導(dǎo)致頁(yè)面重新加載原來(lái)的 url 時(shí)，更新 previousAccessTime ，修改 url，導(dǎo)致重新加載了一個(gè)新的頁(yè)面，這個(gè)時(shí)候的時(shí)間-previousAccessTime 通常小于 3秒，所以適用下一條；
3秒內(nèi)，就判斷是代碼修改 url 導(dǎo)致的，所以不再去修改 url，避免了循環(huán);
如果網(wǎng)速慢，導(dǎo)致了修改 url 重新加載的時(shí)間超過(guò)了3秒，那會(huì)重復(fù)，導(dǎo)致循環(huán)；
如果把時(shí)間改成譬如 10 秒，減少循環(huán)的可能，那么用戶(hù)在 10秒內(nèi)的刷新，就不會(huì)刷新。

后兩點(diǎn)是缺點(diǎn)，當(dāng)然可以通過(guò)其他方式去優(yōu)化，比如，