Как применить ориентацию EXIF

Я заметил, что не каждый браузер применяет ориентацию EXIF.

Chrome на моем мобильном устройстве не применяет ориентацию EXIF, но мобильный Safari делает это.

Итак, поскольку это не стандартно, как я могу применить ориентацию EXIF ​​без повторного применения в Safari?

Также мне было интересно, можно ли применить ориентацию на стороне клиента, поэтому мне не нужно делать это после на стороне сервера (не только поворот изображения в 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);

    }
}
}

person Marc    schedule 29.01.2015    source источник
comment
Возможно, этот вопрос может оказаться полезным. Изменить: этот хорош также.   -  person MTCoster    schedule 29.01.2015
comment
Я не уверен, что понимаю ответ. У меня уже есть ориентация EXIF, но как я могу отредактировать изображение, чтобы применить ориентацию   -  person Marc    schedule 29.01.2015
comment
Вы можете использовать свойство css rotation и применять его условно с помощью javascript.   -  person MTCoster    schedule 29.01.2015
comment
Я уже сделал это, но поскольку сафари учитывает ориентацию EXIF, это будет двойная ориентация.   -  person Marc    schedule 29.01.2015


Ответы (1)


Чтобы изображение отображалось правильно независимо от браузера и ориентации exif, вам нужен javascript, который выполняет поворот и помещает изображение на холст. Это защищает его от «двойного вращения», когда вращение изначально поддерживается, например. сафари.

Я решил эту проблему, используя проект JavaScript-Load-Image из github, что делает его очень просто; см. мой ответ здесь: JS Client- Боковая ориентация Exif: поворот и зеркальное отображение изображений JPEG

person flexponsive    schedule 18.02.2015
comment
Хорошая идея! Мне удалось сделать это путем жесткого кодирования, когда пользователь находится в сафари, ведь это нехорошо... - person Marc; 19.02.2015