Web Worker,它在angular应用程序中使用模块中的代码

问题描述

我有一个角度应用程序,我需要使用网络工作者来执行一些代码,但是代码依赖于某个模块。

工作程序是这样初始化的,如果不需要外部模块,它将正常工作

  var worker = new Worker('data:text/javascript;base64,' + btoa('self.postMessage((' + String(code) + '\n)());'));
@H_502_6@

其中code@H_502_6@是函数引用。

那么我该如何做呢?最好不要实时加载模块。

解决方法

您必须从工作人员定义一个模块(文件),然后导入所需的外部模块。 像这样:

outermodule.js:

var value = "my value";
module.exports = value;

worker.js

var value = require('./outermodule');

addEventListener('message',({ data }) => {
  const response = `worker response: ${value}` ;
  postMessage(response);
});

主线程: index.js

const worker = new Worker('./worker',{ type: 'module' });
  worker.onmessage = ({ data }) => {
    console.log(`got message from worker: ${data}`);
  };
  worker.postMessage('hello');

阅读材料:

  1. https://developer.mozilla.org/en-US/docs/Web/API/Worker/Worker
  2. https://angular.io/guide/web-worker