Blob对象在哪些特定场景下被广泛使用?
- 内容介绍
- 文章标签
- 相关推荐
为什么你会为二进制数据抓狂?
在前端项目里处理文件、图片、音视频等二进制资源时总会遇到以下痛点:
- 无法在不经过后端的情况下让使用者直接下载生成的文件。
- 音视频流播放卡顿,缺少统一的操作接口。
- 上传大文件时需要手动把数据转成合适的格式才能发送。
- 移动端拍照后想立即裁剪、压缩再上传,却找不到便捷的二进制转换手段。不过,
- 离线应用需要本地缓存大量资源。却不知道如何持久化二进制数据。不过,
Blob是 Web API 中用于表示不可变原始二进制数据的对象。它可以包装文本、图片、音频、视频甚至是自定义的 ArrayBuffer,让这些数据像普通文件一样被浏览器管理。
主要特性
- 说到不可变。创建后内容不能被修改,只能通过新建 Blob 来实现“更新”。
-
支持分块的观点是,可以一次性传入多个
ArrayBuffer / TypedArray / String片段。 -
可生成 URL:
URL.createObjectURL可得到临时地址,直接用于下载或媒体播放。
为什么你会为二进制数据抓狂?
在前端项目里处理文件、图片、音视频等二进制资源时总会遇到以下痛点:
- 无法在不经过后端的情况下让使用者直接下载生成的文件。
- 音视频流播放卡顿,缺少统一的操作接口。
- 上传大文件时需要手动把数据转成合适的格式才能发送。
- 移动端拍照后想立即裁剪、压缩再上传,却找不到便捷的二进制转换手段。不过,
- 离线应用需要本地缓存大量资源。却不知道如何持久化二进制数据。不过,
Blob是 Web API 中用于表示不可变原始二进制数据的对象。它可以包装文本、图片、音频、视频甚至是自定义的 ArrayBuffer,让这些数据像普通文件一样被浏览器管理。
主要特性
- 说到不可变。创建后内容不能被修改,只能通过新建 Blob 来实现“更新”。
-
支持分块的观点是,可以一次性传入多个
ArrayBuffer / TypedArray / String片段。 -
可生成 URL:
URL.createObjectURL可得到临时地址,直接用于下载或媒体播放。

