Image "auto_rotate"-filter is not rotating my images correctly

[ahulkkonen]

Hello,

I have an issue with my website running Symfony 3.4 and using LIIP Imagine Bundle 2.2.0. Images shot on some mobile devices are not being rotated correctly, even though auto_rotate filter is on.

Example image:
https://drive.google.com/open?id=1GuqPsZICYQ_OKk6BMAPIODud_GyCuUBt

Exif data

Camera Model Name:
iPhone X

Orientation:
Rotate 90 CW

Preconditions

1. Symfony v3.4
2. Liip Imagine Bundle v2.2.0
3. PHP v7.1.30 (with exif extension enabled)
4. Driver: imagick (ImageMagick v6.8.9-9)
5. Ubuntu 16.04

Imagine filter_sets config:

filter_sets:
        workingbase:
            format: jpg
            quality: 90
            filters:
                auto_rotate: ~
                strip: ~
                maxsize: { maxWidth: 1280, maxHeight: 1280 }

Steps to reproduce

1. Download attached image
2. Run the attached image trough Imagine with auto_rotate filter on

Expected result

The image should be rotated from exif data "Rotate 90 CW"

Actual result

The image is not rotated correctly

[franmomu]

Hi @kaahulkkonen, I guess it's something to do with the server/configuration. Can you try https://github.com/franmomu/liip-imagine-bundle-examples? I've used your image and it works to me.

[ahulkkonen]

Hey @franmomu ! I can't get liip-imagine-bundle-examples to work locally, but if its a problem with my server or configuration, how would I go about debugging it?

It seems the strip filter for example is working correctly, so the filters are being applied. For debug I also tried to grayscale the image, which had the correct effect on the image.

Thanks

[franmomu]

You could check if exif_read_data is enabled, reading old issues about this, some of them are related to not having exif extension enabled.

[michellesanver]

Some information from debugging on slack, where we can clearly see orientation is 6 which translates to 90 in Imagine as far as I can see.

Me: “Can you try exif_read_data on the image? (Where you try it doesn’t matter as long as it’s on the server)”

Aleksi output:

me@server:~$ php test.php
test.jpg
FILE.FileName: test.jpg
FILE.FileDateTime: 1575289462
FILE.FileSize: 2544554
FILE.FileType: 2
FILE.MimeType: image/jpeg
FILE.SectionsFound: ANY_TAG, IFD0, THUMBNAIL, EXIF
COMPUTED.html: width="4032" height="3024"
COMPUTED.Height: 3024
COMPUTED.Width: 4032
COMPUTED.IsColor: 1
COMPUTED.ByteOrderMotorola: 1
COMPUTED.ApertureFNumber: f/1.8
COMPUTED.Thumbnail.FileType: 2
COMPUTED.Thumbnail.MimeType: image/jpeg
IFD0.Make: Apple
IFD0.Model: iPhone X
IFD0.Orientation: 6
IFD0.XResolution: 72/1
IFD0.YResolution: 72/1
IFD0.ResolutionUnit: 2
IFD0.Software: 13.1.2
IFD0.DateTime: 2019:11:04 12:52:19
IFD0.YCbCrPositioning: 1
IFD0.Exif_IFD_Pointer: 194
THUMBNAIL.Compression: 6
THUMBNAIL.XResolution: 72/1
THUMBNAIL.YResolution: 72/1
THUMBNAIL.ResolutionUnit: 2
THUMBNAIL.JPEGInterchangeFormat: 2086
THUMBNAIL.JPEGInterchangeFormatLength: 7703
EXIF.ExposureTime: 1/15
EXIF.FNumber: 9/5
EXIF.ExposureProgram: 2
EXIF.ISOSpeedRatings: 50
EXIF.ExifVersion: 0231
EXIF.DateTimeOriginal: 2019:11:04 12:52:19
EXIF.DateTimeDigitized: 2019:11:04 12:52:19
EXIF.UndefinedTag:0x9010: +02:00
EXIF.UndefinedTag:0x9011: +02:00
EXIF.UndefinedTag:0x9012: +02:00
EXIF.ComponentsConfiguration: 
EXIF.ShutterSpeedValue: 47539/12167
EXIF.ApertureValue: 54823/32325
EXIF.BrightnessValue: 36700/17661
EXIF.ExposureBiasValue: 0/1
EXIF.MeteringMode: 5
EXIF.Flash: 16
EXIF.FocalLength: 4/1
PHP Notice:  Array to string conversion in /home/*/test.php on line 7
EXIF.SubjectLocation: Array
EXIF.MakerNote: Apple iOS
EXIF.SubSecTimeOriginal: 520
EXIF.SubSecTimeDigitized: 520
EXIF.FlashPixVersion: 0100
EXIF.ColorSpace: 65535
EXIF.ExifImageWidth: 4032
EXIF.ExifImageLength: 3024
EXIF.SensingMethod: 2
EXIF.SceneType: 
EXIF.ExposureMode: 0
EXIF.WhiteBalance: 0
EXIF.FocalLengthIn35mmFilm: 28
EXIF.SceneCaptureType: 0
PHP Notice:  Array to string conversion in /home/*/test.php on line 7
EXIF.UndefinedTag:0xA432: Array
EXIF.UndefinedTag:0xA433: Apple
EXIF.UndefinedTag:0xA434: iPhone X back dual camera 4mm f/1.8

Aleksi sent me his config in DM I will see if I can reproduce it in your demo app using that config. Thanks @franmomu for also helping to debug this. 💚

(Edited for formatting the output)

[ahulkkonen]

We spent a good while debugging the problem and found no problem in the server configuration, Imagine or the LIIP Imagine bundle.

In our implementation applyFilter is called manually after image upload. The implementation was written for a very early version of this bundle and I was tasked on updating to more a recent version. The earlier implementation sent back a instance of Symfony\Component\HttpFoundation\Response including instance of ImageInterface and so the following was done:

$mime = $this->mimeTypeGuesser->guess($data); // Guess MIME type for response
$binary = $this->filterManager->applyFilter(new Binary($data, $mime), $filter)->getContent(); // Apply filters and return binary data
$image = $this->imagine->load($binary); // Load binary as ImageInterface
return new Response($image, 200, array('Content-Type' => 'image/' . $mime)); // return ImageInterface

However, this was fixed when we just run the filters and return Liip\ImagineBundle\Model\Binary without the extra load()step, simply like so:

$mime = $this->mimeTypeGuesser->guess($data);
$binary = $this->filterManager->applyFilter(new Binary($data, $mime), $filter);
return $binary;

And use the Binary type instead of ImageInterface elsewhere in the application.

That seemed to do the trick. Thanks for all the help 👍