js的MD5和SHA256摘要生成使用并對異步處理問題進(jìn)行解決
import SparkMD5 from 'spark-md5'
import CryptoJS from 'crypto-js'
/**
?* 依據(jù)指定摘要算法生成hash摘要
?*/
export function digestGeneration (digest, file) {
? return new Promise(function (resolve, reject) {
? ? // element 中組件對 file 進(jìn)行加工,這里使用未加工的對象,只有未加工的對象才能在 blobSlice.call() 中正常操作
? ? let fileRaw = file.raw
? ? // 創(chuàng)建md5
? ? let spark = new SparkMD5()
? ? // 創(chuàng)建sha256
? ? let sha256 = CryptoJS.algo.SHA256.create()
? ? // 使得支持多種瀏覽器的文件讀取
? ? let blobSlice = File.prototype.slice || File.prototype.mozSlice || File.prototype.webkitSlice
? ? let fileReader = new FileReader()
? ? let chunkSize = 1024 // 分割的塊的大小最大為1k
? ? let chunks = Math.ceil(file.size / chunkSize)
? ? let currentChunk = 0
? ? let result
? ? // fileReader文件讀取成功時觸發(fā)的事件定義
? ? fileReader.onload = function (e) {
? ? ? // 依據(jù)傳過來的摘要算法選擇進(jìn)行區(qū)分使用的摘要算法
? ? ? if (digest === '0') {
? ? ? ? spark.append(e.target.result)
? ? ? } else if (digest === '1') {
? ? ? ? sha256.update(arrayBufferToWordArray(e.target.result))
? ? ? }
? ? ? currentChunk++
? ? ? if (currentChunk < chunks) {
? ? ? ? loadNext()
? ? ? } else {
? ? ? ? // 依據(jù)傳過來的摘要算法選擇進(jìn)行返回結(jié)果的摘要算法
? ? ? ? if (digest === '0') {
? ? ? ? ? result = spark.end()
? ? ? ? } else if (digest === '1') {
? ? ? ? ? let res = sha256.finalize()
? ? ? ? ? result = res.toString(CryptoJS.enc.Hex).toLowerCase()
? ? ? ? }
? ? ? ? resolve(result)
? ? ? }
? ? }
? ? // 文件讀取失敗時觸發(fā)
? ? fileReader.onerror = function () {
? ? ? this.$message.error('文件讀取出錯!')
? ? }
? ? // 讀取操作
? ? function loadNext () {
? ? ? let start = currentChunk * chunkSize
? ? ? let end = start + chunkSize >= file.size ? file.size : start + chunkSize
? ? ? fileReader.readAsArrayBuffer(blobSlice.call(fileRaw, start, end))
? ? }
? ? // 開始執(zhí)行fileReader讀取文件
? ? loadNext()
? })
}
/**
?* arraybuffer to wordarray 的轉(zhuǎn)換函數(shù)
?*/
function arrayBufferToWordArray (ab) {
? let i8a = new Uint8Array(ab)
? let a = []
? for (let i = 0; i < i8a.length; i += 4) {
? ? a.push(i8a[i] << 24 | i8a[i + 1] << 16 | i8a[i + 2] << 8 | i8a[i + 3])
? }
? return CryptoJS.lib.WordArray.create(a, i8a.length)
}

注意:
傳入的digest判斷(區(qū)分本次使用的是MD5還是SHA256)用的是'1'和'0'而不是1和0
result是要返回的數(shù)據(jù)
這里是對文件進(jìn)行摘要生成
本文內(nèi)容可單獨(dú)形成一個工具文件
下一篇將有本篇的具體實(shí)例使用
PS:
小菜鳥,有問題請?zhí)岢?,使用過程可以自行優(yōu)化