一款開源 Web 會話重放工具,幫我們快速定位問題
會話重放是每個產(chǎn)品和開發(fā)團隊在產(chǎn)品投入生產(chǎn)后都需要的工具。這些工具使我們能夠了解最終用戶如何與產(chǎn)品交互。有了這些信息,我們可以了解諸如用戶體驗差距、由于用戶的不正確交互導(dǎo)致的業(yè)務(wù)邏輯問題、需要觸發(fā)復(fù)雜動作序列的邊緣案例以及許多其他選項。這里給大家推薦一款能夠支持裡會話的會話重放工具:「OpenReplay」。
OpenReplay 是一個可以自托管的會話回放套件,它可以讓我們查看用戶在我們的 Web 應(yīng)用程序上所做的事情,從而幫助我們更快地解決問題。
(資料圖片僅供參考)
OpenReplay 具有以下能力
會話重放:OpenReplay 重播用戶所做的事情,同時它還通過捕獲網(wǎng)絡(luò)活動、控制臺日志、JS 錯誤、存儲操作/狀態(tài)、頁面速度指標、cpu/內(nèi)存使用情況等來向我們展示網(wǎng)站或應(yīng)用程序的行為方式。消耗?。菏褂眉s 18KB (.gz) 的跟蹤器異步發(fā)送最少的數(shù)據(jù),對性能的影響非常有限。自托管:不再有安全合規(guī)性檢查,第三方處理用戶數(shù)據(jù)。OpenReplay 捕獲的所有內(nèi)容都保留在我們自己的云中,以便完全控制我們的數(shù)據(jù)。隱私控制:用于清理用戶數(shù)據(jù)的細粒度安全功能。易于部署:支持主要公共云提供商(AWS、GCP、Azure、DigitalOcean)特性OpenReplay 具有以下特性:
會話重放:讓我們重溫用戶的操作,了解他們在哪里遇到問題以及如何影響他們的行為。每個會話重播都會根據(jù)啟發(fā)式自動分析,以便于分類。DevTools:就像在我們自己的瀏覽器中調(diào)試一樣。OpenReplay 為我們提供完整的上下文(網(wǎng)絡(luò)活動、JS 錯誤、存儲操作/狀態(tài)和 40 多個指標),因此我們可以立即重現(xiàn)錯誤并了解性能問題。協(xié)助:通過查看用戶的實時屏幕并立即與他們進行溝通 (WebRTC) 來幫助我們支持用戶,而無需任何 3rd 方屏幕共享軟件。全方位搜索:按幾乎任何用戶操作/標準、會話屬性或技術(shù)事件進行搜索和過濾,因此我們可以回答任何問題。渠道:用于發(fā)現(xiàn)導(dǎo)致轉(zhuǎn)化和收入損失的最有影響力的問題。細粒度的隱私控制:選擇要捕獲的內(nèi)容、隱藏的內(nèi)容或忽略的內(nèi)容,這樣用戶數(shù)據(jù)甚至不會到達我們的服務(wù)器。面向插件:通過跟蹤應(yīng)用程序狀態(tài)(Redux、VueX、MobX、NgRx、Pania 和 Zusand)和記錄 GraphQL 查詢(Apollo、Relay)和 Fetch/Axios 請求,更快地找到根本原因。集成:將我們的后端日志與會話重播同步,并查看前后發(fā)生的情況。OpenReplay 支持 Sentry、Datadog、CloudWatch、Stackdriver、Elastic 等。使用這里,我們以 OpenReplay 的 Assist 功能為例,來簡單介紹一下使用。
我們可以使用以下命令來安裝 assist 插件
npminstall@openreplay/tracker-assist
然后,通過以下代碼來開啟
//...importOpenReplayfrom"@openreplay/tracker";importtrackerAssistfrom"@openreplay/tracker-assist";//...consttracker=newOpenReplay({projectKey:"yourprojectkey"});tracker.use(trackerAssist({}));//addthislinetracker.start();
前端的操作就是這么簡單,接下來主要就是后臺的任務(wù)了。
查看會話清單我們在托管的管理后臺上,點擊導(dǎo)航菜單上的Assist選項,如下圖
單擊此處后,我們將獲得活動輔助會話的列表。一旦用戶打開應(yīng)用程序,會話將自動出現(xiàn)在這里,我們將看到它如下所示:
我們可以看到以下信息:
用戶ID,我們可以使用跟蹤器上的 setUserID 方法進行設(shè)置;每個會話的開始時間和日期會話的持續(xù)時間(在屏幕截圖中顯示為“14 秒”)。關(guān)于用戶的地理信息這里有很多信息,這對于我們確定要實時觀看的會話很重要。我們可以使用搜索欄來幫助執(zhí)行復(fù)雜的查詢以找到正確的會話。
查看特定會話在找到要查找的會話后,單擊會話的“播放”圖標。這將進入客戶端應(yīng)用程序的實時視圖。
我們可以在下面的并排比較中看到“輔助”屏幕如何顯示正在觀察的當前用戶的會話。
當然,這里會有一些默認行為,來保護用戶的隱私數(shù)據(jù),跟蹤器會檢測用戶輸入的數(shù)據(jù)類型及其格式(如電子郵件字段)并決定現(xiàn)場保護它。
控制用戶的鼠標OpenReplay Assist 的一個額外的功能是控制客戶端鼠標指針的能力。通過此功能,我們將能夠控制鼠標并單擊應(yīng)用程序的不同位置。我們不能發(fā)送任何其他類型的輸入信號,不過這應(yīng)該足以幫助我們了。
要訪問此功能,我們只需單擊屏幕右上角的“遠程控制”鏈接。當我們這樣做時,客戶將看到一個請求權(quán)限的模式窗口。
確認后,我們將控制他們的鼠標,或者更確切地說,我們的指針將顯示在他們的屏幕上,我們將能夠單擊并與應(yīng)用程序交互,就像我們直接使用他們的鼠標一樣??梢栽谙旅娴钠聊唤貓D中看到,紅點是我們的輔助鼠標,而黑色指針是用戶的。
小結(jié)對于關(guān)心提供出色且完美的用戶體驗的團隊而言,查看用戶對應(yīng)用程序所做的事情的能力是非常實用的。最重要的是,OpenReplay 擁有此功能并能夠在不需要任何額外軟件的情況下進入會話并與用戶交互的能力。依托這些能力,我們能更準確地定位出問題所在。
?「OpenReplay」
地址:https://github.com/openreplay/openreplay
??:6.3k
語言:Python/TypeScript
?
關(guān)鍵詞: 應(yīng)用程序 做的事情 用戶數(shù)據(jù)
相關(guān)閱讀
-
世界熱推薦:今晚7:00直播丨下一個突破...
今晚19:00,Cocos視頻號直播馬上點擊【預(yù)約】啦↓↓↓在運營了三年... -
NFT周刊|Magic Eden宣布支持Polygon網(wǎng)...
Block-986在NFT這樣的市場,每周都會有相當多項目起起伏伏。在過去... -
環(huán)球今亮點!頭條觀察 | DeFi的興衰與...
在比特幣得到機構(gòu)關(guān)注之后,許多財務(wù)專家預(yù)測世界將因為加密貨幣的... -
重新審視合作,體育Crypto的可靠關(guān)系才能雙贏
Block-987即使在體育Crypto領(lǐng)域,人們的目光仍然集中在FTX上。隨著... -
簡訊:前端單元測試,更進一步
前端測試@2022如果從2014年Jest的第一個版本發(fā)布開始計算,前端開發(fā)... -
焦點熱訊:劉強東這波操作秀
近日,劉強東發(fā)布京東全員信,信中提到:自2023年1月1日起,逐步為...