如何在一个 blob 中使用多个 arrayBuffers？答案

【问题标题】：How can I use multiple arrayBuffers in a blob?如何在一个 blob 中使用多个 arrayBuffers？
【发布时间】：2020-03-31 21:40:30
【问题描述】：

我一直在寻找，但没有找到有效的答案。我有多个 arrayBuffers 我想组合成一个 blob。我需要以某种方式组合 arrayBuffers 吗？或者我应该创建多个 blob 并将它们组合起来？下面是我正在尝试做的一个例子，但失败了

const buffers = []

for(var i in files){
    ...code to retrieve arrayBuffer
    buffers.push(arrayBuffer)
}

const blob = new Blob([buffers], {type:'application/pdf'})
const url = window.URL.createObjectURL(blob)
window.open(url)

上面的代码不起作用，因为 new Blob 需要一个 arrayBuffer 而不是它们的数组。有什么东西可以使这项工作吗？

【问题讨论】：

标签： javascript pdf blob buffer arraybuffer

【解决方案1】：

new Blob 需要一个 arrayBuffer 而不是它们的数组。

不，Blob 构造函数等待blobParts sequence。规范使用术语“序列”，因为它接受几种 ArrayLike 对象，但核心思想是您的代码实际上是正确的方法，因为唯一的参数将在搜索对象时被迭代确实对应于blobParts，即Blob、ArrayBuffers 或DOMStrings。

所以要回答这个问题，要将多个 ArrayBuffer 连接成一个 Blob，您只需要将它们传递给您提供给构造函数的 Array。

const arr1 = new Uint8Array(12);
const buf1 = arr1.buffer;
arr1.fill(0xAA);
const arr2 = new Uint8Array(12);
const buf2 = arr2.buffer;
arr2.fill(0xBB);
const arr3 = new Uint8Array(12);
const buf3 = arr3.buffer;
arr3.fill(0xCC);

const blob = new Blob( [ buf1, buf2, buf3 ] );

new Response( blob ).arrayBuffer().then( buf => {
  const view = new Uint8Array( buf );
  const as_string = [ ...view ].map( (num) => num.toString( 16 ) );
  console.log( as_string );
} );

对于你的问题，它在其他地方......

【讨论】：