Question

我注意到并非每个浏览器都应用EXIF方向。

我的手机上的Chrome不会应用EXIF方向，但Safari移动版会这样做。

因为它不是标准的，如何在不在Safari上应用两次的情况下应用EXIF方向？

此外，我想知道是否可以在客户端应用方向，所以我不必在服务器端（不仅是javascript中的图像旋转）之后执行此操作。

function handleFileSelect(evt) {

var previewContainer = evt.data.previewContrainer;

evt.stopPropagation();
evt.preventDefault();

var files;
if (evt.target.files) {
    files = evt.target.files // FileList object
}
else if (evt.originalEvent.dataTransfer.files) {
    files = evt.originalEvent.dataTransfer.files
}

//if there's a file
if (files) {

    // Loop through the FileList and render image files as thumbnails.
    for (var i = 0, f; f = files[i]; i++) {
        var orientation = 0;

        // Only process image files.
        if (!f.type.match('image.*')) {
            continue;
        }

        //EXIF.getData(f, function () {
        //    orientation = EXIF.getTag(this, "Orientation");
        //    alert(orientation);
        //    alert(EXIF.pretty(this));
        //});

        createReader(f, previewContainer);

    }
}
}

Answer 1

为了确保无论浏览器和exif方向如何，图像都能正确显示，您需要使用javascript进行旋转并将图像放在画布上。这可以保护它不受双重旋转的影响。在本地支持旋转的地方，例如狩猎。

我使用github的JavaScript-Load-Image项目解决了这个问题，这很容易;在这里看到我的答案：JS Client-Side Exif Orientation: Rotate and Mirror JPEG Images

如何申请EXIF方向

1 个答案: