資訊專欄INFORMATION COLUMN
摘要：過早的發(fā)送數(shù)據(jù)可能導(dǎo)致錯(cuò)過收集數(shù)據(jù)的機(jī)會(huì)。因?yàn)橛脩舸硗ǔ?huì)忽略在卸載事件處理器中產(chǎn)生的異步。使用方法，將會(huì)使用戶代理在有機(jī)會(huì)時(shí)異步地向服務(wù)器發(fā)送數(shù)據(jù)，同時(shí)不會(huì)延遲頁面的卸載或影響下一導(dǎo)航的載入性能。
1 visibilitychange事件
觸發(fā)條件：瀏覽器標(biāo)簽頁被隱藏或顯示的時(shí)候會(huì)觸發(fā)visibilitychange事件.
使用場(chǎng)景：當(dāng)標(biāo)簽頁顯示或者隱藏時(shí)，觸發(fā)一些業(yè)務(wù)邏輯
document.addEventListener("visibilitychange", function() {
console.log( document.visibilityState );
});
2 storage事件
觸發(fā)條件：使用localStorage or sessionStorage存儲(chǔ)或者修改某個(gè)本地存儲(chǔ)時(shí)
使用場(chǎng)景：標(biāo)簽頁間通信
// AB頁面同源
// 在A 頁面
window.addEventListener("storage", (e) => {console.log(e)})
// 在B 頁面，向120打個(gè)電話
localStorage.setItem("makeCall","120")
// 然后可以在A頁面間有輸出, 可以看出A頁面 收到了B頁面的通知
...key: "makeCall", oldValue: "119", newValue: "120", ...
3 beforeunload事件
觸發(fā)條件：當(dāng)頁面的資源將要卸載(及刷新或者關(guān)閉標(biāo)簽頁前). 當(dāng)頁面依然可見，并且該事件可以被取消只時(shí)
使用場(chǎng)景：關(guān)閉或者刷新頁面時(shí)彈窗確認(rèn)，關(guān)閉頁面時(shí)向后端發(fā)送報(bào)告等
window.addEventListener("beforeunload", function (e) {
var confirmationMessage = "o/";
e.returnValue = confirmationMessage; // Gecko, Trident, Chrome 34+
return confirmationMessage; // Gecko, WebKit, Chrome <34
});
4 navigator.sendBeacon
這個(gè)方法主要用于滿足 統(tǒng)計(jì)和診斷代碼 的需要，這些代碼通常嘗試在卸載（unload）文檔之前向web服務(wù)器發(fā)送數(shù)據(jù)。過早的發(fā)送數(shù)據(jù)可能導(dǎo)致錯(cuò)過收集數(shù)據(jù)的機(jī)會(huì)。然而， 對(duì)于開發(fā)者來說保證在文檔卸載期間發(fā)送數(shù)據(jù)一直是一個(gè)困難。因?yàn)橛脩舸硗ǔ?huì)忽略在卸載事件處理器中產(chǎn)生的異步 XMLHttpRequest 。
使用 sendBeacon() 方法，將會(huì)使用戶代理在有機(jī)會(huì)時(shí)異步地向服務(wù)器發(fā)送數(shù)據(jù)，同時(shí)不會(huì)延遲頁面的卸載或影響下一導(dǎo)航的載入性能。這就解決了提交分析數(shù)據(jù)時(shí)的所有的問題：使它可靠，異步并且不會(huì)影響下一頁面的加載。此外，代碼實(shí)際上還要比其他技術(shù)簡(jiǎn)單！
注意：該方法在IE和safari沒有實(shí)現(xiàn)
使用場(chǎng)景：發(fā)送崩潰報(bào)告
window.addEventListener("unload", logData, false);
function logData() {
navigator.sendBeacon("/log", analyticsData);
}
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/51656.html
摘要：過早的發(fā)送數(shù)據(jù)可能導(dǎo)致錯(cuò)過收集數(shù)據(jù)的機(jī)會(huì)。因?yàn)橛脩舸硗ǔ?huì)忽略在卸載事件處理器中產(chǎn)生的異步。使用方法，將會(huì)使用戶代理在有機(jī)會(huì)時(shí)異步地向服務(wù)器發(fā)送數(shù)據(jù)，同時(shí)不會(huì)延遲頁面的卸載或影響下一導(dǎo)航的載入性能。 1 visibilitychange事件 觸發(fā)條件：瀏覽器標(biāo)簽頁被隱藏或顯示的時(shí)候會(huì)觸發(fā)visibilitychange事件. 使用場(chǎng)景：當(dāng)標(biāo)簽頁顯示或者隱藏時(shí)，觸發(fā)一些業(yè)務(wù)邏輯 do...
摘要：上個(gè)月，學(xué)習(xí)群里的同學(xué)問了個(gè)題目，大意可理解為列表降維，例子如下想得到結(jié)果原始數(shù)據(jù)是一個(gè)二維列表，目的是獲取該列表中所有元素的具體值。不經(jīng)意間，函數(shù)的注意事項(xiàng)，竟把其它的進(jìn)階內(nèi)容都聯(lián)系起來了。小小的函數(shù)，竟成為學(xué)習(xí)之路上的一個(gè)樞紐。 上個(gè)月，學(xué)習(xí)群里的 S 同學(xué)問了個(gè)題目，大意可理解為列表降維 ，例子如下： oldlist = [[1, 2, 3], [4, 5]] # 想得到結(jié)果：...
摘要：接下來，介紹了使用深度學(xué)習(xí)的計(jì)算機(jī)視覺系統(tǒng)在農(nóng)業(yè)零售業(yè)服裝量身定制廣告制造等產(chǎn)業(yè)中的應(yīng)用和趨勢(shì)，以及在這些產(chǎn)業(yè)中值得關(guān)注的企業(yè)。 嵌入式視覺聯(lián)盟主編Brian Dipert今天發(fā)布博文，介紹了2016年嵌入式視覺峰會(huì)（Embedded Vision Summit）中有關(guān)深度學(xué)習(xí)的內(nèi)容：谷歌工程師Pete Warden介紹如何利用TensorFlow框架，開發(fā)為Google Translate...
閱讀 2998·2021-11-23 09:51
閱讀 2820·2021-11-11 16:55
閱讀 2935·2021-10-14 09:43
閱讀 1403·2021-09-23 11:22
閱讀 1045·2019-08-30 11:04
閱讀 1674·2019-08-29 11:10
閱讀 970·2019-08-27 10:56
閱讀 3125·2019-08-26 12:01
