Követelmények: A fejlesztett termék nem garantálja, hogy nincsenek hibák, még ha a tesztelési szakaszban sem vannak problémák a gyártási környezetben, váratlan helyzetek merülhetnek fel a felhasználók számára, és ugyanez igaz a front-end oldalakra is. A Sentry és a Bugsnag is nagyon jó monitorozási termékek.
szemle
Az anomália információk monitorozása után hogyan küldhetem be az adatokat a háttérrendszer API-hoz? A Navigator.sendBeacon egy API, amely kis mennyiségű adatot küld a szerverre, különösen, ha egy oldalt hamarosan kitöltenek, például naplózás, felhasználói viselkedéselemzés stb.
Ha hagyományos XHR-t használsz adatküldéshez, speciális logikai feldolgozást kell végezned a frontend nyomkövető felületén. navigator.sendBeacon() metódusDobj egy üzenetet a böngészősorba, hogy még ha a küldés nem is hibázik, a hibát a frontend ne fogja el。
Navigator.sendBeacon bemutatva
A navigator.sendBeacon() metódus aszinkron módon küld egy HTTP POST kérést kis mennyiségű adattal a webszervernek. Paraméterek: url, data (ArrayBuffer, ArrayBufferView, Blob, DOMString, FormData vagy URLSearchParams típusú adatok)
Dokumentáció:
A hiperlink bejelentkezés látható.
A hiperlink bejelentkezés látható.
Használati forgatókönyvek
Naplózás, amikor az oldal eltávolításakor: Viselkedési adatokat rögzít, mint például az oldal eltartási ideje, kattintás viselkedése, PV, UV stb., amikor a felhasználó elhagyja az oldalt.
Elemzés és monitorozás: Felhasználói viselkedési adatok küldése analitikai szerverekre weboldal teljesítményének és felhasználói viselkedéselemzés céljából.
Állapotjelentés: Alkalmazás állapot- vagy hibainformációkat jelent a szervernek.
Teszt
A kódex a következő:
Mik a hasonlóságok és különbségek a Navigator.sendBeacon és az XHR and fetch között?
Hasonlóságok
Hálózati kérések küldése: Mindhárom módszert használják az adatok továbbítására a kliensről a szerverre.
Több adatformátum támogatása: Különböző formátumokban is tudnak adatokat küldeni, például stringekben, JSON-ban, bináris adatokban stb.
Különbségek
Navigator.sendBeacon
Arra használják, hogy kis mennyiségű adatot küldjenek az oldal eltávolításakor, és alkalmas naplózásra, elemzésre stb.
Az adatküldés aszinkron, de nem küld vissza semmilyen információt a hívónak, és nem tudja feldolgozni a szerver válaszát.
Úgy tervezték, hogy garantálja az adatátvitelt az oldal eltávolításakor, még akkor is, ha a böngésző zárva van vagy az oldal ugrik.
Mindig használj HTTPPOST kéréseket.
Nem kell feldolgozni a válaszokat, egyszerűen használható.
XMLHttpRequest
Összetettebb AJAX kérésekhez, amelyek válaszfeldolgozást igényelnek.
Szinkron vagy aszinkron kérések is előfordulhatnak.
Feldolgozhatod a szerver válaszát, és további feldolgozást végezhetsz (pl. JSON elemzés, státuszkódok kezelése stb.).
Gazdag eseményeket biztosít, mint például betöltés, onerror, onprogress stb., hogy nyomon kövesse a kérés különböző szakaszait.
Széles körben támogatott minden nagyobb böngészőben, beleértve néhány régebbi böngészőt is.
A használata bonyolultabb, és megköveteli a kérés különböző szakaszainak és állapotainak kezelését.
Csel
Egy modern kérési felület, amely az XMLHttpRequest helyettesítésére szolgál az egyszerűbb és rugalmasabb kérés- és válaszfeldolgozáshoz.
Mindig tegyél aszinkron kérést, és visszaküldj egy ígéret objektumot.
Támogatja a láncolt feldolgozási válaszokat, így könnyű a JSON, a folyamatállapotkódok és még sok más elemzése.
Támogatja az aszinkron/várakozás szintaxist, ami jobban illeszkedik a modern JavaScript fejlesztési szokásokhoz.
Jobb támogatás a tartományok közötti kérésekhez és a CORS-hez (Cross-Domain Resource Sharing).
Lehetővé teszi, hogy több opciót adjunk a kéréshez (pl. egyedi fejléc, kérés metódus stb.).
összefoglalás
A Navigator.sendBeacon egy megbízható API, különösen kis mennyiségű adat küldésére egy oldal eltávolítása esetén.
Előnyei az egyszerűség, a blokkolásmentesség és a megbízhatóság, különösen alkalmasak olyan helyzetekhez, mint a naplózás és a felhasználói viselkedés elemzése.
Aszinkron kérés történik, ami POST kérés.
Csak azt tudja megállapítani, hogy a böngésző feladatsorban van-e elhelyezve, de nem tudja megállapítani, hogy sikeresen elküldték-e.
Nem kell foglalkozni a megtérülési értékkel.
A böngésző kompatibilitási problémákat is meg kell jegyezni. |
Közzétéve: 2025-3-5 09:46:14
|
|
|
|
