Web工作人員處理imageData與Firefox的工作，但不是鉻

當我運行的代碼處理imageData被傳遞給Web工作人員，然後回來，然後Firefox運行良好，但Chrome提供了「未捕獲的錯誤：DATA_CLONE_ERR：DOM異常25」Web工作人員處理imageData與Firefox的工作，但不是鉻

搜索谷歌表明，舊版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'}); 
    }

我應該按順序使用什麼方法來這個圖象 - 送來回應用程序和網絡工作者？

謝謝！

編輯：

如果我複製到規則陣列之後，Chrome開始工作......

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

因此Chrome無法在CanvasPixelArray傳遞給工人，但它可以通過規則陣列。但Firefox可以。

來源

2012-01-08 garg

http：// stackoverflow。com/questions/7506635/uncaught-error-data-clone-err-dom-exception-25-by-web-worker – 2012-01-08 10:25:02

oops。謝謝。讓我試試:) – garg 2012-01-08 11:05:19

我還不清楚這一點。我傳遞的數據（context.getImageData（0，0，canvas.width，canvas.height）.data）是一個大數組，不應該有任何循環引用錯誤。如果它正在通過postMessage在內部轉換爲JSON，那麼它應該只是通過出錯。據我所知，我沒有轉發DOM元素。 – garg 2012-01-08 12:02:05

作爲後續發佈。我可以重現你的錯誤，以防其他人可以回答你的問題（我不能遺憾地）。我已經搜索了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.

從Firefox：

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].

來源

2012-01-08 17:58:54

謝謝你的關注！這使用類似的代碼：http://dylanfm.github.com/Ladderfck/（https://github.com/garg/Ladderfck/blob/master/javascripts/app.js）它在Chrome上工作得很好，但我'米不知道爲什麼我的工作不正常。再次感謝 – garg 2012-01-08 18:20:07

如果我複製到常規數組，然後Chrome開始工作 – garg 2012-01-08 22:01:09

標記爲答案，因爲您的原始評論是正確的，但現在我明白了。感謝您的幫助 – garg 2012-01-08 22:38:10

如果我陣列複製getimagedata.data以規則排列和然後將該數組傳遞給webworker，然後Chrome開始工作。

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

因此Chrome無法通過一個CanvasPixelArray一個工人，但它可以通過規則陣列。但是Firefox可以直接傳遞imagedata.data。

來源

2012-01-08 22:07:30 garg

慚愧，你似乎無法直接像FF那樣做。也許Chrome的CanvasPixelArray有一些鏈接到DOM，或者Chrome可能會對它允許通過的數據過於謹慎。 – 2012-01-09 01:01:57

我要做的就是從上下文傳遞整個圖象 - 對象的工人，而不僅僅是數據：

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});

用這種方法你傳遞一些額外的屬性給工人（即，數組的寬度和高度），但我認爲這一點額外的數據比複製整個數據數組相關的開銷要好。

來源

2012-05-10 04:53:44

這應該是被接受的答案。在當前的chrome（v33）中，傳遞整個ImageData對象。 – 2014-03-07 16:42:39

Web工作人員處理imageData與Firefox的工作，但不是鉻

回答

相關問題