Session replay — mi ez és hogyan kapcsolod be

A session replay az egyik legerősebb adat a Yaplet hibajelentésében. Ahelyett, hogy egy leírást olvasnál arról, mi történt, megnézed — minden kattintást, görgetést és DOM-változást, amelyek zökkenőmentes visszajátszásként vannak rekonstruálva. Ez a cikk elmagyarázza, mit rögzít, hogyan működik az adatvédelmi modell, és hogyan kapcsolod be.

Mit rögzít a session replay

Ha a session replay engedélyezett, a Yaplet folyamatosan rögzíti a böngésző DOM-pillanatképeinek streamjét a háttérben. Amikor hibajelentés kerül beküldésre, a stream utolsó ~30 másodperce csatolásra kerül a tickethez. A visszajátszás tartalmazza:

• Az egérkurzor mozgásait és kattintásait
• Billentyűzet bevitelét (lásd az eltakarást alább)
• Oldalgörgetést
• DOM-változásokat — megjelenő, eltűnő vagy állapotot változtató elemeket
• CSS-változásokat — stílusfrissítések, animációk, átmenetek
• Hálózati kérések időzítését (szignálösszefoglalóként megjelenítve)
• Konzolhiba-eseményeket (szignálösszefoglalóként megjelenítve)

A visszajátszás tömörített formátumban kerül tárolásra, és nem videofájl — egy strukturált eseménynapló, amelyet a munkaterületen egy sandboxolt iFrame-ben játszik vissza, így nincs teljesítményterhelés a videokódolásból.

Mi van alapértelmezetten eltakarva

A session replay az rrweb nevű, nyílt forráskódú DOM-rögzítési könyvtárra épül. A Yaplet az alábbi alapértelmezéseket alkalmazza, mielőtt bármilyen adat elhagyná a böngészőt:

• Jelszómezők — az összes <input type="password"> érték soha nem kerül rögzítésre.
• gl-block osztályú elemek — teljesen ki vannak hagyva a rögzítésből; helyőrzőre vannak cserélve.
• gl-ignore osztályú elemek — üres helyőrzőként kerülnek rögzítésre (a struktúra megmarad, a tartalom kimarad).
• gl-mask osztályú elemek — a szövegtartalom csillagokra van cserélve.

Hogyan engedélyezed a session replay-t

1. Menj a Widgetek menüpontra a Yaplet irányítópultján, és nyisd meg a konfigurálni kívánt widgetet.
2. Nyisd meg a Beállítások fület.
3. Keresd meg a Session replay kapcsolót (vagy az Webes visszajátszások engedélyezése beállítást), és kapcsold be.
4. Mentsd el a widgetet.

A session replay alapértelmezetten ki van kapcsolva. Csak azoknál a widgeteknél engedélyezd, ahol a fejlettebb hibakeresési adatot szeretnéd.

Adatvédelmi vezérlők kiterjesztése az SDK-val

A fejlesztőcsapatod tovább mehet a Yaplet.setReplayOptions(options) hívással a Yaplet.initialize() előtt. Hasznos opciók:

• maskAllInputs: true — eltakar minden szöveges beviteli értéket, nem csak a jelszavakat.
• maskTextSelector: ".sensitive-data" — eltakarja a szöveget minden, CSS-szelektor által megjelölt elemben.
• blockSelector: "#payment-form" — teljesen kizár egy szakaszt a rögzítésből.
• ignoreCSSAttributes: ["color", "font-size"] — kizár CSS-tulajdonságokat a stílusképekből.

A hálózati naplók adatvédelme külön vezérelhető a Yaplet.setNetworkLogsBlacklist(["api.payments.com"]) és a Yaplet.setNetworkLogPropsToIgnore(["Authorization"]) metódusokkal.

GDPR-szempontok

A session replay felhasználói viselkedést rögzít, ami a GDPR szerint személyes adat. A megfelelés érdekében:

• Tüntesd fel a session replay-t az adatvédelmi irányelveidben és a cookie-értesítőben.
• Engedélyezd a maskAllInputs: true opciót, hacsak nincs konkrét okod a beviteli értékek rögzítésére.
• Használd a blockSelector opciót a felhasználói felületed bármely, személyes vagy pénzügyi adatot megjelenítő részének kizárásához.
• A Yaplet saját szerveres telepítése (EU Coolify stack) azt jelenti, hogy a visszajátszási adatok az EU-n belül maradnak, és soha nem mennek át egy US-alapú SaaS-szolgáltatón.