HTML5画布数据URL在比较时是否不相同？（javascript/jquery）

我有一个javascript/Jquery函数，如下所示：

function loadRawData()

canvasData = canvas.toDataURL("image/png");

rawData = $('#imgInput').val();


//check the raw data box is not empty or identical to the canvas
if(rawData == ""){
    console.log("Raw data box is empty!");
}else if(rawData != canvasData){

//WHY ARE THEY DIFFERENT???
    alert(canvasData);
    alert(rawData);
///////////////////////////

    // load image from data url
    raw = new Image();
    raw.src = rawData;
    raw.onload = function() {
        //Clear canvas for the new image
        clearCanvas();

        context.drawImage(raw, 0, 0);
    }

    console.log("Canvas restored to rawData");

}else{
 console.log("Canvas failed to restore (same as canvas?)");
}
}

当调用我的函数时，它会从ID为“imgInput”的文本区域加载数据，并显示我试图加载的图片；但当我在后面立即调用它时，它会通过else传递true，即使这两个变量应该是相同的

我制作了两个警报框来查看每个变量的数据，果然，画布的URL和原始数据的URL完全不同，但是加载的图片是相同的

发生什么事了？我不知道我在哪里搞砸了？

---

提前感谢您提供的任何建议=）

假设尺寸相同，是什么让您认为它们是相等的？有没有规范支持这一点？在png中编码图像的方法不止一种。dystroy是正确的，这不是一个现实的场景。PNG生成的不同实现可能使用不同的压缩级别/算法变体，而且嵌入原始图像数据（f.e.EXIF，…）中的元数据当然不会出现在

toDataURL

返回的内容中。@destroy好吧，我仍在学习如何工作，但是当我反复调用函数时，每次得到的两个值都是相同的。我正在加载、保存和重新加载的图像每次都是相同的，不会改变。从字面上说，我正在保存画布，然后重新加载，并检查两个值是否相同（在我看来，这两个值应该是逐像素相同的）。你的意思是用浏览器中获得的数据填充#imgInput输入？@destroy我正在将数据放入#imgInput并重新加载，以查看是否相同（应该是哪一种，如果这是有效的，我认为它是如何工作的？）