Bazen yanıt beklemek zorunda kalmadan bir web sayfasından web sunucusuna bazı veriler göndermek kullanışlı olur. Örneğin, analiz veya teşhis verilerini kullanıcı sayfadan çıkmadan önce göndermek isteyebiliriz.
Genellikle, çıkıştan önce veri göndermek unload etkinliğinin dinlenmesini gerektiriyordu.Çünkü isteğin daha önce herhangi bir zamanda gönderilmesi eksik verilerle sonuçlanabilir (ör. çıkıştan hemen önce gerçekleşen bir tıklamayı kaçırmış olabiliriz).
Dikkat edilmesi gereken nokta, kaldırma işleyicide gönderilen isteklerin eşzamanlı olması gerekmesiydi, çünkü çoğu tarayıcı genellikle bir kaldırma işleyicide yapılan eşzamansız XMLHttpRequests öğesini yoksayar.
Bu yaklaşım, kullanıcının yeni bir sayfa oluşturulabilmesi için isteğin geri gelmesini beklemesi gerektiğinden gezinmeyi yavaşlatır.
Beacon API, küçük veri yüklerine sahip HTTP isteklerini bir tarayıcıdan web sunucusuna eşzamansız bir şekilde göndermenizi sağlayarak sayfanın unload etkinliğindeki diğer kodları gecikmeden veya sonraki sayfada gezinmenin performansını etkilemeden bu sorunu çözer.
navigator.sendBeacon() yöntemi, verileri tarayıcı tarafından iletilmek üzere en kısa sürede sıraya alır ancak gezinmeyi yavaşlatmaz.
Tarayıcı, verileri aktarım için başarıyla sıraya koyabilirse true değerini döndürür. Aksi takdirde false değerini döndürür.
Aşağıdaki adreste bulunan sayfamızdan işaretçi verileri almak için kullanabileceğiniz bir sunucu uç noktamız olduğunu varsayalım:
https://putsreq.herokuapp.com/Dt7t2QzUkG18aDTMMcop
pagehide etkinlik işleyicisine bir sendBeacon() yöntemi eklersek kullanıcı sayfadan ayrıldığında uç nokta verileri alır:
Chrome Geliştirici Araçları'nda günlükleri koru onay kutusu işaretli olarak ağ sekmesini incelerseniz sayfadan ayrıldığınızda yukarıdaki uç noktaya gönderilen bir HTTP POST isteği görürsünüz.
Alternatif olarak, işaretçi verilerinin alınıp alınmadığını görmek için PutsReq inceleme sayfasını ziyaret edebilirsiniz.
Ayrıca, işaretçi verilerini göndermenize olanak tanıyan bir Polimer özel öğesi de vardır (<beacon-send>). ebidel.github.io/beacon-send adresine göz atın.