ios - How to remove EXIF data from image using javascript? - Stack Overflow

admin管理员组

文章数量:1405294

I read in a file from an HTML file input. For iOS I can take a picture from the camera. The problem is that if you take the picture with the camera the content will include EXIF data(at least if I read the file content with the FileReader API).

I can't use canvas cropping if the image includes EXIF data. Because the image get destroyed every time I call .toDataURL(). My guess is it doesn't recognize EXIF data and don't know how to crop a image with EXIF data.

The file content is being base64 encoded by FileReader.readAsDataURL(). And I insert it into img.src.

The cropping is done by drawing a new image with ctx.drawImage(...) based in the old image and I finally got the new image data with c.toDataURL().

So my question how do I remove EXIF data using javascript?

I read in a file from an HTML file input. For iOS I can take a picture from the camera. The problem is that if you take the picture with the camera the content will include EXIF data(at least if I read the file content with the FileReader API).

I can't use canvas cropping if the image includes EXIF data. Because the image get destroyed every time I call .toDataURL(). My guess is it doesn't recognize EXIF data and don't know how to crop a image with EXIF data.

The file content is being base64 encoded by FileReader.readAsDataURL(). And I insert it into img.src.

The cropping is done by drawing a new image with ctx.drawImage(...) based in the old image and I finally got the new image data with c.toDataURL().

So my question how do I remove EXIF data using javascript?

• javascript
• ios
• image
• exif

Share Improve this question Follow edited Nov 5, 2013 at 15:22 einstein asked Nov 5, 2013 at 14:37 einsteineinstein 13.9k2929 gold badges8686 silver badges110110 bronze badges 3

• 1 Maybe show how you are doing toDataUrl? I don't think canvas would have any issues with what you are doing. – David Nguyen Commented Nov 5, 2013 at 14:42
• @Woho87 I'm assuming the original thing is a File or Blob that doesn't have a URL of it's own, right? Your issue may actually be caused by the importing into the canvas from the base64 url'd image, not exporting from it. Try yourImgSrc = window.URL.createObjectURL(yourFile); instead, then import that into the canvas. – Paul S. Commented Nov 5, 2013 at 16:41
• there should not be any exif in the canvas output... – dandavis Commented Jan 13, 2015 at 2:10

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 5 +25

Note, you wrote:

the image get destroyed

I think that problem is not in EXIF data. I think you have the iOS canvas limitation:

The maximum size for a canvas element is 3 megapixels for devices with less than 256 MB RAM and 5 megapixels for devices with greater or equal than 256 MB RAM.

This limits don't throw any errors, so then you will try to render or read 6MB image you will get a broken blob/dataURL string and so on. And you will think that File API is broken, canvas methods toDataURL/toBlob are broken, and you will be right. But bugs aren't in browser, this is a system limitation.

There known libs that fix iOS limitations:

• Javascript-Load-Image
• ios-imagefile-megapixel

本文标签： iosHow to remove EXIF data from image using javascriptStack Overflow