javascript - 如何衡量页面上花费的时间？

Question

我想测量用户在页面上花费的时间(整数秒或 float 分钟)。我知道当他们离开页面时我可以触发一个卸载事件。但如何获得他们已经在那里度过的时间呢？

Answer 1

接受的答案很好，但是(作为替代方案)我已经在一个小型 JavaScript 库中投入了一些工作，该库可以计算用户在网页上停留的时间。它的另一个好处是可以更准确(但不是完美)跟踪用户实际与页面交互的时间。它忽略用户切换到不同选项卡、空闲、最小化浏览器等的时间。接受的答案中建议的 Google Analytics 方法有一个缺点(据我所知):它只检查您何时处理新请求。领域。它将先前的请求时间与新的请求时间进行比较，并将其称为“在网页上花费的时间”。它实际上并不知道是否有人正在查看您的页面、是否已最小化浏览器、自上次加载您的页面以来是否已将选项卡切换到 3 个不同的网页等。

编辑:我已更新示例以包含当前的 API 使用情况。

编辑 2:更新托管项目的域

https://github.com/jasonzissman/TimeMe.js/

其用法示例:

包含在您的页面中:

<!-- Download library from https://github.com/jasonzissman/TimeMe.js/ -->
<script src="timeme.js"></script>
<script type="text/javascript">
TimeMe.initialize({
    currentPageName: "home-page", // page name
    idleTimeoutInSeconds: 15 // time before user considered idle
});
</script>

如果您想自己向后端报告时间:

xmlhttp=new XMLHttpRequest();
xmlhttp.open("POST","ENTER_URL_HERE",true);
xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
var timeSpentOnPage = TimeMe.getTimeOnCurrentPageInSeconds();
xmlhttp.send(timeSpentOnPage);

TimeMe.js 还支持通过 websockets 发送计时数据，因此您不必尝试将完整的 http 请求强制发送到 document.onbeforeunload 事件中。