2013-09-23 40 views
6

我目前正在研究使用二進制數據讀取部分XHR響應的可能性。我們目前的方法基於'responseText'屬性和base64編碼。顯然,這遠非最佳。部分XHR響應讀取二進制數據,可能嗎?

如何使用XHR讀取部分Blob/ArrayBuffer響應?當我在Chrome中嘗試時,整個ArrayBuffer/Blob在readyState = 4時可用,但在此之前不可用。

總之,在我看來是:

  • 閱讀XHR的responseText屬性:反應可以的readyState = 4前閱讀,我們可以流編碼的二進制數據的base64返回給客戶端
  • 閱讀XHR的responseType ='arraybuffer'的響應屬性:沒有部分響應讀取,但整個緩衝區在readyState = 4時可用

我在這裏丟失了什麼嗎?我們可以採取什麼方法來讀取部分二進制響應?

回答

3

保持你的眼睛the fetch API,目前supported by Firefox and Chrome

+0

謝謝!這看起來就是這樣做的方式。作爲一個額外的好處,在我們的例子中,我們可以輕鬆地使用標準的XHR請求來支持不支持的瀏覽器。 – bjornl

5

有一種方法,雖然它還不是標準。 Firefox允許您將XHR上的responseType設置爲「moz-blob」,「moz-chunked-text」或「moz-chunked-arraybuffer」,具體取決於哪一個適合您。然後,當您收聽progress事件時,您將能夠訪問部分數據。MDN有關於herehere的更多信息。

Chrome將支持Streams API,但它是not ready yet。 Firefox也可以支持它eventually。我曾經在某個地方看過IE,但我似乎找不到任何官方文檔來證實這一點。

+0

感謝您的回覆。我們已經實現了我們的流/分塊機制。它基於base64編碼和responseType = text,因爲它似乎是當今支持最廣泛的解決方案。 – bjornl

+0

可能將我們的方法轉變爲更多地依賴於二進制多路複用WebSocket通信的方式,按照專有協議進行分塊。這些組塊必須相當小且具有可預測的大小,以允許有效的多路複用,但也可以可靠地檢測到斷開連接。似乎現在是一個可行的選擇。 – bjornl

+0

是的,假設你有服務器,Websockets是另一個不錯的選擇。 – brianchirls

1

用作XHR替換的最佳API是使用readableStream獲取的。

這是這裏解釋: https://developers.google.com/web/fundamentals/primers/async-functions#example_streaming_a_response

的Chrome已經支持它。 Firefox實現它,但必須手動激活它(它將在未來版本中默認激活)。 在等待此激活時,Firefox實現了具有非標準響應類型moz-chunked-arraybuffer的XHR

https://www.npmjs.com/package/fetch-readablestream提出了一個實現這兩種方法的API。它使用https://www.npmjs.com/package/web-streams-polyfill