Navigator.sendBeacon（）傳遞頭信息

Question

我使用navigator與服務器進行通信，但問題是我們需要傳遞一些頭信息，因爲有過濾器可以識別請求來自有效源。

任何人都可以幫忙嗎？

謝謝。

Answer 1

@Vipul Panth有幫助的信息，但我想提供一些更完整的細節。

首先，請注意navigator.sendBeacon在所有瀏覽器中都不受支持。有關此功能的更多詳細信息以及當前支持的瀏覽器MDN documentation。

你確實創建了一個blob來提供標題。下面是一個例子：

window.onunload = function() { 
    let body = { 
    id, 
    email 
    }; 
    let headers = { 
    type: 'application/json' 
    }; 
    let blob = new Blob([JSON.stringify(body)], headers); 
    navigator.sendBeacon('url', blob); 
}); 

navigator.sendBeacon將發送設置爲無論是在headers.type在Content-Type請求標頭的POST請求。這似乎是你可以在一個信標中設定雖然只有頭，每W3C：

的sendBeacon方法不提供自定義請求的方法，提供自定義請求頭，或更改請求等加工性質的能力和迴應。需要此類請求的非默認設置的應用程序應該使用帶有Keepalive標誌的[FETCH] API設置爲true。

我能夠觀察一些如何通過這個Chromium bug report工作。

Answer 2

在搜索這個問題的答案後，我發現用導航器傳遞標題需要傳遞一個blob對象。

例如

var hearders = {type : 'application/json'}; 
var blob = new blob(request , headers); 
navigator.sendBeacon('url/to/send',blob); 

感謝。

Answer 3

作爲寫入Processing Model of sendBeacon：

提取對象的字節流（transmittedData）和內容類型（contentType中）。

如何進行提取described here

我已經收集是傳輸數據的內容類型被提取，它被設置爲HTTP請求的內容類型。

1）如果發送Blob對象，則Content-Type變爲Blob的類型。

2）如果一個FORMDATA對象發送，內容類型變爲多部分/格式數據

3）如果一個URLSearchParams對象發送，內容類型變爲應用程序/ x-WWW窗體-urlencoded

4）如果一個正常的字符串被髮送，內容類型變爲純文本/

Javascript代碼來實現不同的對象can be found here