我正在阅读http://www.html5rocks.com/en/tutorials/file/xhr2/,并试图弄清ArrayBuffer
和Blob
之间的区别。
这两个容器都是由位组成的,难道这两个容器不能以多种方式查看(如32位块、16位块等)吗?
我正在阅读http://www.html5rocks.com/en/tutorials/file/xhr2/,并试图弄清ArrayBuffer
和Blob
之间的区别。
这两个容器都是由位组成的,难道这两个容器不能以多种方式查看(如32位块、16位块等)吗?
概要
除非你需要使用 ArrayBuffer
进行写/编辑操作,否则最好使用 Blob
格式。
详细内容
我从不同的 html5rocks 页面了解到这个问题。我发现@Bart van Heukelom的评论 很有帮助,因此我想在这里将它们提升为答案。
我还发现了一些有关 ArrayBuffer
和 Blob
对象的有用资源。总体而言:尽管强调 Blob
为不可变/原始数据,但 Blob
对象易于处理。
比较 / 对比 ArrayBuffer
vs Blob
的资源:
ArrayBuffer
可以被更改(例如使用DataView
)Blob
是不可变的
ArrayBuffer
在内存中,可供操作。- 一个Blob可以存在于磁盘、缓存内存和其他不容易获取的地方
ArrayBuffer
需要类似类型化数组的一些访问层Blob
可以直接传递给其他函数,例如window.URL.createObjectURL
,就像在OP的URL中看到的那样。
File
-related接口和API,例如FileReader
来处理Blob。ArrayBuffer
生成Blob
,反之亦然,这解决了OP的“这两个容器不都由位组成吗?”FileReader
的readAsArrayBuffer
方法 从Blob生成ArrayBuffer,或者使用异步方法const arrayBuffer = await blob.arrayBuffer()
(感谢@Darren G)new Blob([new Uint8Array(data)]);
,详见这个答案jsZip
: (new JSZip()).loadAsync(...)
接受两种类型数据:ArrayBuffer
和 Blob
:String/Array of bytes/ArrayBuffer/Uint8Array/Buffer/Blob/Promise
binaryType
属性(取值可以是“arraybuffer”或“blob”),“控制从 WebSocket 连接接收的二进制数据类型”.responseType
属性,可以“更改从服务器期望的响应类型”(有效值包括“arraybuffer”、“blob”以及其他类型,如“document”、“json”和“text”)。根据responseType
属性,响应属性将包含实体主体,可以是ArrayBuffer、Blob、Document、JSON或字符串。
其他有用的文档:
ArrayBuffer
对象用于表示一种通用的固定长度的原始二进制数据缓冲区。您不能直接操作ArrayBuffer
的内容,而是要创建一个类型化数组对象或DataView
对象来表示特定格式的缓冲区,并使用它来读写缓冲区的内容。
Blob
对象表示一个类似文件的对象,包含不可变的原始数据。Blob
表示的数据不一定是JavaScript本地格式。基于Blob
,File
接口继承了 Blob 功能,并扩展以支持用户系统上的文件。
FileReader
,参见此处“从Blob中提取数据的示例” - 这会在你可以访问Blob中的任何内容之前添加另一个异步函数。 - MörrearrayBuffer
可以像这个答案所提到的那样转换为Blob
,代码如下:new Blob([new Uint8Array(data)]);
我测试过了,它对于PNG图像起作用。 - user3405291const buffer = await blobFile.arrayBuffer()
。参考链接:https://developer.mozilla.org/en-US/docs/Web/API/Blob/arrayBuffer - Darren G页面上已经有解释。
ArrayBuffer
ArrayBuffer是二进制数据的通用定长容器。如果您需要一个通用的原始数据缓冲区,它们非常方便,但这些东西背后真正的力量在于您可以使用JavaScript类型化数组创建基础数据的"视图"。事实上,可以从单个ArrayBuffer源创建多个视图。例如,您可以创建一个8位整数数组,该数组与同一数据的现有32位整数数组共享相同的ArrayBuffer。基础数据保持不变,我们只是创建了不同的表示。
BLOB
如果您想直接使用Blob并且/或者不需要操作文件的任何字节,请使用xhr.responseType='blob':
ArrayBuffer
(以及其相关的“视图”如DataView
和“类型数组”)用于二进制数据,Blob
用于二进制文件。 - Константин Ван