From cb17e94ad8c0756803888014852b3a126aa8210a Mon Sep 17 00:00:00 2001
From: zhengyiming <540361168@qq.com>
Date: 星期二, 01 七月 2025 17:31:02 +0800
Subject: [PATCH] fix: 江佑保系统健壮性修复
---
src/utils/record.ts | 91 +++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 91 insertions(+), 0 deletions(-)
diff --git a/src/utils/record.ts b/src/utils/record.ts
new file mode 100644
index 0000000..1c4c87e
--- /dev/null
+++ b/src/utils/record.ts
@@ -0,0 +1,91 @@
+import * as rrweb from 'rrweb';
+import { guid } from './common';
+import { eventWithTime, listenerHandler } from '@rrweb/types';
+import { storageLocal } from './storage';
+
+export class Recorder {
+ // 鐢熸垚浼氳瘽ID锛堢敤浜庢爣璇嗕竴娆℃姇淇濇祦绋嬶級
+ sessionId = guid();
+ // 瀛樺偍褰曞埗浜嬩欢鐨勬暟缁�
+ events = [];
+
+ stopFn: () => void;
+
+ // 鍒濆鍖栧綍鍒跺櫒
+ init() {
+ this.stopFn = rrweb.record({
+ emit: (event) => {
+ // 鏀堕泦浜嬩欢锛堝彲閫夋嫨瀹炴椂鍙戦�佸埌鍚庣锛�
+ this.events.push(event);
+
+ // 瀹氭湡鍙戦�佷簨浠跺埌鍚庣锛堥伩鍏嶅唴瀛樺崰鐢ㄨ繃澶э級
+ if (this.events.length % 100 === 0) {
+ this.sendEventsToBackend(this.events.splice(0, 100), this.sessionId);
+ }
+ },
+ // 鍙�夐厤缃細蹇界暐鏁忔劅鍏冪礌
+ blockClass: 'rr-block', // 涓烘晱鎰熷厓绱犳坊鍔犳class
+ ignoreClass: 'rr-ignore', // 瀹屽叏蹇界暐鐨勫厓绱�
+ });
+ }
+
+ // 缁撴潫褰曞埗锛堜緥濡傛彁浜ゆ姇淇濊〃鍗曟椂锛�
+ stopRecordingAndSave() {
+ this.stopFn?.();
+ // 鍙戦�佸墿浣欎簨浠跺埌鍚庣
+ if (this.events.length > 0) {
+ this.sendEventsToBackend(this.events, this.sessionId);
+ }
+ // 瀛樺偍浼氳瘽ID锛堝叧鑱斿埌鐢ㄦ埛鎶曚繚璁板綍锛�
+ this.saveSessionIdToUserRecord(this.sessionId);
+ }
+
+ saveSessionIdToUserRecord(sessionId: string) {}
+
+ async sendEventsToBackend(events: eventWithTime[], sessionId: string) {
+ try {
+ const body = JSON.stringify({
+ sessionId,
+ events,
+ timestamp: new Date().toISOString(),
+ });
+ console.log('body: ', body);
+ const storageEvents = storageLocal.getItem(`events`) || {};
+ storageEvents[sessionId] = events;
+ storageLocal.setItem(`events`, storageEvents);
+ // await fetch('/api/recordings', {
+ // method: 'POST',
+ // headers: {
+ // 'Content-Type': 'application/json',
+ // },
+ // body: ,
+ // });
+ } catch (error) {
+ console.error('Failed to send recording events:', error);
+ // 鍙疄鐜版湰鍦板瓨鍌ㄤ綔涓洪檷绾ф柟妗�
+ }
+ }
+
+ async replaySession(sessionId: string) {
+ // 浠庡悗绔幏鍙栧綍鍒朵簨浠�
+ // const response = await fetch(`/api/recordings/${sessionId}`);
+ // const { events } = await response.json();
+ const storageEvents = storageLocal.getItem(`events`) || {};
+ if (!storageEvents[sessionId]) {
+ return;
+ }
+
+ // 鍒濆鍖栧洖鏀惧櫒
+ const player = new rrweb.Replayer(storageEvents[sessionId], {
+ root: document.getElementById('replay-container'),
+ });
+
+ // 鍙�夛細鎺у埗鍥炴斁閫熷害
+ player.play(1.0); // 1鍊嶉��
+
+ // 鍙�夛細鐩戝惉鍥炴斁浜嬩欢
+ player.on('play', () => console.log('Replay started'));
+ player.on('pause', () => console.log('Replay paused'));
+ player.on('finish', () => console.log('Replay finished'));
+ }
+}
--
Gitblit v1.9.1