canvas2d toDataURL（）在不同的浏览器上有不同的输出 [英] canvas2d toDataURL() different output on different browser

问题描述

我有相同的图像和相同大小的画布，但输出不同。我想要相同的输出，我应该怎么做？

  var canvas = document.createElement（'canvas'），
 ctx = canvas.getContext（'2d'），
 img = new Image; 
 
 img.crossOrigin ='Anonymous'; 
 
 img.onload = function（）{
 canvas.height = img.height; 
 canvas.width = img.width; 
 ctx.drawImage（img，0，0）; 
 var dataURL = canvas.toDataURL（）; 
 setBreakpoint（dataURL）; 
 callback.call（this，dataURL）; 
 canvas = null; 
}; 
 
 img.src = url; 
  

解决方案

使用 FileReader 及其方法 readAsDataURL（） 。

对于外部文件，您仍然可以使用它来感谢 XMLHttpRequest Object和它的 xhr .responseType =blob属性，同时受到跨源请求的限制。

我没有试过每个浏览器，但应该是比画布更精确。

绘制到画布上的图像在绘制之前被解码，然后在 toDataURL 时重新编码调用。这个过程依赖于每个浏览器，甚至每台机器（请参阅画布指纹和 @Oriol的这篇文章。

显然，这个过程会修改您的原始文件的内容（它实际上与它无关）。

---

编辑，

我认为这个答案可能是测试这种技术的好地方，所以这里有一个片段，它将测试您的浏览器对我的转换。 p>

