Question

我有4个数字Javascript数组，分别叫做latitude_array，longitude_array，camera_angle_array和time_array。

我只是希望将这些传递给Web工作者，对它们进行一些处理并检索它们。

我发现当前的方法存在巨大的开销，即使用以下方式发送数组：

var arrays_to_pass = [latitude_array, longitude_array, camera_angle_array, time_array];
thin_data_worker.postMessage(arrays_to_pass);

然后反过来从网络工作者那里检索它们。

我想使用可转移对象来将4个阵列传递给工作人员并让他们回来加快速度。

我显然不了解网络工作者，因为我试图做以下事情：

var object = {latitude:latitude_array, longitude:longitude_array, camera_angle:camera_angle_array,time:time_array}; 
thin_data_worker.postMessage(object, [object.latitude, object.longitude, object.camera_angle, object.time]);

但是在Firefox中我得到错误＆＃39;该对象无法克隆＆＃39;。

Web worker正在尝试使用以下方法检索数组：

self.addEventListener('message', function(e) {
  var latitude_array = e.data.latitude;
  var longitude_array = e.data.longitude;
  var camera_angle_array = e.data.camera_angle;
  var time_array = e.data.time;
)};

如何从Web工作者传递这4个数组（并将其取回）？

Answer 1

您不需要为'message'事件附加事件处理程序。默认情况下处理。

通过查看代码，我了解到您尝试创建dedicated worker。

你可以这样做。

首先创建worker.js文件并存储它。

这是worker.js

onmessage = function(fromConsumer){
    console.log(fromConsumer.data); //Will print the passed array 
    postMessage("I am sending the data  to consumer.");
}

然后从创建worker的脚本中创建worker对象。

 var my = new Worker('path_to_worker_js/worker.js');

 my.postMessage([1,2,4]);  // sending the array

 my.onmessage = function(dataFromWorker){

      console.log(dataFromWorker); //From consumer
 }

此脚本中有您创建了my对象并在postMessage方法的帮助下发送数据。然后在worker.js中，我们收听onmessage事件并使用fromConsumer.data之类的参数获取传递的数据。再次从这里我们使用postMessage将数据发送给消费者。

现在这次我们在onmessage

等工作对象上监听my.onmessage事件

您可以阅读更多from here

更新：

来自docs

主页和工作人员之间传递的数据被复制，而不是共享。对象在传递给工作者时被序列化，随后在另一端被反序列化。页面和工作程序不共享同一个实例，因此最终结果是在每一端创建了一个副本。大多数浏览器都将此功能实现为结构化克隆。

将多个数组发送给Web worker - ＆gt;无法克隆该对象

1 个答案: