Zahteve: Razvit izdelek ne more zagotoviti, da ni hroščev, tudi če ni težav v fazi testiranja, če je nameščen v produkcijskem okolju, lahko pride do nepričakovanih situacij za uporabnike, enako velja za sprednje strani. Sentry in Bugsnag sta oba zelo dobra orodja za spremljanje.
pregled
Po spremljanju informacij o anomalijah, kako naj podatke oddam v backend API? Navigator.sendBeacon je API za pošiljanje majhnih količin podatkov strežniku, še posebej, ko se stran pripravlja na nalaganje, kot so beleženje, analiza vedenja uporabnikov itd.
Če uporabljate tradicionalni XHR za pošiljanje podatkov, morate na vmesniku za sledenje na frontendu izvajati posebno logično obdelavo. metoda navigator.sendBeacon()Sporočilo vključite v vrsto brskalnika, tako da tudi če pošiljanje ne uspe, sporočilo o napaki ne bo zaznano s strani vmesnika。
Navigator.sendBeacon predstavljen
Metoda navigator.sendBeacon() pošlje HTTP POST zahtevo z majhno količino podatkov na spletni strežnik asinhrono. Parametri: url, podatki (podatki tipa ArrayBuffer, ArrayBufferView, Blob, DOMString, FormData ali URLSearchParams)
Dokumentacija:
Prijava do hiperpovezave je vidna.
Prijava do hiperpovezave je vidna.
Scenariji uporabe
Beleženje ob odstranitvi strani: Beleži vedenjske podatke, kot so čas zadrževanja strani, klik, PV, UV itd., ko uporabnik zapusti stran.
Analitika in spremljanje: Pošiljanje podatkov o vedenju uporabnikov na analitične strežnike za spremljanje uspešnosti spletnih strani in analizo vedenja uporabnikov.
Poročanje o stanju: Strežniku poroča o stanju aplikacije ali informacijah o napakah.
Preizkus
Koda je naslednja:
Kakšne so podobnosti in razlike med Navigator.sendBeacon in XHR ter fetch?
Podobnosti
Pošiljanje omrežnih zahtevkov: Vse tri metode se uporabljajo za pošiljanje podatkov od odjemalca do strežnika.
Podpora za več podatkovnih formatov: Lahko pošiljajo podatke v različnih formatih, kot so nizi, JSON, binarni podatki itd.
Razlike
Navigator.sendBeacon
Uporablja se za pošiljanje majhne količine podatkov ob odstranitvi strani in je primeren za beleženje, analizo podatkov itd.
Pošiljanje podatkov je asinhrono, vendar ne vrača nobenih informacij klicatelju in ne more obdelati odziva strežnika.
Zasnovan je tako, da zagotavlja dostavo podatkov ob odstranitvi strani, tudi ko je brskalnik zaprt ali stran preskoči.
Vedno uporabljajte HTTPPOST zahteve.
Ni potrebe po obdelavi odgovorov, preprosto za uporabo.
XMLHttpRequest
Za bolj zapletene AJAX zahteve, ki zahtevajo obdelavo odgovorov.
Lahko se odprejo sinhrone ali asinhrone zahteve.
Lahko obdelaš odziv strežnika in nadaljuješ obdelavo (npr. razčlenjevanje JSON-a, obdelavo statusnih kod itd.).
Omogoča bogate dogodke, kot so onload, onerror, onprogress itd., za spremljanje različnih faz zahteve.
Široko podprt v vseh večjih brskalnikih, vključno z nekaterimi starejšimi brskalniki.
Uporaba je bolj zapletena in zahteva obravnavo različnih faz in stanja zahteve.
Puščati
Sodoben vmesnik za zahteve, ki nadomesti XMLHttpRequest za enostavnejšo in bolj prilagodljivo obdelavo zahtevkov in odgovorov.
Vedno naredite asinhrono zahtevo in vrnite objekt Obljube.
Podpira verižne procesne odzive, kar omogoča enostavno razčlenjevanje JSON, kode stanja procesov in še več.
Podpira sintakso async/await, ki je bolj v skladu z modernimi JavaScript razvojnimi navadami.
Boljša podpora za zahteve med domenami in CORS (Cross-Domain Resource Sharing).
Omogoča dodajanje več možnosti zahtevi (npr. prilagojena glava, metoda zahteve itd.).
Povzetek
Navigator.sendBeacon je API, zasnovan za zanesljivost, zlasti za pošiljanje majhnih količin podatkov ob odstranitvi strani.
Ima prednosti preprostosti, neblokiranja in zanesljivosti, še posebej pa je primeren za scenarije, kot so beleženje in analiza vedenja uporabnikov.
Izvedena je asinhrona zahteva, ki je POST zahteva.
Lahko določi le, ali je uvrščena v vrsto opravil brskalnika, ne more pa ugotoviti, ali je bila uspešno poslana.
Ni potrebe, da se ukvarjate z donosno vrednostjo.
Težave z združljivostjo brskalnika je treba omeniti. |
Objavljeno 2025-3-5 09:46:14
|
|
|
|
