TIL: gzip-ed, streaming uploads from browsers
You will not believe how simple this is (I didn’t!). Assuming file
is a file handle
you’ve somehow acquired (either by letting the user pick a file or by using the
File System API), here’s all you need to do:
const gzippedStream = file
.stream()
.pipeThrough(new CompressionStream("gzip"))
That’s it. You can now take this gzipped stream and use it as a Request
body in
a fetch
call:
fetch(
"https://file-gobbler.com/upload",
{
body: file
.stream()
.pipeThrough(new CompressionStream("gzip"))
}
)
and the browser will gzip
your file on-the-fly, and your server will receive
the compressed blob.