前端文件转[byte 数组]形式

最新推荐文章于 2024-08-24 04:36:43 发布

夹道欢呼

最新推荐文章于 2024-08-24 04:36:43 发布

阅读量4.6k

点赞数 1

CC 4.0 BY-SA版权

文章标签： vue.js javascript 前端

本文链接：https://blog.youkuaiyun.com/qq_37130872/article/details/124347032

这段代码定义了一个名为`file2Uint8Array`的公共方法，用于将上传的文件转换为Uint8Array类型。它通过FileReader API读取文件内容，然后将结果转换为Uint8Array数组。在调用此方法时，可以获取到文件的byte数组，并进一步用于数据导入操作。在示例中，这个方法被用于处理多个文件的上传，将每个文件转换后的结果存储在一个数组中，然后调用后台API进行解析导入。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

定义一个公共方法:

export const file2Uint8Array = (file) => new Promise((resolve) => {
//file 为上传文件
  const reader = new FileReader();
  reader.readAsArrayBuffer(file);
  reader.onload = function () {
    const bytes = new Uint8Array(this.result);
    const bytesArray = [];
    for (let i = 0; i < bytes.length; i++) {
      bytesArray.push(bytes[i]);
    }
    resolve(bytesArray);
  };
});

在对应的页面引入:

import { file2Uint8Array } from '@/utils';

调用该方法返回对应的byte数组:

const handleImport = async () => {
  // let array = [];
  // for (const file of formState.fileList) {
  //   const res = await file2Uint8Array(file.originFileObj);
  //   array.push(res);
  // }
  // console.log(array);

  // 上面是多个文件解析上传,返回array数组里面对应上传文件

  const dataBlod = await file2Uint8Array(formState.fileList[0].originFileObj);
  // dataBlod为返回的byte数组
  const obj = {
    data: dataBlod,
    filename: formState.fileList[0].name,
    method: formState.value
  };
  if (dataBlod.length > 0) {
    apis.domain
      .resolverImport(appStore.rowAnalytic.id, { ...obj })
      .then((res) => {
        emit('parse-import', res.batchOperationLogId);
      })
      .finally(() => {});
  }