我正在尝试在我的React应用程序中实现Web Workers,以便在多个选项卡中共享单个WebSockets连接。我在Web Workers中使用worker-loader依赖项进行加载。
不幸的是,我甚至不能让一个简单的、专注的网络工作者去工作。
App.jsx:
import React, { Component } from 'react';
// eslint-disable-next-line
import myWorker from 'worker-loader!./worker.js';
class App extends Component {
constructor(props) {
super();
this.state = {};
}
componentWillMount() {
if(window.SharedWorker) {
console.log(myWorker);
myWorker.port.postMessage('Hello worker');
myWorker.port.onmessage = function(e) {
console.log('Message received from worker');
console.log(e.data);
}
}
worker.js:
onconnect = function(e) {
var port = e.ports[0];
port.onmessage = function(e) {
var workerResult = 'Result: ' + (e.data[0] * e.data[1]);
port.postMessage(workerResult);
}
}
加载页面时,出现如下的webpack错误:
我不能使用worker-loader的配置风格的用法,因为这需要在webpack的配置中做一些更改。无法编辑此配置,因为存在create-react-app。如果我弹出create-react-app,我可以,但这确实有一些缺点。
为什么不动呢?有人有什么想法吗?
提前谢谢你,
麦克
发布于 2018-06-10 05:57:40
正如@KevBot指出的那样,我必须创建一个新的Worker实例:
// eslint-disable-next-line
import Worker from 'worker-loader!./worker.js';
let myWorker = new Worker();
https://stackoverflow.com/questions/50778655
复制相似问题