Detect whether the loading image is taken from cam

问题:

I am using html, tag:

<input type = "file" />

On android and on many cellulars I have the ability to get the file directly by taking a picture and save it.

How can I know (by javascript code) how did I get the picture (direcly by the camera, or by some files that on my cellular)?

I did some workarround, and found exif (http://www.nihilogic.dk/labs/exif/exif.js), but I didn't succeed using it for images loading dynamically, as the site : http://exif-viewer.com/ Need some source code examples, to understand how exif works on dynamically loaded images.

Thanks :)

回答1:

I have found the solution by myself, so I want to participate it:

What I needed is translate the binary data to exif data, so on exif.js, I added the following.

jQuery.fn.getExif = function() {
    var exif;
    var bin;
    var bf;
    bin = atob(this.attr("src").split(',')[1]);
    if (bin) {
        bf = new BinaryFile(bin);
    }
    if (bf) {
        exif = EXIF.readFromBinaryFile(bf);
    }
    if (exif) {
        this.attr("exifdata", exif);
    }
    return exif;
}

and use the above on code - just get any exif value I want.

The main issue is that the image should be rotated according to exif (if, i.e. the orientation is 90 degrees clockwise, so I should rotate 90 counterclockwise, in order to fix the orientation) - No problem on most devices, but there is a problem that persists on several devices, such as IPAD.

IPAD (or Safari - I don't know exactly where might be the problem) do me a favour, and auto rotate the image, when I am loading it from file, so it is displayed always correctly.

Now how can I know when to rotate the image and when not rotating it.

Thanks :)