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时，它应该向该工作人员发布一条消息，并且该工作人员应该接收该消息。工人永远不会收到它。 debugger中的set-hit-percentages.worker.js永远不会被命中，console.log也不会被命中。

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

Answer 1

您将Point放到了worker.terminate();处理程序中，可能放错了位置。就像现在一样，该工人正在被产卵，但是几乎在此之后立即被杀死。

Web Worker与worker-loader内联加载时不起作用

1 个答案: