内联加载的 Web Worker 与 worker-loader 不工作

Question

我有以下代码：

src/store/modules/outcome-analyzer/outcome-analyzer.js

import Worker from 'worker-loader!./set-hit-percentages.worker.js';

// ...

let actions = {
  setHitPercentages: function (context) {
    let worker = new Worker();
    // let players = resultsMutations.constructPlayersForSetHitPercentages(context.state);

    // worker.postMessage({
    //   message: 'get hit percentages',
    //   players: players,
    // });

    worker.postMessage({
      message: 'test',
      value: 'foobar',
    });

    worker.onmessage = function (e) {
      if (e.data.message === 'finished') {
        context.commit('outcomeAnalyzer/setHitPercentages', e.data.hitPercentages);
      }
    };
    worker.terminate();
  },
};

src/store/modules/outcome-analyzer/set-hit-percentages.worker.js

self.addEventListener('message', function (e) {
  debugger;
  if (e.data.message === 'test') {
    console.log(e.data.value);
  }
  else if (e.data.message === 'get hit percentages') {}
});

当调用 setHitPercentages 时，它应该 post 向工作人员发送一条消息，工作人员应该会收到它。工人永远不会收到它。 set-hit-percentages.worker.js 中的 debugger 永远不会被命中，console.log.

也不会被命中

在 setHitPercentages 调试器中，我看到 Worker 已定义。我还看到 worker 是在 let worker = new Worker(); 运行之后定义的。 worker 有 onmessasge 和 onerror 方法，它继承了其他东西，比如 postMessage.
我的 node_modules 中有 worker-loader。在 package.json 我有 "worker-loader": "^1.1.1".
我在我的代码的另一部分使用了一个 worker，它可以工作。有效的代码似乎与我在此处 post 编辑的无效代码完全相似，包括 import Worker from 'worker-loader!./xxx-yyy-zzz.worker.js'; 部分。
我正在使用 Chrome。我也试过 Safari，也没有用。
当我重现问题时，我没有启动另一个 worker，但是 this answer 说多个 worker 不应该引起问题。（我也试过启动另一个工人，终止它，然后运行有问题的代码，在那种情况下问题仍然存在。当我注释掉另一个工人的代码时，我也继续有问题。）
这是一个以 vue-webpack-boilerplate 开头的 Vue 应用程序。

Answer 1

您放错了 worker.terminate();，您可能想要在 onmessage 处理程序中放置它。就像现在一样，工人正在生成，但几乎立即被杀死。

内联加载的 Web Worker 与 worker-loader 不工作

Web Worker loaded inline with worker-loader not working

javascript

web-worker

webpack

vue.js