处理 imageData 的 Web Worker 使用 Firefox，但不适用于 Chrome

Question

当我运行处理将 imageData 传递给网络工作者然后返回的代码时，Firefox 工作得很好，但 Chrome 给出了“未捕获的错误：DATA_CLONE_ERR：DOM 异常 25”

搜索 google 表明旧版本的 Chrome 曾经可以工作？

我又检查了一些，似乎我需要在发送图像数据之前运行 JSON.stringify 和 JSON.parse，但随后它就停止工作了。在 FF 9 中运行的代码是：

image.js:

var myImageData = context.getImageData(0, 0, canvas.width, canvas.height).data;
var worker = new Worker("http://direct.link/helpers/worker.js");
worker.postMessage(myImageData);  
worker.onmessage = function(event) {
  var value = event.data;
  switch (value.cmd){
    case 'last':
      //doing stuff 
      break;
  default:
      //doing stuff
    });
}

worker.js:

addEventListener('message', function(event) {
  var myImageData = event.data;
  // doing stuff.
  sendItBack(colors);
});
};

    function sendItBack(colors){
    each(colors, function(index, value){
      self.postMessage(value);
    }); 
    self.postMessage({'cmd': 'last'});
    }

我应该使用什么方法来将此图像数据来回发送到应用程序和 Web Worker？

谢谢！

编辑：

如果我复制到常规数组，则 Chrome 开始工作...

var newImageData = [];
for (var i=0,len=myImageData.length;i<len;++i) newImageData[i] = myImageData[i];

因此 chrome 无法将 CanvasPixelArray 传递给工作人员，但它可以传递常规数组。但火狐可以。

Answer 1

我所做的是将整个 imagedata 对象从上下文传递给工作人员，而不仅仅是数据：

var imgData = ctx.getImageData(0, 0, canvas.width, canvas.height);

// This works beautifully
worker.postMessage({imgData:imgData});

// But this throws the exception
worker.postMessage({imgData:imgData.data});

使用这种方法，您将一些额外的属性传递给工作人员（即数组的宽度和高度），但我认为这位额外数据比复制整个数据数组相关的开销要好。

Answer 2

将此作为后续发布。我可以重现您的错误，以防其他人可以回答您的问题（不幸的是我不能）。我搜索了 Chromium 问题，看看这是否是一个突出的错误，但没有发现任何东西。鉴于图像处理是 WebWorkers 更流行的用途之一，我希望有人能够快速回答您。

http://jsfiddle.net/gGFSJ/9/

来自 Chrome（星号是我添加的）：

window.URL does not exist
window.WebKitURL does not exist
using window.webkitURL for URL
window.BlobBuilder does not exist
using window.WebKitBlobBuilder for BlobBuilder
***Uncaught Error: DATA_CLONE_ERR: DOM Exception 25***
data=send back.
data=to worker.
data=send back.
data=0.

来自火狐浏览器：

using window.URL for URL
window.BlobBuilder does not exist
window.WebKitBlobBuilder does not exist
window.webkitBlobBuilder does not exist
using window.MozBlobBuilder for BlobBuilder
data=send back.
data=to worker.
data=send back.
data=0.
data=send back.
data=[object Uint8ClampedArray].

Answer 3

如果我将 getimagedata.data 数组复制到常规数组，然后将该数组传递给网络工作者，那么 Chrome 就会开始工作。

var newImageData = [];
for (var i=0,len=myImageData.length;i<len;++i) newImageData[i] = myImageData[i];

因此，chrome 无法将 CanvasPixelArray 传递给工作人员，但它可以传递常规数组。但 Firefox 可以直接传递imagedata.data。