0

this code work before the update in ios but after it didn't work anymore

resetOrientation(srcBase64, srcOrientation, callback) { const img = new Image(); 

img.onload = function() {
  const width = img.width,
      height = img.height,
      canvas = document.createElement('canvas'),
      ctx = canvas.getContext("2d");

  // set proper canvas dimensions before transform & export
  if (4 < srcOrientation && srcOrientation < 9) {
    canvas.width = height;
    canvas.height = width;
  } else {
    canvas.width = width;
    canvas.height = height;
  }

  // transform context before drawing image
  switch (srcOrientation) {
    case 2: ctx.transform(-1, 0, 0, 1, width, 0); break;
    case 3: ctx.transform(-1, 0, 0, -1, width, height ); break;
    case 4: ctx.transform(1, 0, 0, -1, 0, height ); break;
    case 5: ctx.transform(0, 1, 1, 0, 0, 0); break;
    case 6: ctx.transform(0, 1, -1, 0, height , 0); break;
    case 7: ctx.transform(0, -1, -1, 0, height , width); break;
    case 8: ctx.transform(0, -1, 1, 0, 0, width); break;
    default: break;
  }

  // draw image
  ctx.drawImage(img, 0, 0);

  // export base64
  callback(canvas.toDataURL());
};

 img.src = srcBase64;

}

Someone can help please?

Mandrindra
  • 1
  • 1
  • 3
  • I am experiencing the same issue but in PHP. Just the other week photos started being uploaded with the wrong orientation. The only difference I find in the actual EXIF data is that the Height and Width properties have switched places (even on old photos). – Fredrik Jungstedt May 19 '20 at 13:37
  • so you suggest to switched the height and width?what your solution?? – Mandrindra May 19 '20 at 14:19
  • I found that the problem for me was that I was using an external library that was rotating the image on the client side. Apparently, webkit browsers do this themselves now, resulting in the rotation happening twice: https://stackoverflow.com/a/61412308/7060077 – Fredrik Jungstedt May 20 '20 at 07:40

1 Answers1

0

you can use this easy tools and it takes care of orientation for you.

loadImage( event.target.files[0], (img) => { var base64data = img.toDataURL('image/jpeg') }, { orientation: true, } );

https://github.com/blueimp/JavaScript-Load-Image/

Soroush Bk
  • 31
  • 2