iOS 上的 beforeunload 与 pagehide 是时候触发了答案

【问题标题】：Time to fire for beforeunload vs. pagehide on iOSiOS 上的 beforeunload 与 pagehide 是时候触发了
【发布时间】：2017-06-20 14:21:34
【问题描述】：

我使用beforeunload 事件作为代理我网站点击量指标的一种手段。例如，如果 beforeunload 在 click 事件的约 50 毫秒内触发，我可以确定用户何时选择了链接。

这在 iOS 上变得很复杂，因为它不支持 beforeunload。根据 Apple 文档，我已将 pagehide 替换为 beforeunload，但这没有相同的功能。看起来好像pagehide 替换了unload - 而不是beforeunload。在我的测试中，它们的触发时间平均相差约 1500 毫秒（pagehide 触发比beforeunload 晚得多）。这使得将pagehide 事件归因于点击变得非常困难。

iOS 上 safari 支持的事件是否可以接近beforeunload的触发时间？

注意：我知道这并不理想，还有其他更好的方法我可能最终会追求，但我仍然对此感到好奇。

【问题讨论】：

标签： javascript ios events safari onbeforeunload

【解决方案1】：

理论上pagehide 是 safari 中beforeunload 的替代品，但实际上并非如此。正确观察到触发 pagehide 事件的时间可能会有所不同，因为 safari 在后台获取新页面，当页面可用时它会触发 pagehide。

如果您正在寻找一个，则没有任何事件，但是您可以尝试这个 hack，只要 点击发生 safari stop running requestAnimationFrame。所以你可以尝试这样的事情，当点击发生时记录clickTs并开始在requestAnimationFrame函数中记录时间戳，现在当pageHide触发你只需检查clickTs和eventlastReqAnimTime之间的时间差，它应该大致500 毫秒之间。这样您就可以将click 归因于pageHide

var w = window,
reqAnim = null,
clickTs = 'record this when click happens',
eventlastReqAnimTime = +new Date,
logReqAnim = function() {
    eventlastReqAnimTime = +new Date;
    reqAnim = w.requestAnimationFrame(logReqAnim)
};
reqAnim = w.requestAnimationFrame(logReqAnim);
setTimeout(function () {
    w.cancelAnimationFrame(reqAnim);
}, 1500)
w.addEventListener('pagehide', function(){
    if(Math.abs(clickTs - eventlastReqAnimTime) < 500 ){
        console.log('your link was chosen')
    }
})

注意：上面的代码只是伪代码，运行前测试。

【讨论】：