JavaScript: Запись для загрузки потока

Question

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

Answer 1

Это только будет возможно с помощью комбинации службы работника + выборки + потока Несколько браузера имеет рабочий и принести, но еще меньше поддержки выборку с потоковым (Blink)

new Response(new ReadableStream({...}))

У меня есть встроенный потоковый файл заставки Lib для связи с сервисным работником в другой, чтобы перехватить запрос сети: StreamSaver.js

Это немного отличается от потока узла здесь является примером

function unencrypt(){ 
    // should return Uint8Array 
    return new Uint8Array() 
} 

// We use fetch instead of xhr that has streaming support 
fetch(url).then(res => { 
    // create a writable stream + intercept a network response 
    const fileStream = streamSaver.createWriteStream('filename.txt') 
    const writer = fileStream.getWriter() 

    // stream the response 
    const reader = res.body.getReader() 
    const pump =() => reader.read() 
     .then(({ value, done }) => { 
      let chunk = unencrypt(value) 

      // Write one chunk, then get the next one 
      writer.write(chunk) // returns a promise 

      // While the write stream can handle the watermark, 
      // read more data 
      return writer.ready.then(pump) 
     ) 

    // Start the reader 
    pump().then(() => 
     console.log('Closed the stream, Done writing') 
    ) 
}) 

Есть также два других способа, с помощью которых вы можете получить потоковый ответ с помощью xhr, но он не является стандартным и не маскируется, если вы используете их (responseType = ms-stream || Мос-фрагментированный-ArrayBuffer) Потому что StreamSaver зависит от выборки + ReadableStream любых путей и не может быть использован каким-либо другим способом

Позже вы сможете сделать что-то вроде этого, когда WritableStream + Transform потоков получают реализован, а

fetch(url).then(res => { 
    const fileStream = streamSaver.createWriteStream('filename.txt') 

    res.body 
     .pipeThrogh(unencrypt) 
     .pipeTo(fileStream) 
     .then(done) 
}) 

Также стоит упомянуть, что менеджер загрузки по умолчанию обычно связан с загрузкой фона, поэтому ppl иногда закрывает вкладку, когда видит загрузку. Но все это происходит в основном потоке, поэтому вам нужно предупредить пользователя, когда они уходят

window.onbeforeunload = function(e) { 
    if(download_is_done()) return 

    var dialogText = 'Download is not finish, leaving the page will abort the download' 
    e.returnValue = dialogText 
    return dialogText 
}