首页 >web前端 >js教程 >即使浏览器关闭,如何可靠地跟踪用户离开网页的情况?

即使浏览器关闭,如何可靠地跟踪用户离开网页的情况?

DDD
DDD原创
2024-11-24 11:13:11180浏览

How Can I Reliably Track User Departure from a Web Page, Even with Browser Closure?

JavaScript、浏览器和窗口关闭:跟踪用户离开

跟踪用户离开对于在用户离开之前捕获数据和执行操作至关重要一页。虽然监视导航事件相对简单,但在没有用户交互的情况下检测窗口关闭或 URL 更改构成了挑战。

捕获窗口关闭事件

Beacon API,在现代中可用浏览器,提供了解决方案。 Beacon 请求的设计目的是,即使用户突然离开页面,也能执行关键操作。

要使用 Beacon API,请使用以下代码片段:

var url = "https://example.com/foo";
var data = "bar";

navigator.sendBeacon(url, data);

旧版浏览器的替代方案

如果需要支持旧版浏览器,则visibilitychange事件提供后备。在这种情况下,从“被动”到“隐藏”的转变意味着用户即将离开。下面是一个示例:

document.addEventListener('visibilitychange', function() {
  if (document.visibilityState === "hidden") {
    // Perform desired actions (e.g., send beacon request)
  }
});

可靠性和广告拦截器

Visibilitychange 已成为现代浏览器中用户退出的可靠指标。但是,广告拦截器可能会干扰信标请求,尤其是跨源或源自已知跟踪域的情况。

跨站点注意事项

信标请求是尊重的 POST 请求CORS 限制。发出跨站请求时,请确保它们满足必要的要求,以避免被浏览器阻止。

以上是即使浏览器关闭,如何可靠地跟踪用户离开网页的情况?的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn