Vue3 + vite +typescript 项目中获取图片的md5值

最新推荐文章于 2024-03-11 11:02:04 发布

初浅墨

最新推荐文章于 2024-03-11 11:02:04 发布

阅读量917

点赞数

文章标签： typescript javascript 前端

本文链接：https://blog.csdn.net/SuiXJ7083/article/details/125765776

版权

Vue3 + vite +typescript 项目中获取图片的md5值

下载插件

npm install browser-md5-file --save

引用插件

在src下创建 shims-vue.d.ts 文件，文件里写入

declare module 'browser-md5-file'

然后在组件内引用

import BMF from "browser-md5-file"; //这个使用npm

方法调用

//获取文件的MD5值
const getMd5 = (rawFile: UploadRawFile) => {
  return new Promise((resolve, reject) => {
    const bmf = new BMF();
    bmf.md5(
      rawFile,
      (err: any, md5: any) => {
        console.log(md5);   //获取的md5值
        resolve("");
      },
      (progress: any) => {}
    );
  });
};

//在文件上传之前调用
const fileBeforeUpload: UploadProps["beforeUpload"] = async (rawFile:any) => {
  //MD5的实现方式
  await getMd5(rawFile);
};