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

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

请问怎么解决这个问题?

阅读 938
1 个回答

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

const worker = new Worker('hash.worker.js(放这个所在位置)');
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题