为什么从 Firefox 浏览器访问时，现场时间数据没有保存在数据库中?

2022-01-15 00:00:00 analytics firefox mariadb javascript

我们根据文档中的说明在我们的网站中包含了 timeonsite 库 timeonsitetracker

We included the timeonsite library timeonsitetracker in our website as per the instructions in doc

<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() {
        // save with XMLHttpRequest or sendBeacon
    var config = {
        trackBy: 'seconds',
        developerMode: true,
        callback: function(data) {
            console.log('***');  
            console.log(data);

            // give your endpoint URL/ server-side URL that is going to handle your TOS data which is of POST method. Eg. PHP, nodejs or python URL which saves this data to your DB

            var endPointUrl = 'http://localhost:4500/tos'; // replace with your endpoint URL

            if (data && data.trackingType) {
                if (data.trackingType == 'tos') {
                    if (Tos.verifyData(data) != 'valid') {
                        console.log('Data abolished!');
                        return; 
                    }
                }
                
                if (navigator && typeof navigator.sendBeacon === 'function') {
                    data.trasferredWith = 'sendBeacon';
                    var blob = new Blob([JSON.stringify(data)], {type : 'application/json'});
                    navigator.sendBeacon(endPointUrl, blob);
                }
                
            }    
        }};


        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>

刷新浏览器后，我在 Firefox Web 控制台中看到了正确记录的数据(启用日志持久性，否则每次刷新时都会清除日志).

After refreshing the browser, I see the data logged (enabled log persistence otherwise log is cleared on each refresh) in Firefox web console correctly.

***
{
    TOSId: 14650383319214848
    TOSSessionKey: "8808159448467693499978"
    TOSUserId: "anonymous"
    URL: "https://localhost/index.html"
    currentTime: "2021-03-30 16:25:17.908"
    entryTime: "2021-03-30 16:24:36.911"
    timeOnPage: 41
    timeOnPageByDuration: "0d 00h 00m 41s"
    timeOnPageTrackedBy: "second"
    timeOnSite: 41
    timeOnSiteByDuration: "0d 00h 00m 41s"
    title: "home page - rental crown"
    trackingType: "tos"
}

但此会话数据并未存储在 MariaDB 中.不知道数据的去向.在刷新第二页时，我再次在 Firefox Web 控制台中看到更新的数据对象，但在 MariaDB 中没有捕获数据.它在 Chrome 中工作，但似乎没有将数据正确存储在数据库中.知道如何解决 Firefox 中的问题吗?

But this session data is not stored in MariaDB. There is no clue where the data goes. On refreshing second page, again I see the updated data object in Firefox web console but no data captured in MariaDB. It worked in Chrome but doesn't seem to store the data properly in DB. Any idea how to fix the issue in Firefox?

我遵循 此处的文档.非常感谢您的帮助.

I followed the documentation here. And help is greatly appreciated.

推荐答案

我今天再次测试了这个.似乎 sendBeacon 在 Chrome、Firefox 等许多浏览器上都无法正常工作.Chrome 和Firefox 为此.

I tested this again today. It seems that sendBeacon was not working for sometime on many browsers like Chrome, Firefox and others. There were some open issues in both Chrome & Firefox for this.

但是今天，我在 Chrome 和 Chrome 上使用 timeOnSite tracker JS 再次测试了它.火狐.它似乎在页面刷新、标签关闭或浏览器关闭场景中成功地将数据发布到数据库.

But today, I tested it again for with timeOnSite tracker JS on both Chrome & Firefox. It seems that it posts the data successfully to database on page refresh, tab close or browser close scenarios.

更新日期:2021 年 11 月 13 日

浏览器成功运行版本:

Browsers working successfully with version:

Chrome:95.0.4638.69

Chrome: 95.0.4638.69

火狐:94.0.1

但请注意，这可能不适用于旧浏览器或不完全支持 sendBeacon 的浏览器.因此，如果在此类浏览器上无法获得实时站点数据，请使用请求对象回退到 localstorage 选项.

But be informed that this may not work in old browsers or browsers that don't support sendBeacon fully. So in case of not getting real-time time on site data on such browsers, fallback to localstorage option with request object.

var config = {
    trackBy: 'seconds',
    
    request: { // presence of request object denotes that data is to be saved in local storage
        url: 'http://localhost:4500/tos'
    }
}

相关文章