javascript - 웹사이트에서 사용자의 검색 기록, 버튼 클릭, 양식 작성 관련 행동 데이터를 얻을 수 있는 더 좋은 방법은 무엇입니까?

오늘의 인터뷰 질문입니다. 제가 생각한 가장 간단한 방법은 쿠키를 통해 사용자의 관련 데이터를 기록했다가 웹페이지가 닫힐 때 서버로 보내는 것이었습니다.

인터넷에서 바이두통계를 검색해 보니 GA 관련 정보도 쿠키를 통해 기록되는 것 같아요. 사진을 요청한 뒤 다른 매개변수를 가져오면 데이터가 저장되는 것 같아요.

다른 좋은 방법이 있는지 모르겠네요.

답글 내용:

오늘의 인터뷰 질문입니다. 제가 생각한 가장 간단한 방법은 쿠키를 통해 사용자의 관련 데이터를 기록했다가 웹페이지가 닫힐 때 서버로 보내는 것이었습니다.

인터넷에서 바이두통계를 검색해 보니 GA 관련 정보도 쿠키를 통해 기록되는 것 같아요. 사진을 요청한 뒤 다른 매개변수를 가져오면 데이터가 저장되는 것 같아요.

다른 좋은 방법이 있는지 모르겠네요.

더 말하지 않겠습니다. 스스로 알아내시면 됩니다

<code>var _hmt = _hmt || [];

/* 指定要响应JS-API调用的帐号的站点id */
//_hmt.push([ '_setAccount', 'XXXXXXXX' ]);
// 用于发送某个指定URL的PV统计请求，通常用于AJAX页面的PV统计。
// _hmt.push(['_trackPageview', pageURL]);
// 用于触发某个事件，如某个按钮的点击，或播放器的播放/停止，以及游戏的开始/暂停等。
// _hmt.push(['_trackEvent', category, action, opt_label, opt_value]);
// 用户访问一个安装了百度统计代码的页面时，代码会自动发送该页面的PV统计请求，如果不希望自动统计该页面的PV，就可以使用本接口。主要用于iframe嵌套页面等情况。
// _hmt.push(['_setAutoPageview', false]);


(function() {
    //加载百度的统计代码
    var hm = document.createElement("script");
    hm.src = "//hm.baidu.com/hm.js?XXXXXXX";
    var s = document.getElementsByTagName("script")[0];
    s.parentNode.insertBefore(hm, s);
})();


(function() {
    function doMonitorForDataTrack(target) {
        var target = target;
        var _track = target.getAttribute("data-track");
        if (typeof (_hmt) != "undefined" && _track != '') {
            if (_track.indexOf("_hmt.push") > -1) {
                eval(_track);
            } else {
                var _trackArr = _track.split('.');
                if (_trackArr.length < 2) return;
                var category = 'Click';// 必填项，参数为字符串
                var action = '';// 必填项，参数为字符串
                var label = '';// 可选，参数为字符串
                
                /**当只有一个分割字符，
                 * 例如 data-track="index.10001"，执行函数 _hmt.push(['_trackEvent', 'Click', 'index', '10001‘])
                 * */
                if (_trackArr.length == 2) {
                    category = 'Click';
                    action = _trackArr[0];// 必填项，参数为字符串
                    label = _trackArr[1];// 可选，参数为字符串
                }
                /**当有超过两个或两个以上分割字符，
                 * 如 data-track="songli.BTN.担保交易"，执行_hmt.push(['_trackEvent', 'songli', 'BTN', '担保交易‘]);
                 * 如 data-track="songli.BTN.担保交易.1002" ，执行_hmt.push(['_trackEvent', 'songli', 'BTN', '担保交易.1002‘]);
                 *  */
                else {
                    category = _trackArr.shift();// 必填项，参数为字符串
                    action = _trackArr.shift();// 必填项，参数为字符串
                    label = _trackArr.join('.');// 可选，参数为字符串
                }
                _hmt.push([ '_trackEvent', category, action, label ]);
            }
        }
    }

    function addEvent(obj, type, fn) {
        if (obj.attachEvent) {
            obj['e' + type + fn] = fn;
            obj[type+fn] = function(){obj['e'+type+fn]( window.event );}
            obj.attachEvent('on' + type, obj[type + fn]);
        } else
            obj.addEventListener(type, fn, false);
    }
    var _elemArr = document.getElementsByTagName('A'), _elemLen = _elemArr.length;
    var _body = document.body || document.documentElement;
    
    addEvent(_body, "click", function(event) {
        var event = event ? event : window.event;
        var target = event.srcElement ? event.srcElement : event.target;
        if (target.getAttribute('data-track')){
            doMonitorForDataTrack(target);
        } else if (target.nodeName == "IMG" && target.parentNode.getAttribute('data-track')) {
            doMonitorForDataTrack(target.parentNode);
        }
    });

})();</code>

트랙을 탐색하고 버튼을 클릭하여 서버의 mongo에 기록하면 js 양식이 dom을 모니터링합니다

쿠키에 저장되는 이러한 통계는 일반적으로 사용자를 식별하는 데 사용되는 일부 ID 값일 뿐입니다. 사용자의 작업 기록 데이터는 즉시 통계 서버로 전송되어야 하며, 전송하기 전에 로컬에 저장할 필요가 없으며 이러한 유형의 데이터는 혼잡을 일으키지 않습니다. 그것을 보내는 방법에 관해서는 대부분은 당신이 이해하는 것을 사용하여 단순히 사진을 로드하고 매개변수를 통해 데이터를 전달합니다.

"웹 페이지가 닫히면 서버로 전송됩니다." 이것은 문제입니다. 브라우저가 닫히면 JS는 기본적으로 아무것도 할 수 없습니다.