"sendBeacon" ne demek
Aşamalı web uygulamanız gibi bir istemciden istekte bulunmak istediğinizde kullanabileceğiniz iki seçeneği muhtemelen biliyorsunuzdur: XMLHttpRequest veya daha yeni "getirme". Ancak, analitik verileri gibi çok küçük veri parçalarını göndermek için özel olarak tasarlanmış üçüncü bir seçeneğin olduğunu biliyor muydunuz? Modern tarayıcılarda "navigator" nesnesinden kullanılabilen "sendBeacon" adlı bir işlevdir.
"SendBeacon" nasıl kullanılır
Küçük veri parçaları için bu amaca yönelik istek işlevini kullanmak gerçekten basittir. Navigatörde hem "navigator" hem de "sendBeacon" işlevi mevcut olduğu sürece, yapmanız gereken tek şey, gönderilecek yükün yanı sıra bir URL sağlamak.
Aşağıdaki veri türlerini gönderebilirsiniz.
- Dizi Tamponu
- ArrayBufferView
- kabarcık
- DOMString
- Form verisi
- URLArama Parametreleri
Her "sendBeacon" çağrısı, belirtilen uç noktaya bir POST isteği iletecektir.
async function track(payload: TrackPayload){
// We're using 'optional property access'
// for a simple and clean implementation.
//
// You could of course also use nested if(){ ... }.
await navigator?.sendBeacon?.('/track', payload);
}
// The following example is taken directly
// from the MDN page, linked in the addendum
// at the end of this page.
//
// It demonstrates the usage with the
// 'visibilitychange'-event when the user
// could close your web app.
document.addEventListener('visibilitychange', function logData() {
if (document.visibilityState === 'hidden') {
navigator.sendBeacon('/log', analyticsData);
}
});
farklı olan
"sendBeacon"un ana avantajı, isteklerinizin aslında aracı tarafından, yani şu anda istemcinizin yüklü olduğu tarayıcı tarafından sıraya alınmasıdır. Bir ağ bağlantısı mevcut olduğu sürece, veriler gönderilir. Hiçbir veri mevcut değilse veya kullanıcı web uygulamanızı kapatırsa (istek gönderilmeden önce), tarayıcı yine de isteğin eninde sonunda iletileceğini garanti eder.
Diğer yaygın istek işlevleri, bir kullanıcı web uygulamasını kapattığında (örneğin sekmeyi kapatarak) isteğinizin gönderileceğini garanti etmez. "sendBeacon" da tamamen eşzamansızdır ve web uygulamanızda başka bir sayfaya giderken herhangi bir gecikmeye neden olmaz ve yine de kullanıcının sayfa geçmişi için analitik verileri gönderir.
Web uygulamanızı aşamalı olarak geliştirin
Analitik verileri için özel bir uç noktanız varsa, bu yeni API'yi kesinlikle denemelisiniz. Bir kullanıcının API'yi desteklemeyen bir tarayıcıyla (bu pek olası olmasa da) web uygulamanızı çağırabileceğini lütfen unutmayın, böylece uygulamanızı kullanmadan önce basit bir destek kontrolü yaparak aşamalı olarak geliştirebilirsiniz.
