從畫布中獲取不正確的像素數據

1）我有base64圖像數據，此圖像用於在畫布內繪製爲圖像。後來我把它作爲base64取回，發送給另一個服務，並創建一個圖像（存儲爲存儲內的圖像文件）。從畫布中獲取不正確的像素數據

2）在另一個頁面中，我將這個圖像作爲base64加載，在畫布內部拉回。所有渲染部分看起來都很好，並且工作完美。

但是，Uint8ClampedArray no（1）與no（2）不同。或者這是一種預期的行爲？這裏是我的代碼：

/** first part **/ 
var img = new Image(); 
img.src = 'data:image/jpeg;base64,' + data.result; 
// wait for image finish load 
// then draw image into canvas 
img.onload = function() { 
    // draw cover image into canvas 
    // ctx is just canvas context 
    ctx.drawImage(img, 0, 0); 
    // clampedArray is just a normal variable 
    clampedArray = ctx.getImageData(0, 0, canvas.height, canvas.width); 
    console.log(clampedArray.data); //<----------------------- (1) 
    var base64Image = secret.toDataURL('image/jpeg'); 
    // sending base64Image to another services 
} 

/** second part/another page **/ 
var img = new Image(); 
img.src = 'data:image/jpeg;base64,' + data.result; 
img.onload = function() { 
    ctx.drawImage(img, 0, 0);    
    clampedArray = ctx.getImageData(0, 0, coverAfter.height,coverAfter.width); 
    console.log(clampedArray.data); //<----------------------- (2) 
}

data.result返回相同的base64，但是當我console.log兩個（1）和（2），我得到了不同的結果（Uint8ClampedArray）

來源

2017-05-14 Norlihazmey Ghazali

@Kaiido謝謝，我會看看它，似乎是目前唯一的方式 –

我猜這兩個base64字符串是而不是等於。當您運行secret.toDataURL('image/jpeg')時，您將重新編碼原始jpeg圖像，其中(most likely)會稍微改變圖像。因此，base64Image將不會與原來的data.result相同。

來源

2017-05-14 16:24:09 Sphinxxx

看起來像它的完全不同。猜猜需要看看@ kaiido的答案 –

從畫布中獲取不正確的像素數據

回答

相關問題