var xhr = new XMLHttpRequest（）; xhr.responseType ='blob'; xhr .onload = function（）{var f = new FileReader（）; f.onload = function（）{if（this.result === imageDataURL）{console.log（'same conversion'）; } else {console.log（'请发表评论让我知道它也是浏览器/机器相关的）; }}; f.readAsDataURL（this.response）;}; xhr.open（'GET'，'https://dl.dropboxusercontent.com/s/4e90e48s5vtmfbd/aaa.png');xhr.send();var imageDataURL ='数据：图像/ PNG; BASE64，iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAAEzo7pQAAAACXBIWXMAAAsTAAALEwEAmpwYAAAKT2lDQ1BQaG90b3Nob3AgSUNDIHByb2ZpbGUAAHjanVNnVFPpFj333vRCS4iAlEtvUhUIIFJCi4AUkSYqIQkQSoghodkVUcERRUUEG8igiAOOjoCMFVEsDIoK2AfkIaKOg6OIisr74Xuja9a89 + BN / rXXPues852zzwfACAyWSDNRNYAMqUIeEeCDx8TG4eQuQIEKJHAAEAizZCFz / SMBAPh + PDwrIsAHvgABeNMLCADATZvAMByH / W / qQplcAYCEAcB0kThLCIAUAEB6jkKmAEBGAYCdmCZTAKAEAGDLY2LjAFAtAGAnf + bTAICd + Jl7AQBblCEVAaCRACATZYhEAGg7AKzPVopFAFgwABRmS8Q5ANgtADBJV2ZIALC3AMDOEAuyAAgMADBRiIUpAAR7AGDIIyN4AISZABRG8lc88SuuEOcqAAB4mbI8uSQ5RYFbCC1xB1dXLh4ozkkXKxQ2YQJhmkAuwnmZGTKBNA / g88wAAKCRFRHgg / P9eM4Ors7ONo62Dl8t6r8G / yJiYuP + 5C + rcEAAAOF0ftH + LC + zGoA7BoBt / qIl7gRoXgugdfeLZrIPQLUAoOnaV / NW + H48PEWhkLnZ2eXk5NhKxEJbYcpXff5nwl / AV / 1S + X48 / Pf14L7iJIEyXYFHBPjgwsz0TKUcz5IJhGLc5o9H / LCL // wd0yLESWK5WCoU41EScY5EmozzMqUiiUKSKcUl0v9k4t8s + WM + 3zUAsGo + AXuRLahdY wP2SycQWHTA4vcAAPK7b8HUKAgDgGiD4c93 / + 8 // UegJQCAZkmScQAAXkQkLlTKsz / HCAAARKCBKrBBG / TBGCzABhzBBdzBC / xgNoRCJMTCQhBCCmSAHHJgKayCQiiGzbAdKmAv1EAdNMBRaIaTcA4uwlW4Dj1wD / phCJ7BKLyBCQRByAgTYSHaiAFiilgjjggXmYX4IcFIBBKLJCDJiBRRIkuRNUgxUopUIFVIHfI9cgI5h1xGupE7yAAygvyGvEcxlIGyUT3UDLVDuag3GoRGogvQZHQxmo8WoJvQcrQaPYw2oefQq2gP2o8 + Q8cwwOgYBzPEbDAuxsNCsTgsCZNjy7EirAyrxhqwVqwDu4n1Y8 + xdwQSgUXACTYEd0IgYR5BSFhMWE7YSKggHCQ0EdoJNwkDhFHCJyKTqEu0JroR + cQYYjIxh1hILCPWEo8TLxB7iEPENyQSiUMyJ7mQAkmxpFTSEtJG0m5SI + ksqZs0SBojk8naZGuyBzmULCAryIXkneTD5DPkG + Qh8lsKnWJAcaT4U + IoUspqShnlEOU05QZlmDJBVaOaUt2ooVQRNY9aQq2htlKvUYeoEzR1mjnNgxZJS6WtopXTGmgXaPdpr + h0uhHdlR5Ol9BX0svpR + iX6AP0dwwNhhWDx4hnKBmbGAcYZxl3GK + YTKYZ04sZx1QwNzHrmOeZD5lvVVgqtip8FZHKCpVKlSaVGyovVKmqpqreqgtV81XLVI + pXlN9rkZVM1PjqQnUlqtVqp1Q61MbU2epO6iHqmeob1Q / pH5Z / YkGWcNMw09DpFGgsV / jvMYgC2MZs3gsIWsNq4Z1gTXEJrHN2Xx2KruY / R27iz2qqaE5QzNKM1ezUvOUZj8H45hx + Jx0TgnnKKeX836K3hTvKeIpG6Y0TLkxZVxrqpaXllirSKtRq0frvTau7aedpr1Fu1n7gQ5Bx0onXCdHZ4 / OBZ3nU9lT3acKpxZNPTr1ri6qa6UbobtEd79up + 6Ynr5egJ5Mb6feeb3n + hx9L / 1U / W36p / VHDFgGswwkBtsMzhg8xTVxbzwdL8fb8VFDXcNAQ6VhlWGX4YSRudE8o9VGjUYPjGnGXOMk423GbcajJgYmISZLTepN7ppSTbmmKaY7TDtMx83MzaLN1pk1mz0x1zLnm + eb15vft2BaeFostqi2uGVJsuRaplnutrxuhVo5WaVYVVpds0atna0l1rutu6cRp7lOk06rntZnw7Dxtsm2qbcZsOXYBtuutm22fWFnYhdnt8Wuw + 6TvZN9un2N / T0HDYfZDqsdWh1 + c7RyFDpWOt6azpzuP33F9JbpL2dYzxDP2DPjthPLKcRpnVOb00dnF2e5c4PziIuJS4LLLpc + Lpsbxt3IveRKdPVxXeF60vWdm7Obwu2o26 / uNu5p7ofcn8w0nymeWTNz0MPIQ + BR5dE / C5 + VMGvfrH5PQ0 + BZ7XnIy9jL5FXrdewt6V3qvdh7xc + 9j5yn + M + 4zw33jLeWV / MN8C3yLfLT8Nvnl + F30N / I / 9K / 3R / 0QCngCUBZwOJgUGBWwL7 + Hp8Ib + OPzrbZfay2e1BjKC5QRVBj4KtguXBrSFoyOyQrSH355jOkc5pDoVQfujW0Adh5mGLw34MJ4WHhVeGP45wiFga0TGXNXfR3ENz30T6RJZE3ptnMU85ry1KNSo + qi5qPNo3ujS6P8YuZlnM1VidWElsSxw5LiquNm5svt / 87fOH4p3iC + N7F5gvyF1weaHOwvSFpxapLhIsOpZATIhOOJTwQRAqqBaMJfITdyWOCnnCHcJnIi / RNtGI2ENcKh5O8kgqTXqS7JG8NXkkxTOlLOW5hCepkLxMDUzdmzqeFpp2IG0yPTq9MYOSkZBxQqohTZO2Z + pn5mZ2y6xlhbL + xW6Lty8elQfJa7OQrAVZLQq2QqboVFoo1yoHsmdlV2a / zYnKOZarnivN7cyzytuQN5zvn // tEsIS4ZK2pYZLVy0dWOa9rGo5sjxxedsK4 xUFK4ZWBqw8uIq2Km3VT6vtV5eufr0mek1rgV7ByoLBtQFr6wtVCuWFfevc1 + 1dT1gvWd + 1YfqGnRs + FYmKrhTbF5cVf9go3HjlG4dvyr + Z3JS0qavEuWTPZtJm6ebeLZ5bDpaql + aXDm4N2dq0Dd9WtO319kXbL5fNKNu7g7ZDuaO / PLi8ZafJzs07P1SkVPRU + lQ27tLdtWHX + G7R7ht7vPY07NXbW7z3 / T7JvttVAVVN1WbVZftJ + 7P3P66Jqun4lvttXa1ObXHtxwPSA / 0HIw6217nU1R3SPVRSj9Yr60cOxx ++ / p3vdy0NNg1VjZzG4iNwRHnk6fcJ3 / ceDTradox7rOEH0x92HWcdL2pCmvKaRptTmvtbYlu6T8w + 0dbq3nr8R9sfD5w0PFl​​5SvNUyWna6YLTk2fyz4ydlZ19fi753GDborZ752PO32oPb ++ 6EHTh0kX / I + c7vDvOXPK4dPKy2 + UTV7hXmq86X23qdOo8 / pPTT8e7nLuarrlca7nuer21e2b36RueN87d9L158Rb / 1tWeOT3dvfN6b / FF9 / XfFt1 + cif9zsu72Xcn7q28T7xf9EDtQdlD3YfVP1v + 3Njv3H9qwHeg89HcR / cGhYPP / pH1jw9DBY + Zj8uGDYbrnjg + OTniP3L96fynQ89kzyaeF / 6I / suuFxYvfvjV69fO0ZjRoZfyl5O / bXyl / erA6xmv28bCxh6 + yXgzMV70VvvtwXfcdx3vo98PT + R8IH8o / 2j5sfVT0Kf7kxmTk / 8EA5jz / GMzLdsAAAAgY0hSTQAAeiUAAICDAAD5 / wAAgOkAAHUwAADqYAAAOpgAABdvkl / FRgAAAwBQTFRFAAAAEBAQMAAAICAgMGUAZTAAZTAwREREVVVVZWVldXV1TLYEmWUAmWUwmc4kzpkAzpll / 84A / 84wiYmJqqqqzs7OAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAPcxUCgAAABd0Uk5T ///////////////////////////// wDmQOZeAAACLElEQVR42mIUY2BgYGJgeM3AxPBd4C0LAyfDPwAAAAD // 2KEiL1 + y8DEwCDMwMTA9pYBA AAA // 8EwTEOABAUBbB6m8Qm3P9 + 8gerSdu2s84ijPJK6NwplKR8AAAA // // 8syrEKgCAABuHzt5Z0EAzf // 1EEESEIG3Im77hTOJPQN4YZMA6lj2p10F950oREebt92x6A1GEnsJH1hysAAgCURS9DpYpQYuh 9AGaTAFi2sheSmt76cN5xvHshxJcMOQC / KPB0I2n3MhUuakJ77TB5QI + JCjRARAN2obRmo0bQKFloB / D2 + bJDLDoJAEARrF4JZBImO + V / f5zgXZUENDw9EhOgcK53u1PwAzx + ggOoChCuXVaJwRlXpqsP15O0MrCzzun4kL2xycWPsQ9ql47hJ8KANssviEJp7NukbxW0L + dwh0h8jz8WKxtaHTr / glEVx / qCTvsHeYQPOG4I7Y4BgAPJ58uLepJHbasMwEAXHkhJVMgkNtv // A2XRtL7JEK / y0LqmrqEPfVuWw7B75teCv / rhQCQQqjHV0GZYjf4MNG1RtjVy0Sz9EYGaQEJr0CS6DaLLryGWrtemP + XO5 + m63P0uEL3GTOaUkyN5hfmYinz325GMSDOmwtoZXMR7RqrvGwLqQhdu​​vJ1Jn42B2xUV5boMGAvzozkqSm56UOrVDYMtw1Ggee9KJ0Wh1Isl7F1EkGpkUiA4Zs7yELXaiwCy4WRlr19U / 7L5HAAZyaffhXaAFwAAAABJRU5ErkJggg == ';

I have the same image and the same size of canvas, but the output is different. I want the same output, how should I do it?

var canvas = document.createElement('canvas'),
    ctx = canvas.getContext('2d'),
    img = new Image;

img.crossOrigin = 'Anonymous';

img.onload = function(){
    canvas.height = img.height;
    canvas.width = img.width;
    ctx.drawImage(img, 0, 0);
    var dataURL = canvas.toDataURL();
    setBreakpoint(dataURL);
    callback.call(this, dataURL);
    canvas = null;
};

img.src = url;

解决方案

Use a FileReader and its method readAsDataURL().

For external files, you can still use it thank to XMLHttpRequest Object and its xhr.responseType = "blob" property, while limited by cross-origin requests.

I didn't tried on every browser but this should be more precise than canvas.

Image drawn onto the canvas are decoded before being drawn, then reencoded when the toDataURL is called. this process is dependent on every browser, and even every machine (look at canvas fingerprinting and this post by @Oriol).

Obviously, this process will modify the content of your original file (it actually has nothing to do with it any more.)

---

Edit,

I thought this answer could be a good place to test this technique, so here is a snippet, which will test your browser's conversion against mine.

var xhr = new XMLHttpRequest();
xhr.responseType = 'blob';
xhr.onload = function() {
  var f = new FileReader();
  f.onload = function() {
    if (this.result === imageDataURL) {
      console.log('same conversion');
    }
    else {
      console.log('please post a comment to let me know that it\'s also browser/machine dependant');
      }
  };
  f.readAsDataURL(this.response);
};

xhr.open('GET', 'https://dl.dropboxusercontent.com/s/4e90e48s5vtmfbd/aaa.png');
xhr.send();

var imageDataURL = 'data:image/png;base64,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';

这篇关于canvas2d toDataURL（）在不同的浏览器上有不同的输出的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！