0

What I'm currently doing is to append a HTML canvas to my HTML body, draw a base64 image on it and afterwards call the toDataUrl() function to retrieve the base64 code back from the canvas (code developed in TypeScript):

// draw base64 image on a canvas via an Image
const canvas = document.createElement('canvas');
document.body.appendChild(canvas);
const ctx = canvas!.getContext('2d');
const image = new Image();
image.src = base64data;
 
// load image and retrieve base64 code from canvas
image.onload = function () {
  ctx!.drawImage(image, -image.width / 2, -image.height / 2);
  canvas!.toDataURL('image/' + imageType, 1)
  document.body.removeChild(canvas);
};

The issue here is that the toDataURL() function generates different base64 code in Firefox than in Chrome. Do I have to change anything? It is really important for me that the same base64 code is produced in all browsers.

enne87
  • 2,221
  • 8
  • 32
  • 61
  • `canvas!.getContext` why the `!.` (*typescript non-null assertion operator*)? How can we test your claim? Does it happens with any base64 string? – Roko C. Buljan May 08 '22 at 21:37
  • Seems like a **duplicate question** (with no answers so far) of: https://stackoverflow.com/q/10565218/383904 – Roko C. Buljan May 08 '22 at 21:42

0 Answers0