CompressionStream 流式上传管道与服务端协作实践

概述流式压缩上传能降低带宽。本文给出将文件管道接入压缩再作为请求体的实现。流式管道上传function streamFromFile(file, size = 1024*1024) { let o = 0; return new ReadableStream({ async pull(controller) { if (o >= file.size) { controller.close(); return; } const b = file.slice(o, o+size); const ab = await b.arrayBuffer(); controller.enqueue(new Uint8Array(ab)); o+=size; } }); } async function uploadGzip(url, file) { const cs = new CompressionStream('gzip'); const body = streamFromFile(file).pipeThrough(cs); const res = await fetch(url, { method:'POST', headers:{ 'Content-Encoding':'gzip' }, body }); if (!res.ok) throw new Error('upload failed'); }