vue-cli创建的项目，使用web-worker计算文件内容报错？

  • Z时代
  • 2024-02-25
  • 分类：IT

hash.worker.js内容：

self.importScripts('spark-md5.min.js'); // 导入脚本
// 全量 Hash
postHashMsg = (fileChunkList) => {
  const spark = new self.SparkMD5.ArrayBuffer();
  let count = 0;
  const loadNext = (index) => {
    const reader = new FileReader();
    reader.readAsArrayBuffer(fileChunkList[index].chunk);
    reader.onload = (e) => {
      count++;
      spark.append(e.target.result);
      if (count === fileChunkList.length) {
        self.postMessage({
          hash: spark.end(),
        });
        self.close();
      } else {
        // 递归计算下一个切片
        loadNext(count);
      }
    };
  };
  loadNext(0);
};
self.onmessage = (e) => {
  const { fileChunkList, type } = e.data;
  if (type === "HASH") {
    console.log("self onmessage===>", e, fileChunkList, type);
    postHashMsg(fileChunkList);
  }
};

在另外一个js文件函数引用：

import Worker from './hash.worker.js';
function calculateFileHash(fileChunkList) {
  return new Promise(resolve => {
    const worker = new Worker();
    worker.postMessage({ fileChunkList, type: 'HASH' });
    worker.onmessage = e => {
      const { hash } = e.data;
      if (hash) {
        resolve(hash);
      }
    };
  });
}

启动的时候报了以下错误：

Uncaught TypeError: self.importScripts is not a function

请问怎么解决这个问题?

回答：

使用的地方应该引入你的线程（路径）
上方import应该去掉

const worker = new Worker('hash.worker.js（放这个所在位置）');

以上是 vue-cli创建的项目，使用web-worker计算文件内容报错？ 的全部内容， 来源链接： utcz.com/p/935070.html

回到顶部