Reference version

Expo Blob

适用于 React Native 的符合 Web 标准的 Blob 实现。

Android
iOS
Web
Included in Expo Go

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 功能方面存在限制。

安装

Terminal
npx expo install expo-blob

If 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( [ '文本内容', new Uint8Array([65, 66, 67]), // ASCII 中的 ABC '更多文本', ], { 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('块:', value); }

API

Classes

Blob

Android
iOS
Web

Blob Properties

size

Android
iOS
Web
Read Only • Type: number

The size of the Blob in bytes.

type

Android
iOS
Web
Read Only • Type: string

The MIME type of the Blob, or the empty string if the type cannot be determined.

Blob Methods

arrayBuffer()

Android
iOS
Web

Promise resolving to the Blob's binary data as an ArrayBuffer.

bytes()

Android
iOS
Web
Returns:
Promise<Uint8Array<ArrayBufferLike>>

Promise resolving to the Blob's binary data as a Uint8Array.

slice(start, end, contentType)

Android
iOS
Web
ParameterTypeDescription
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 Blob. If not provided, defaults to an empty string.


Returns:
Blob

A new Blob object containing the data in the specified range of bytes of the source Blob.

stream()

Android
iOS
Web

Note: The current implementation loads the entire Blob into memory before streaming.

A ReadableStream of the Blob's data.

text()

Android
iOS
Web
Returns:
Promise<string>

Promise that resolves with the entire contents of the Blob as a UTF-8 string.

Types

BlobPart

Android
iOS
Web

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