Expo Blob
一个符合 Web 标准的 Blob 实现,适用于 React Native。
For the complete documentation index, see llms.txt. Use this Use this file to discover all available pages.
expo-blob 为 React Native 提供了一个符合 Web 标准的 Blob 实现,具有更优的性能,并且能在所有平台上一致地工作。与从 react-native 导出的实现相比,它更加可靠;不同于 react-native 中的 Blob,后者在 slice() 方法和其他 Web API 特性方面存在限制。
安装
- npx expo install expo-blobIf you are installing this in an existing React Native app, make sure to install expo in your project.
用法
基本 Blob 创建
import { Blob } from 'expo-blob'; // 创建一个空的 blob const emptyBlob = new Blob(); // 从文本创建一个 blob const textBlob = new Blob(['Hello, World!'], { type: 'text/plain' }); // 从二进制数据创建一个 blob const binaryBlob = new Blob([new Uint8Array([1, 2, 3, 4])], { type: 'application/octet-stream', }); // 从混合内容创建一个 blob const mixedBlob = new Blob( [ 'Text content', new Uint8Array([65, 66, 67]), // ASCII 中的 ABC 'More text', ], { type: 'text/plain' } );
Blob 属性
const blob = new Blob(['Hello, World!'], { type: 'text/plain' }); console.log(blob.size); // 13(字节) console.log(blob.type); // "text/plain"
读取 blob 内容
const blob = new Blob(['Hello, World!'], { type: 'text/plain' }); // 读取为文本 const text = await blob.text(); console.log(text); // "Hello, World!" // 读取为字节 const bytes = await blob.bytes(); console.log(bytes); // Uint8Array(13) [72, 101, 108, 108, 111, 44, 32, 87, 111, 114, 108, 100, 33] // 读取为 ArrayBuffer const arrayBuffer = await blob.arrayBuffer(); console.log(arrayBuffer); // ArrayBuffer(13)
切片 blob
const blob = new Blob(['Hello, World!'], { type: 'text/plain' }); // 从位置 0 切到 5 const slice1 = blob.slice(0, 5); console.log(await slice1.text()); // "Hello" // 从位置 7 切到末尾 const slice2 = blob.slice(7); console.log(await slice2.text()); // "World!" // 使用自定义类型切片 const slice3 = blob.slice(0, 5, 'text/html'); console.log(slice3.type); // "text/html"
流式传输
const blob = new Blob(['Large content...'], { type: 'text/plain' }); // 创建可读流 const stream = blob.stream(); const reader = stream.getReader(); // 读取块 while (true) { const { done, value } = await reader.read(); if (done) break; console.log('Chunk:', value); }
API
Classes
Blob Properties
Blob Methods
Promise<ArrayBuffer>Promise resolving to the Blob's binary data as an ArrayBuffer.
Promise<Uint8Array>Promise resolving to the Blob's binary data as a Uint8Array.
| Parameter | Type | Description |
|---|---|---|
| start(optional) | number | The starting byte index (inclusive) represented as a signed 32 bit integer (up to 2^31 - 1). |
| end(optional) | number | The ending byte index (exclusive) represented as a signed 32 bit integer (up to 2^31 - 1). |
| contentType(optional) | string | The MIME type of the new |
BlobA new Blob object containing the data in the specified range of bytes of the source Blob.
Note: The current implementation loads the entire
Blobinto memory before streaming.
ReadableStreamA ReadableStream of the Blob's data.
Promise<string>Promise that resolves with the entire contents of the Blob as a UTF-8 string.
Types
Literal Type: union
Represents a part of a Blob. Can be a string, ArrayBuffer, ArrayBufferView, or another Blob.
Acceptable values are: string | ArrayBuffer | ArrayBufferView | Blob