minor fixes
This commit is contained in:
parent
c9063dcdd8
commit
9a2981cf3d
1 changed files with 14 additions and 10 deletions
|
@ -219,30 +219,34 @@ const bufferPromise = await blob.arrayBuffer();
|
||||||
|
|
||||||
// or
|
// or
|
||||||
blob.arrayBuffer().then(buffer => /* process the ArrayBuffer */);
|
blob.arrayBuffer().then(buffer => /* process the ArrayBuffer */);
|
||||||
|
|
||||||
```
|
```
|
||||||
|
|
||||||
`FileReader.readAsArrayBuffer()` method can also get ArrayBuffer, but it usually fails if the blob memory exceeds 2G. It is recommended to use blob.arrayBuffer(), it's simpler.
|
|
||||||
|
|
||||||
## From Blob to stream
|
## From Blob to stream
|
||||||
|
|
||||||
When we read and write to a blob of more than `2G`, the use of `arrayBuffer` becomes more memory intensive for us. At this point, we can directly convert the blob to a `stream`,The `Blob` interface's `stream()` method returns a `ReadableStream` which upon reading returns the data contained within the `Blob`.
|
When we read and write to a blob of more than `2G`, the use of `arrayBuffer` becomes more memory intensive for us. At this point, we can directly convert the blob to a stream.
|
||||||
|
|
||||||
|
A stream is a special object that allows to read from it (or write into it) portion by portion. It's outside of our scope here, but here's an example, and you can read more at <https://developer.mozilla.org/en-US/docs/Web/API/Streams_API>.
|
||||||
|
|
||||||
|
The `Blob` interface's `stream()` method returns a `ReadableStream` which upon reading returns the data contained within the `Blob`.
|
||||||
|
|
||||||
|
Then we can read from it, like this:
|
||||||
|
|
||||||
```js
|
```js
|
||||||
|
|
||||||
// get readableStream from blob
|
// get readableStream from blob
|
||||||
const readableStream = blob.stream();
|
const readableStream = blob.stream();
|
||||||
const reader = readableStream.getReader();
|
const stream = readableStream.getReader();
|
||||||
|
|
||||||
while (true) {
|
while (true) {
|
||||||
// value => blob fragments
|
// for each iteration: data is the next blob fragment
|
||||||
let { done, value } = await reader.read();
|
let { done, data } = await stream.read();
|
||||||
if (done) {
|
if (done) {
|
||||||
|
// no more data in the stream
|
||||||
console.log('write done.');
|
console.log('write done.');
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
// to do sth
|
|
||||||
stream.write(value);
|
// do something with the data portion we've just read from the blob
|
||||||
|
console.log(data);
|
||||||
}
|
}
|
||||||
```
|
```
|
||||||
|
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue