Požiadavky: Vyvinutý produkt nemôže zaručiť, že neexistujú chyby, aj keď v testovacej fáze nie sú žiadne problémy, nasadený do produkčného prostredia, môžu nastať neočakávané situácie pre používateľov, a to isté platí pre front-end stránky. Sentry aj Bugsnag sú veľmi dobré monitorovacie produkty.
revízia
Po monitorovaní informácií o anomáliách, ako ich mám odoslať do backend API? Navigator.sendBeacon je API na odosielanie malých množstiev dát na server, najmä keď sa stránka chystá načítať, napríklad pri logovaní, analýze správania používateľov a podobne.
Ak používate tradičný XHR na odosielanie dát, musíte vykonať špeciálne logické spracovanie na sledovacom rozhraní na frontende. metóda navigator.sendBeacon()Vložte správu do fronty prehliadača, aby aj v prípade, že odoslanie zlyhá, jej chybové hlásenie nebolo zachytené frontendom。
Predstavenie Navigator.sendBeacon
Metóda navigator.sendBeacon() posiela HTTP POST požiadavku s malým množstvom dát na webový server asynchrónne. Parametre: url, dáta (údaje typu ArrayBuffer, ArrayBufferView, Blob, DOMString, FormData alebo URLSearchParams)
Dokumentácia:
Prihlásenie na hypertextový odkaz je viditeľné.
Prihlásenie na hypertextový odkaz je viditeľné.
Scenáre použitia
Zaznamenávanie pri odinštalovaní stránky: Zaznamenáva údaje o správaní, ako je čas zotrvania stránky, správanie kliknutí, PV, UV a pod., keď používateľ stránku opustí.
Analytika a monitorovanie: Odosielanie údajov o správaní používateľov na analytické servery na monitorovanie výkonu webu a analýzu správania používateľov.
Hlásenie stavu: Hlási stav aplikácie alebo informácie o chybe serveru.
Test
Kód je nasledovný:
Aké sú podobnosti a rozdiely medzi Navigator.sendBeacon a XHR a fetch?
Podobnosti
Odosielanie sieťových požiadaviek: Všetky tri metódy sa používajú na odosielanie dát z klienta na server.
Podpora viacerých dátových formátov: Môžu posielať dáta v rôznych formátoch, ako sú reťazce, JSON, binárne dáta a podobne.
Rozdiely
Navigator.sendBeacon
Používa sa na odosielanie malého množstva dát po odinštalovaní stránky a je vhodný na logovanie, analýzu údajov a podobne.
Odosielanie dát je asynchrónne, ale nevracia žiadne informácie volajúcemu a nemôže spracovať odpoveď servera.
Navrhnutý tak, aby zaručil doručenie dát pri odinštalovaní stránky, aj keď je prehliadač zatvorený alebo stránka preskakuje.
Vždy používajte HTTPPOST požiadavky.
Nie je potrebné spracovávať odpovede, jednoducho sa používa.
XMLHttpRequest
Pre zložitejšie AJAX požiadavky, ktoré vyžadujú spracovanie odpovedí.
Je možné vykonávať synchronné alebo asynchrónne požiadavky.
Môžete spracovať odpoveď servera a vykonať ďalšie spracovanie (napr. parsovanie JSON, spracovanie stavových kódov a pod.).
Poskytuje bohaté udalosti ako onload, onerror, onprogress a pod., na monitorovanie rôznych fáz požiadavky.
Široko podporované vo všetkých hlavných prehliadačoch, vrátane niektorých starších prehliadačov.
Je zložitejšia na používanie a vyžaduje riešenie rôznych fáz a stavov požiadavky.
Priniesť
Moderné rozhranie požiadaviek, ktoré nahradí XMLHttpRequest pre jednoduchšie a flexibilnejšie spracovanie požiadaviek a odpovedí.
Vždy vykonajte asynchrónnu požiadavku, ktorá vráťa objekt Promise.
Podporuje reťazené spracovanie odpovedí, čo uľahčuje analýzu JSON, stavových kódov spracovania a ďalšie.
Podporuje async/await syntax, ktorá je viac v súlade s modernými JavaScript vývojárskymi návykmi.
Lepšia podpora pre požiadavky medzi doménami a CORS (zdieľanie zdrojov medzi doménami).
Umožňuje pridať viac možností k požiadavke (napr. vlastná hlavička, metóda požiadavky a pod.).
súhrn
Navigator.sendBeacon je API navrhnuté pre spoľahlivosť, najmä na odosielanie malých množstiev dát pri odinštalovaní stránky.
Má výhody jednoduchosti, neblokovania a spoľahlivosti a je obzvlášť vhodný pre situácie ako logovanie a analýza správania používateľov.
Je vykonaný asynchrónny požiadavok, ktorý je POST požiadavkou.
Môže len určiť, či je zaradený do fronty úloh prehliadača, ale nemôže určiť, či bol úspešne odoslaný.
Nie je potrebné riešiť hodnotu návratnosti.
Je potrebné poznamenať problémy s kompatibilitou prehliadača. |
Zverejnené 5.3.2025 09:46:14
|
|
|
|
