問題描述
我有一個 REST API，它通過 HTTP Post 接受音頻文件.該 API 支持 Transfer-Encoding: 分塊請求標頭，以便文件可以在從客戶端上運行的記錄器創建時分段上傳.這樣，服務器可以在文件到達時開始處理文件以提高性能.例如:
<塊引用>HTTP 1.1 POST .../v1/processAudio
傳輸編碼:分塊
[Chunk 1 256 Bytes](服務器到達時開始處理)
[塊 2 256 字節]
[塊 3 256 字節]
...
音頻文件通常很短，大小約為 10K 到 100K.我有 C# 和 Java 代碼可以工作，所以我知道 API 可以工作.但是，我似乎無法使用 javascript 在瀏覽器中進行錄制和上傳.
這是我的測試代碼，它使用傳輸編碼對本地主機進行 POST:
<html><腳本類型="文本/javascript">函數流上傳(){var blob = new Blob(['GmnQPBU+nyRGER4JPAW4DjDQC19D']);var xhr = new XMLHttpRequest();//在此處添加任何事件處理程序...xhr.open('POST', '/', true);xhr.setRequestHeader("傳輸編碼", "chunked");xhr.send(blob);}</腳本><身體><div id='demo'>使用 XHR 測試分塊上傳</div><button onclick="streamUpload()">開始上傳</button></身體></html>問題是我在 Chrome 中收到以下錯誤
拒絕設置不安全的標頭Transfer-Encoding"
streamUpload@uploadTest.html:14onclick@uploadTest.html:24
查看 XHR 文檔后，我仍然感到困惑，因為它沒有談論不安全的請求標頭.我想知道 XHR 是否可能不允許或實現 HTTP POST 的 Transfer-Encoding: chunked?
我查看了使用多個 XHR.send() 請求和 WebSockets 的變通方案，但兩者都是不可取的，因為它需要對已經到位、簡單、穩定和工作的服務器 API 進行重大更改.唯一的問題是我們似乎無法通過 Transfer-Encoding: chunked request header 從具有偽流的瀏覽器進行 POST.
任何想法或建議都會非常有幫助.
正如評論中提到的，您不能設置該標頭，因為它由用戶代理控制.
有關完整的標頭集，請參閱 4.6.2 setRequestHeader() 方法 來自 W3C XMLHttpRequest Level 1 并注意 Transfer-Encoding 是由用戶代理控制的標頭之一，以使其控制傳輸的這些方面.
- 接受字符集
- 接受編碼
- 訪問控制請求標頭
- 訪問控制請求方法
- 連接
- 內容長度
- Cookie
- Cookie2
- 日期
- DNT
- 期待
- 主持人
- 保持活躍
- 原產地
- 推薦人
- TE
- 預告片
- 傳輸編碼
- 升級
- 用戶代理
- 通過
WhatWG Fetch API 生活標準中有一個類似的列表.https://fetch.spec.whatwg.org/#terminology-headersp>
I have a REST API that accepts an Audio file via an HTTP Post. The API has support for Transfer-Encoding: chunked request header so that the file can be uploaded in pieces as it is being created from a recorder running on the client. This way the server can start processing the file as it arrives for improved performance. For example:
HTTP 1.1 POST .../v1/processAudio
Transfer-Encoding: chunked
[Chunk 1 256 Bytes] (server starts processing when arrives)
[Chunk 2 256 Bytes]
[Chunk 3 256 Bytes]
...
The audio files are typically short and are around 10K to 100K in size. I have C# and Java code that is working so I know that API works. However, I cannot seem to get the recording and upload working in a browser using javascript.
Here is my Test Code that does a POST to localhost with Transfer-Encoding:
<html>
<script type="text/javascript">
function streamUpload() {
var blob = new Blob(['GmnQPBU+nyRGER4JPAW4DjDQC19D']);
var xhr = new XMLHttpRequest();
// Add any event handlers here...
xhr.open('POST', '/', true);
xhr.setRequestHeader("Transfer-Encoding", "chunked");
xhr.send(blob);
}
</script>
<body>
<div id='demo'>Test Chunked Upload using XHR</div>
<button onclick="streamUpload()">Start Upload</button>
</body>
</html>
The problem is that i'm receiving the following Error in Chrome
Refused to set unsafe header "Transfer-Encoding"
streamUpload @ uploadTest.html:14 onclick @ uploadTest.html:24
After looking at XHR documentation i'm still confused because it does not talk about unsafe request headers. I'm wondering if its possible that XHR does not allow or implement Transfer-Encoding: chunked for HTTP POST?
I've looked at work arounds using multiple XHR.send() requests and WebSockets but both are undesirable because it will require significant changes to the server APIs which are already in place, simple, stable and working. The only issue is that we cannot seem to POST from a browser with psedo-streaming via Transfer-Encoding: chunked request header.
Any thoughts or advice would be very helpful.
As was mentioned in a comment, you're not allowed to set that header as it's controlled by the user agent.
For the full set of headers, see 4.6.2 The setRequestHeader() method from W3C XMLHttpRequest Level 1 and note that Transfer-Encoding is one of the headers that are controlled by the user agent to let it control those aspects of transport.
- Accept-Charset
- Accept-Encoding
- Access-Control-Request-Headers
- Access-Control-Request-Method
- Connection
- Content-Length
- Cookie
- Cookie2
- Date
- DNT
- Expect
- Host
- Keep-Alive
- Origin
- Referer
- TE
- Trailer
- Transfer-Encoding
- Upgrade
- User-Agent
- Via
There is a similar list in the WhatWG Fetch API Living Standard. https://fetch.spec.whatwg.org/#terminology-headers
這篇關于使用帶有分塊傳輸編碼的 XHR 的 HTTP POST的文章就介紹到這了，希望我們推薦的答案對大家有所幫助，也希望大家多多支持html5模板網！