在网页中与 timeonsitetracker.js API 集成时，如何获取实时“timeonsite”参数？

Question

我将 JS timeonsite 库timeonsitetracker.js 集成到网页中，如文档中所示，

<script type="text/javascript">
var Tos;
(function(d, s, id, file) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s);
    js.id = id;
    js.onload = function() {
        var config = {
            trackBy: 'seconds',
            developerMode: true
        };
        if(TimeOnSiteTracker) {
            Tos = new TimeOnSiteTracker(config);
        }
    };
    js.src = file;fjs.parentNode.insertBefore(js, fjs);
 } (document, 'script', 'TimeOnSiteTracker', '//cdn.jsdelivr.net/gh/saleemkce/timeonsite@1.1.0/timeonsitetracker.min.js'));
</script>

调用Tos对象后，

Tos.getTimeOnPage();

{
    TOSId: 13650383319214852
    TOSSessionKey: "6606159448467693493359"
    TOSUserId: "anonymous"
    URL: "https://localhost/index.html"
    currentTime: "2020-07-11 16:25:17.908"
    entryTime: "2020-07-11 16:24:36.911"
    timeOnPage: 41
    timeOnPageByDuration: "0d 00h 00m 41s"
    timeOnPageTrackedBy: "second"
    timeOnSite: 0
    timeOnSiteByDuration: "0d 00h 00m 00s"
    title: "real-time demo"
    trackingType: "tos"
}

在调用Tos.getTimeOnPage() API 时，我看到“ timeOnSite ”始终为“0”，但 timeOnPage 会定期更新。但是在刷新页面时，我得到了由跟踪器自动保存的数据库中更新的timeOnPage、timeOnSite 。有没有办法在页面上获取实时“ timeonsite ”参数，而无需刷新演示页面中给出的整个页面？

Answer 1

在演示页面中，他们所做的基本上是：

$(document).ready(function() {
   
    setInterval(function() {
    
    $('#timeOnSiteDuration').html(Tos.secondToDuration((Tos.getTimeOnPage()).timeOnSite + (Tos.getTimeOnPage()).timeOnPage));
                    
   }, 1000);

}

他们在 document.ready 中设置了 1 秒的间隔，以使用现场计算的时间来更新 id='timeOnSiteDuration' 的 'div'。

我认为您可以做的解决方案是这样的：使用 setInterval 并计算现场时间：

Tos.secondToDuration((Tos.getTimeOnPage()).timeOnSite + (Tos.getTimeOnPage()).timeOnPage)

您可以将此计算设置为变量或像演示页面一样，直接在 html 中显示它。