ts js vue 验证文件 MD5 值 spark-md5

ts js vue 验证文件 MD5 值 spark-md5

如何在前端中验证要上传的文件的 md5 值

一、安装 spark-md5 插件

需要用到 spark-md5 这个插件

官方 github：https://github.com/satazor/js-spark-md5/tree/master

yarn add spark-md5
//  或
npm i spark-md5

使用的时候引入：

import SparkMD5 from "spark-md5";

二、封装成一个方法

要验证文件的 md5 ，官方的文档里就有这个例子，直接照抄它，我封装了下，封成了一个返回 Promise 的方法。如下：

这是一个 TS 版本的，改成 js 只需要将入口处的文件类型定义去除就可以了
function generateMD5OfFile(file) {

import SparkMD5 from "spark-md5";

/**
 * 生成一个文件的 MD5 值
 * @param file File
 */
function generateMD5OfFile(file: File) : Promise<string>{
   
    return new Promise((resolve, reject) => {
   
        let blobSlice = File.prototype.slice || File.prototype.mozSlice || File.prototype.webkitSlice,
            chunkSize = 2097152,                             // Read in chunks of 2MB
            chunks = Math.ceil(file.size / chunkSize),
            currentChunk = 0,
            spark = new SparkMD5.ArrayBuffer(),
            fi