new rrwebPlayer({
target: document.body, // customizable root element
data: {
events: PUT_YOUR_EVENTS_ARRAY_HERE,
autoPlay: true,
},
});
index.js:1 Uncaught Error: Replayer need at least 2 events.
at new e (index.js:1)
at we._e (index.js:1)
at index.js:1
at w (index.js:1)
at g (index.js:1)
at new we (index.js:1)
at Module../src/pages/Home/HomePage.js (HomePage.js:244)
at __webpack_require__ (bootstrap:784)
at fn (bootstrap:150)
at Module../src/core/routes.js (DispatcherConstants.js:30)
at __webpack_require__ (bootstrap:784)
at fn (bootstrap:150)
at Module../src/App.js (index.scss:7)
at __webpack_require__ (bootstrap:784)
at fn (bootstrap:150)
at Module../src/index.js (HomePageDispatcher.js:3)
at __webpack_require__ (bootstrap:784)
at fn (bootstrap:150)
at Object.1 (DateUtils.js:31)
at __webpack_require__ (bootstrap:784)
at checkDeferredModules (bootstrap:45)
at Array.webpackJsonpCallback [as push] (bootstrap:32)
at main.chunk.js:1
Is the source code of that player available somewhere ?
dist/rrweb-snapshot.min.js from sources, but I can't figure out how to use it. I want to snapshot the web page, save it serialized data to DB and rebuild html later. Using: const snap = rrwebSnapshot.snapshot(document); console.log(snap); const html = rrwebSnapshot.rebuild(snap); console.log(html); What's wrong here? Please, help :)
Hi everyone! I've just builded
dist/rrweb-snapshot.min.jsfrom sources, but I can't figure out how to use it. I want to snapshot the web page, save it serialized data to DB and rebuild html later. Using: const snap = rrwebSnapshot.snapshot(document); console.log(snap); const html = rrwebSnapshot.rebuild(snap); console.log(html); What's wrong here? Please, help :)
Same problem here. I don't understand how to rebuild the snapshot. rrwebSnapshot.rebuild(snap) returns only an array with 2 keys. index 0 is null and index 1 contains an empty object. @Yuyz0112, can you please point me in the right direction?
var snap = rrwebSnapshot.snapshot(document); works, rrwebSnapshot.rebuild(snap); however doesn't.
Hi everyone! I've just builded
dist/rrweb-snapshot.min.jsfrom sources, but I can't figure out how to use it. I want to snapshot the web page, save it serialized data to DB and rebuild html later. Using: const snap = rrwebSnapshot.snapshot(document); console.log(snap); const html = rrwebSnapshot.rebuild(snap); console.log(html); What's wrong here? Please, help :)Same problem here. I don't understand how to rebuild the snapshot. rrwebSnapshot.rebuild(snap) returns only an array with 2 keys. index 0 is null and index 1 contains an empty object. @Yuyz0112, can you please point me in the right direction?
I'm not sure rrweb snapshot is meant to be used as its own package. AFAIK its more for internal use of rrweb. You can however use rrweb-record to save your page to a backend and replay it with rrweb-replayer (bare replayer) or rrweb-player (has play/pause buttons, and a timeline).
https://github.com/rrweb-io/rrweb/blob/master/guide.md is a good starting point
3 replies
import rrweb from 'rrweb/dist/rrweb.min';
let recodes = [];
let ss = rrweb.record({
emit(event) {
recodes.push(event);
if (recodes.length > 100) {
ss();
}
},
});
2 replies
Okay, so I came with that solution: recorded events are sent to server in "slices" (basically setInterval on client side). Each slice is then compressed with zlib, and written to database. When I need to replay the session, each slice is decompressed, and they are concatenated into single array
Hi @MrOnlineCoder , how is this pattern working for you? Have you come up with a better idea? Are you using a traditional DB for backend, or still MongoDB with compressed data. BTW, can't MongoDB compress on the fly when storing or reading from disk?