基於Web的屏幕截圖ala userfly.com？

我正在退房http://userfly.com/demo。它捕獲所有的鼠標點擊和鍵盤敲擊，並播放一切。沒有安裝任何軟件，這是如何完成的？純Javascript？它看起來不像使用Flash。我可以使用什麼工具在我自己的網站上放置類似的東西，將其提供給其他人？基於Web的屏幕截圖ala userfly.com？

來源

2010-07-21 Tony_Henrich

這是相當令人印象深刻。 – Stephen 2010-07-21 19:17:29

你只是想記錄任何鼠標/鍵盤操作或實際拍攝用戶的屏幕圖片？ – sigint 2010-07-21 19:22:09

@sigint - 就像userfuly一樣。我不確定在沒有底層屏幕的情況下捕獲鼠標/鍵盤操作的用途。 – 2010-07-22 16:15:03

基本上我認爲做什麼是捕獲window.event每當發生什麼事情時，他們記錄事件是什麼，它做了什麼以及時間。然後剛剛重建的播放。我不知道是否有工具可以做到這一點，但基本概念不應該很難。保存數據和檢索的方法可能是最難的部分。

來源

2010-07-21 19:26:31 qw3n

不，沒有window.event，它們將頁面加載時的處理程序的色調綁定到window.document。 – 2010-07-21 19:57:15

這個。我認爲你最難的部分是以不顯眼的方式保存數據。顯然你使用ajax，但是你必須以一種不會由於頁面刷新導航等原因而失敗的方式來實現。它的很多數據可以快速保存。 – 2010-07-21 20:04:46

@llya我想你可以這樣做。但我認爲，至少在現代瀏覽器中，你可以捕捉一個事件，然後決定它是什麼事件。似乎更容易做到這一點。當然，我沒有寫代碼...... @nathan我也在想這個。特別是鼠標到處都可以節約。我用檢查員看了一下頁面，裏面充滿了座標點。 – qw3n 2010-07-21 20:13:43

它們使用稱爲「_bindEvents」的函數將所有可能的事件綁定到文檔級對象，從而爲用戶在頁面上執行的每個操作創建代表。他們還記錄每個事件發生時的時間戳。他們保存數據的方式是將它們轉換爲JSON字符串並加載一個1x1圖像作爲查詢字符串參數傳遞JSON字符串。

他們回放的方式很簡單，他們只是導致所有事件以相同的順序回到頁面。除鼠標移動事件外。由於無法使鼠標光標從JavaScript移動，因此它們會創建一個div，其圖像看起來像鼠標光標，並在預記錄器序列中移動。相當容易，但也相當可觀。

來源

2010-07-21 19:55:47

也看起來他們緩存頁面，因爲它在服務器上，允許他們將html拉出來並呈現一個與您所在頁面完全相同的頁面，但它不會有任何跨站點腳本問題 – 2010-07-21 20:11:39

你問過其他類似的工具，你應該試試http://mouseflow.com。它提供了與Userfly相同的錄製/回放功能，但它也提供顯示點擊，鼠標移動和頁面滾動行爲的熱圖。它支持在登錄後面記錄頁面，會話相關頁面（如結賬頁面）。有免費和付費計劃。

拉塞

（代表Mouseflow.com）

來源

2010-07-22 12:44:51 Mouseflow

我想要一個類似的工具，我可以自己安裝。不只是另一種類似的服務。 – 2010-07-22 16:20:04

基於Web的屏幕截圖ala userfly.com？

回答

相關問題