MD5哈希文件加密

MD5哈希文件加密

yarn add spark-md5(或者npm install spark-md5 )


建立js文件(md5Files.js)

import SparkMD5 from 'spark-md5'

export default class BMF {
    md5(file, md5Fn, progressFn) {
        this.aborted = false;
        this.progress = 0;
        let currentChunk = 0;
        const blobSlice =
            File.prototype.slice ||
            File.prototype.mozSlice ||
            File.prototype.webkitSlice;
        const chunkSize = 2097152;
        const chunks = Math.ceil(file.size / chunkSize);
        const spark = new SparkMD5.ArrayBuffer();
        const reader = new FileReader();

        loadNext();

        reader.onloadend = e => {
            spark.append(e.target.result);
            currentChunk++;
            this.progress = currentChunk / chunks;

            if (progressFn && typeof progressFn === 'function') {
                progressFn(this.progress)
            }

            if (this.aborted) {
                md5Fn('aborted');
                return
            }

            if (currentChunk < chunks) {
                loadNext()
            } else {
                md5Fn(null, spark.end())
            }
        };

        function loadNext() {
            const start = currentChunk * chunkSize;
            const end = start + chunkSize >= file.size ? file.size : start + chunkSize;
            reader.readAsArrayBuffer(blobSlice.call(file, start, end))
        }
    }

    abort() {
        this.aborted = true
    }
}


使用上述封装好的方法

import BMF from '../../component/md5File';//引入方法所在的文件

	// 上传文件方法
    handelCustomRequest = (option) => {

        let formData = new FormData();

        const bmf = new BMF();


        bmf.md5(
            option?.file,
            (err, md5) => {
                formData.append("md5", md5);
                formData.append("file", option?.file);
                formData.append("fileName", option?.file?.name);

               reqwest({
                    url:`请求接口URL`,
                    method: "post",
                    processData: false,
                    data: formData,
                    success: res => {
  						// 自定义内容
                    }
                })
            }
        );
    };

参考链接[https://www.npmjs.com/package/spark-md5)]

发布了5 篇原创文章 · 获赞 1 · 访问量 2230

猜你喜欢

转载自blog.csdn.net/qq_42179237/article/details/103890706
今日推荐