Как передать поток для чтения в URL.createObjectURL, не дожидаясь всего файла? - PullRequest
Новая
       13

Как передать поток для чтения в URL.createObjectURL, не дожидаясь всего файла?

0 голосов
/ 01 сентября 2018

Я знаю, что это возможно с mediaSource, но медиа-источник не поддерживает все форматы видео (например, фрагментированный mp4). Что является проблемой, потому что мое приложение не имеет сервера, который может исправить файл. Это только клиентское приложение. 

const blob = await ipfs.getBlobFromStream(hash)

const url = URL.createObjectURL(blob)

this.setState({...this.state, videoSrc: url})

const getBlobFromStream = async (hash) => {

  return new Promise(async resolve => {

    let entireBuffer

    const s = await stream(hash)
    s.on('data', buffer => {

      console.log(buffer)

      if (!entireBuffer) {
        entireBuffer = buffer
      }
      else {
        entireBuffer = concatTypedArrays(entireBuffer, buffer)
      }

    })

    s.on('end', () => {

      const arrayBuffer = typedArrayToArrayBuffer(entireBuffer)
      const blob = new Blob(arrayBuffer)
      resolve(blob)
    })

  })

}

это код, который я сейчас использую, который в основном ожидает весь файл и помещает его в один массив, затем в большой двоичный объект, а затем в URL.createObjectURL

1 Ответ

0 голосов
/ 12 сентября 2018

Вы можете сделать это, в котором вы реструктурируете свой код: 

await ipfs.startBlobStreaming(hash);
this.setState({...this.state, videoComplete: true});

const startBlobStreaming = async (hash) => {
  return new Promise(async (resolve) => {

    let entireBuffer;
    const s = await stream(hash);
    s.on('data', buffer => {
      if (!entireBuffer) {
        entireBuffer = buffer;
      } else {
        entireBuffer = concatTypedArrays(entireBuffer, buffer);
      }
      const arrayBuffer = typedArrayToArrayBuffer(entireBuffer);
      const blob = new Blob(arrayBuffer);
      const url = URL.createObjectURL(blob);
      this.setState({...this.state, videoSrc: url});

    });
    s.on('end', _ => resolve())
  });
}

Я не знаю, насколько интенсивно буферы входят в s.on, но вы также можете собрать некоторое количество буфера в определенное время (например, 1000 мс) и затем создать URL-адрес BLOB-объекта.

...