blob转换成file文档流

将Blob对象转换为File对象，需要使用File构造函数。File构造函数需要传入一个数组，数组的元素是Blob对象和文件名。

下面是将Blob对象转换为File对象的示例代码：

function blobToFile(blob, fileName) {
  const b = new Blob([blob], {type: blob.type});
  b.lastModifiedDate = new Date();
  b.name = fileName;
  return b;
}

使用示例：

const blob = new Blob(['Hello, World!'], {type: 'text/plain'});
const file = blobToFile(blob, 'hello.txt');
console.log(file);

输出：

File {name: "hello.txt", lastModified: 1625639889284, lastModifiedDate: Date 2021-07-07T08:51:29.284Z, webkitRelativePath: "", size: 13, …}

可以看到，输出的是一个File对象。可以通过FileReader读取文件流。

相关问题

vue base64转成文件流

### 回答1：
我们可以使用 JavaScript 的 File API 将 base64 编码转换为文件流。

在 Vue 中，你可以使用以下代码实现这一点：

// 将 base64 编码转换为 Uint8Array
const binary = atob(base64String);
const array = [];
for (let i = 0; i < binary.length; i++) {
  array.push(binary.charCodeAt(i));
}
const file = new Uint8Array(array);

// 使用 File API 创建 Blob 对象
const blob = new Blob([file], { type: 'application/octet-stream' });

// 创建文件流
const fileStream = new FileReader();
fileStream.readAsArrayBuffer(blob);

在这段代码中，我们使用 atob() 函数将 base64 编码转换为二进制字符串，然后将其转换为 Uint8Array 数组。接着，我们使用这个数组创建一个 Blob 对象，最后使用 FileReader 的 readAsArrayBuffer() 方法将 Blob 对象转换为文件流。

希望这能帮到你！

### 回答2：
在Vue中，将base64转换为文件流可以通过以下步骤实现：

1. 首先，创建一个函数，用于将base64转换为Blob对象：

function base64ToBlob(base64) {
  const parts = base64.split(';base64,');
  const contentType = parts[0].split(':')[1];
  const raw = window.atob(parts[1]);
  const rawLength = raw.length;
  const uInt8Array = new Uint8Array(rawLength);

  for (let i = 0; i < rawLength; ++i) {
    uInt8Array[i] = raw.charCodeAt(i);
  }

  return new Blob([uInt8Array], { type: contentType });
}

2. 然后，在Vue组件中调用该函数并使用URL.createObjectURL()方法创建文件流：

methods: {
  convertBase64ToBlob(base64) {
    const blob = base64ToBlob(base64);
    const fileStream = URL.createObjectURL(blob);

    // 这里可以使用fileStream进行后续操作，例如下载或预览
  }
}

3. 最后，当你有一个base64字符串需要转换为文件流时，调用`convertBase64ToBlob()`方法传入该base64字符串即可。

this.convertBase64ToBlob('data:image/png;base64,iVBORw0KGg....');

通过以上步骤，你可以成功将Vue中的base64转换为文件流，并进行后续操作，如下载或预览相关文件。

### 回答3：
在Vue中将base64转换为文件流可以通过以下步骤实现：

1. 首先，将base64字符串分为头部和内容部分。头部通常是"data:image/png;base64,"这样的格式，表明了文件的类型和编码方式。
2. 使用URL.createObjectURL()方法创建一个临时的URL，将base64字符串转换为Blob对象。Blob对象是表示二进制数据的不可变对象，可以直接加载或保存。
3. 创建一个a标签的DOM元素，并设置其href属性为步骤2中创建的临时URL。
4. 设置a标签的download属性为想要保存的文件名，例如"image.png"。
5. 使用document.body.appendChild()方法将a标签添加到文档中。
6. 使用a标签的click()方法触发点击事件，浏览器将自动下载转换后的文件。
7. 在完成下载后，使用URL.revokeObjectURL()方法撤销之前创建的临时URL，释放资源。

下面是一个示例代码：

<template>
  <div>
    <button @click="base64ToFile">转换为文件</button>
  </div>
</template>

<script>
export default {
  methods: {
    base64ToFile() {
      const base64 = "your base64 string"; // 替换为你的base64字符串
      const header = base64.split(",")[0]; // 获取base64头部
      const content = base64.split(",")[1]; // 获取base64内容部分

      const bytes = atob(content); // 将base64转换为二进制数据
      const arrayBuffer = new ArrayBuffer(bytes.length);
      const uint8Array = new Uint8Array(arrayBuffer);
      for (let i = 0; i < bytes.length; i++) {
        uint8Array[i] = bytes.charCodeAt(i); // 将二进制数据存入Uint8Array中
      }

      const blob = new Blob([uint8Array], { type: header }); // 创建Blob对象
      const url = URL.createObjectURL(blob); // 创建临时URL

      const link = document.createElement("a");
      link.href = url;
      link.download = "image.png"; // 下载文件名
      document.body.appendChild(link);
      link.click(); // 触发下载

      URL.revokeObjectURL(url); // 撤销临时URL，释放资源
    }
  }
};
</script>

请注意，这只适用于较小的文件转换。对于大文件转换，可能会导致浏览器崩溃。如果要处理大文件，请考虑使用流式处理或使用服务器端实现。

后端返回word文档流后，前端下载下来文件内容变成undifiend

这个问题可能是由于前端没有正确处理后端返回的文件流导致的。可以按照以下步骤来解决：

1. 确定后端返回的文件流是否正确，可以通过 Postman 或者浏览器网络面板来查看返回的数据是否是预期的 word 文档流。

2. 在前端处理文件流时，需要将数据流转换为 Blob 对象，可以使用以下代码：

   const blob = new Blob([response.data], { type: 'application/msword' });

3. 然后将 Blob 对象转换为文件 URL，可以使用 URL.createObjectURL 方法，例如：

   const url = window.URL.createObjectURL(blob);

4. 最后创建一个下载链接，让用户点击下载，可以使用以下代码：

   const link = document.createElement('a');
   link.href = url;
   link.setAttribute('download', 'file.doc');
   document.body.appendChild(link);
   link.click();

如果以上步骤都正确执行，应该可以正常下载并打开 word 文档。