Поверните загруженные изображения, содержащие ориентацию EXIF ​​в Parse Cloud Code

Портретные фотографии, взятые с некоторых мобильных устройств, загруженные через HTML-форму, получают неправильную ориентацию, когда они встроены в веб-страницу.

Это связано с метаданными EXIF ​​, который может иметь значение 6 = Rotate 90 CW изображение, которое будет отображаться с определенной ориентацией. Однако само изображение - без метаданных - хранится боком в виде горизонтального изображения. В зависимости от средства визуализации изображения вы либо увидите изображение правильно (в качестве левого миниатюры ниже), либо без примененных метаданных вращения (в виде правого миниатюры). Для изображений, встроенных в веб-сайты, это последний.

Portrait picture with EXIF orientation Rotate 90 CW, displayed with and without metadata applied

Есть ли способ повернуть загруженное изображение вручную, используя Javascript или Node.js, в веб-приложении, поддерживающем Parse Cloud Code? (Только код облака паролей поддерживает несколько зависимостей - но вы все равно можете сами загружать небольшие скрипты).

ОТВЕТЫ

Ответ 1

Я закончил писать класс на стороне клиента для поворота и изменения размера загруженных изображений. Я использую элемент Canvas и HTML5 FileReader.

Для исходного кода и некоторых примеров см. https://github.com/ajgarn/CanvasImageUploader.

Класс предоставляет вам данные изображения (Blob), которые можно отправить в Parse REST API так же, как вы бы загрузили файл через FileReader.

Ответ 2

Вы можете использовать npm модули в облачном коде: Использование модулей npm в облачном коде

Как только вы это сделаете, модуль jpegorientation npm должен соответствовать вашим требованиям:

var jpeg = require('jpegorientation');

jpeg.autoRotate('image.jpg', function (err) {
    // error handler 
});

Если вы не можете заставить модули npm работать, вы всегда можете включить библиотеку вручную. Если у вас возникли проблемы с этой библиотекой и node -gyp, есть и другие модули: