如何在网络工作者中使用电容器插件

Question

我已经在Ionic / React应用中添加了网络工作者。这是一个单独的打字稿代码库，并捆绑到/assets/dist/worker.js

要重现设置，您可以使用以下最小示例网络工作者：

import {v4} from 'uuid'

console.log('worker running');
onmessage=(e)=>{
    console.log('received message');
    postMessage(v4());
}

将其自己的tsconfig.json与"lib": ["WebWorker", "WebWorker.ImportScripts"],一起提供，并与您选择的捆绑器捆绑在一起。

请确保捆绑的javascript托管在/ assets下，并且您可以使用它来创建网络工作者，如下所示：

const myWorker = new Worker('assets/dist/worker.js');

export default function App(){
  const [v4, setV4] = useState("waiting for worker");
  myWorker.postMessage('go');
  myWorker.onmessage=(e)=>{
    setV4(e.data);
  }
  return (
  <IonApp>
    <p>{v4}</p>
  </IonApp>
)};

到目前为止，效果很好。但是它无法访问电容器插件。我想使用Webworker来减轻一些繁重的计算，其中包括对自定义本机代码的调用。可通过电容器插件访问此本地代码。但是任何电容器插件导入都会创建错误消息。将以下代码添加到工作程序：

import {Plugins} from '@capacitor/core';

const {Device} = Plugins;

它抛出：

ReferenceError: window is not defined

Answer 1

在黑暗中远射...但是如果您提出的问题是正确的，并且window实际上仅用作连接插件的全局对象，并且如果window中没有其他内容，Worker中不可用使用了作用域，那么你就可以做

self.window = self;

在工作脚本的开头。