Загрузка больших файлов с токеном аутентификации с использованием потоков - PullRequest
Новая
       30

Загрузка больших файлов с токеном аутентификации с использованием потоков

0 голосов
/ 21 марта 2019

Я пытаюсь загрузить файлы, используя fetch, потому что в его заголовке требуется аутентификация. Проблема заключалась в том, что когда файл слишком велик, пользователю приходилось ждать много времени, чтобы получить какой-либо отзыв от браузера, пока он не сказал, что файл действительно загружен, поэтому я попытался сохранить поток, чтобы отобразить «загрузку» "меню в браузере во время загрузки.

enter image description here

Хотя он работает в Chrome, проблема, с которой я сейчас сталкиваюсь, заключается в том, что Firefox, похоже, не поддерживает Stream API, поэтому я попытался использовать полифил, но, похоже, он не работает. 

import { createWriteStream, supported } from 'streamsaver';
import { WritableStream } from 'web-streams-polyfill/ponyfill/es6';

const downloadWithToken = async (url, name) => {

    const token = localStorage.getItem('token');
    const authorization = 'Bearer ' + token;
    const headers = new Headers({ authorization });
    const options = { headers };

    let response = await fetch(url, options)

    if (!supported) {
        window.WritableStream = WritableStream;
    }
    const filestream = createWriteStream(name);
    const writer = filestream.getWriter();

    if (response.body.pipeTo) {
        writer.releaseLock();
        return response.body.pipeTo(filestream);
    }

    const reader = response.body.getReader();

    const pump = () =>
        reader
            .read()
            .then(({ value, done }) => (done ? writer.close() : writer.write(value).then(pump)));

    pump();
};

Что я делаю не так?

...