Возможно ли частичное чтение ответа XHR для двоичных данных?

Question

В настоящее время я изучаю возможность чтения частичных XHR-ответов с помощью двоичных данных. Наш текущий подход основан на свойстве responseText и кодировке base64. Понятно, что это далеко не оптимально.

Как мы можем прочитать частичные ответы Blob/ArrayBuffer, используя XHR? Когда я пытаюсь в Chrome, весь ArrayBuffer/Blob становится доступным, когда readyState = 4, но не раньше.

Подводя итог, мне кажется, что:

• Чтение свойства responseText XHR: ответы могут быть прочитаны до готовности ReadyState = 4, и мы можем передавать двоичные данные в кодировке base64 обратно клиенту
• Чтение свойства ответа XHR с responseType = 'arraybuffer': частичное чтение ответа отсутствует, но весь буфер становится доступным, когда readyState = 4

Я что-то здесь упускаю? Какой подход мы можем использовать для чтения частичных двоичных ответов?

Answer 1

Следите за API выборки, который в настоящее время поддерживается Firefox и Chrome.

Answer 2

Есть способ, хотя он пока не стандартный. Firefox позволяет установить responseType в XHR для "moz-blob", "moz-chunked-text" или "moz-chunked-arraybuffer", в зависимости от того, какой из них работает для вас. Затем, когда вы слушаете progress событие, вы сможете получить доступ к частичным данным по мере их поступления. MDN имеет больше информации об этом здесь и здесь.

Chrome будет поддерживать Streams API, но пока не готов. Firefox также может в конечном итоге поддержать его. Я где-то читал, что IE уже делает, хотя я не могу найти официальную документацию, чтобы подтвердить это.

Answer 3

Лучший API для использования в качестве замены XHR - это выборка с readableStream.

Это объясняется здесь: https://developers.google.com/web/fundamentals/primers/async-functions

Chrome уже поддерживает это. Firefox реализует его, но на данный момент его необходимо активировать вручную (он будет активирован по умолчанию в будущей версии). В ожидании этой активации Firefox реализует XHR с нестандартным типом ответа moz-chunked-arraybuffer

Библиотека https://www.npmjs.com/package/fetch-readablestream предлагает API, который реализует эти два метода. Он использует https://www.npmjs.com/package/web-streams-polyfill.