使用Javascript記錄網頁上的所有用戶互動

Question

我正在構建一個Web項目，即將在Beta階段發布。 我需要記錄用戶在網頁上執行的每個活動，例如：

• 頁面滾動
• 單擊以進入內部頁面，並在此跟隨它。
• 文字輸入

我需要捕獲這些事件以及它們的相對發生時間。 理想情況下，用於用戶會話的可播放視頻。 我進行了研究，但得到的解決方案僅捕獲點擊事件，而沒有相關的計時信息。

我覺得，記錄用戶交互不是很困難，並且像這樣使用json數據的解析器應該能夠重播視頻：

[
    {
        "time": 0,
        "page": "/page1",
        "event": "new_page",
        "locXY": [50,23]
    },
    {
        "time": 3.45,
        "page": "/page1",
        "event": "scroll",
        "locXY": [50,400]
    },
    {
        "time": 0,
        "page": "/page2",
        "event": "click",
        "locXY": [70,450]
    }
]

Answer 1

在每次點擊事件中，您都應請求Date.now以獲得時間戳。 那么你應該保存在不同的var稱為舊時代。 下次用戶單擊時，您可以執行curTime - prevTime以獲取時間差。 您可以在初始時間擴展它。 這樣，您可以通過執行curTime - initTime來查看自第一次單擊以來已經花費了多少時間。

在clickListener之外定義prevTime和initTime。

簡而言之：

//first click:
var curTime = Date.now;
prevTime = curTime;
initTime = curTime;

//Second click:
var curTime = Date.now;
var deltaTime = prevTime - curTime;
var timeSinceInit = initTime - curTime;

// define the new previous timestamp.
prevTime = curTime;

// then parse the data
{
    "time": deltaTime,
    "timeStamp": timeSinceInit,
    "page": "/page1",
    "event": "click",
    "locXY": [mouseX,mouseY]
}

編輯：

剛來找我，你應該節制這個。 否則，您將記錄大量數據的方式，這將對您的網站造成沉重負擔。