javascript - 计算页面重新加载

Question

我认为这是不可能的，但我会问问我们社区的巫师，也许有人有窍门。

当有人重新加载页面超过两次时，客户想要在我的 js 注入(inject)平台上触发一个事件。他拒绝在 cookie onbeforeonload 上设置一个值，也拒绝在服务器端设置一些可以计数的东西。

有人知道在客户端计算页面重新加载的方法吗？

Answer 1

performance.navigation可用于区分导航、历史导航和页面重新加载。

由于您想知道页面是否被刷新两次，因此需要某种形式的持久性，因为浏览器不会跟踪页面重新加载的次数。为此，history API似乎最明智，因为它的状态与页面实例相关联。

例如(显示重新加载次数的演示:https://robwu.nl/s/reloadCount.html):

// On load:
var state = history.state || {};
var reloadCount = state.reloadCount || 0;
if (performance.navigation.type === 1) { // Reload
    state.reloadCount = ++reloadCount;
    history.replaceState(state, null, document.URL);
} else if (reloadCount) {
    delete state.reloadCount;
    reloadCount = 0;
    history.replaceState(state, null, document.URL);
}
if (reloadCount >= 2) {
    // Now, do whatever you want...
    alert('The page was reloaded more than twice!');
}

我已经测试过该演示可以在以下浏览器中运行:

• Safari 8+
• Chrome 14+(可能也更早，我没有费心测试 13-)
• 歌剧 15+
• 火狐 7+
• Internet Explorer 9+

如果您需要支持较旧的浏览器(不支持 performance API)，那么您可以回退到在卸载时使用时间戳更新历史状态，并检查时间戳(例如history.state 中的 Date.now()) 接近加载时的当前时间。