Terkadang Anda mungkin ingin memberi tahu server bahwa pengguna meninggalkan halaman. Ini berguna, misalnya, untuk membersihkan gambar yang belum disimpan yang disimpan sementara di server, untuk menandai pengguna itu sebagai "luring", atau untuk masuk saat mereka selesai sesinya.
Secara historis, Anda akan mengirim permintaan AJAX dalam beforeunload
fungsi tersebut, namun ini memiliki dua masalah. Jika Anda mengirim permintaan asinkron, tidak ada jaminan bahwa permintaan tersebut akan dijalankan dengan benar. Jika Anda mengirim permintaan sinkron, itu lebih dapat diandalkan, tetapi browser akan berhenti hingga permintaan selesai. Jika ini adalah permintaan yang lambat, ini akan menjadi ketidaknyamanan yang sangat besar bagi pengguna.
Untungnya, sekarang kami punya navigator.sendBeacon()
. Dengan menggunakan sendBeacon()
metode ini, data ditransmisikan secara asinkron ke server web saat Agen Pengguna memiliki kesempatan untuk melakukannya, tanpa menunda pembongkaran atau memengaruhi kinerja navigasi berikutnya. Ini menyelesaikan semua masalah dengan pengiriman data analitik: data dikirim dengan andal, dikirim secara asinkron, dan tidak memengaruhi pemuatan halaman berikutnya. Berikut contoh penggunaannya:
window.addEventListener("unload", logData, false);
function logData() {
navigator.sendBeacon("/log.php", analyticsData);
}
sendBeacon()
adalah didukung di:
- Tepi 14
- Firefox 31
- Chrome 39
- Safari 11.1
- Opera 26
- iOS Safari 11.4
Saat ini TIDAK didukung di:
- Internet Explorer
- Opera Mini
Berikut ini polyfill untuk sendBeacon () jika Anda perlu menambahkan dukungan untuk browser yang tidak didukung. Jika metode ini tidak tersedia di browser, itu akan mengirim permintaan AJAX sinkron sebagai gantinya.