Images being rotated after ImageJob but not wanted
Asked Answered
B

0

7

I'm having an issue with some images being rotated during the processing of ImageJob.

I'm having an issue with detecting the correct rotation of an image uploaded from some (modern) mobile devices.

The images are coming from an iPad mini and a Galaxy S5. I'm taking portrait pictures but they get rotated after upload and resize. If I take a landscape picture the processing works fine.

I have tried using the autorotate plugin but this does not seem to make a difference.

The code is basic and works on some images but not others as mentioned above.

HttpPostedFileBase file = base.Request.Files["photo"];
ImageResizer.ImageJob i = 
    new ImageResizer.ImageJob(file,
                              "~/OrigFiles/" + cvm.Id + ".<ext>",
                              new ImageResizer.Instructions("width=768;height=1024;format=jpg;mode=max;autorotate=true;"));
i.CreateParentDirectory = true;
i.Build();

I emailed the photo from the phone to my laptop and uploaded it and it worked fine which is odd. Could this be a mobile browser upload issue? The problem happens on both iOS Safari and Chrome on new devices. What is odd is that on a older first gen Nexus 7 portrait images work.

Further Notes

Here is the diagnostics:

You are using plugins from the Creative Edition: DiskCache (Performance Edition), WatermarkPlugin (Creative Edition)

Registered plugins:

ImageResizer.Plugins.Basic.DefaultEncoder
ImageResizer.Plugins.Basic.NoCache
ImageResizer.Plugins.Basic.ClientCache
ImageResizer.Plugins.Basic.Diagnostic
ImageResizer.Plugins.Basic.SizeLimiting
ImageResizer.Plugins.MvcRoutingShim.MvcRoutingShimPlugin
ImageResizer.Plugins.DiskCache.DiskCache
ImageResizer.Plugins.Watermark.WatermarkPlugin
ImageResizer.Plugins.Basic.AutoRotate

Configuration:

<resizer>
  <plugins>
    <add name="MvcRoutingShim" />
    <add name="DiskCache" />
    <add name="Watermark" />
    <add name="AutoRotate" />
  </plugins>
  <watermarks>
    <otherimages path="~/watermarks" right="20" bottom="20" width="20" height="20" />
    <group name="portraitBG">
      <image path="~/PORTRAIT.png" imageQuery="" top="0" left="0" />
      <text text="#{name}" vertical="false" align="center" top="818" fontSize="60" color="FFF" />
    </group>
    <group name="landscapeBG">
      <image path="~/LANDSCAPE.png" imageQuery="" top="0" left="0" />
      <text text="#{name}" vertical="false" left="50" top="650" fontSize="60" color="FFF" />
    </group>
  </watermarks>
</resizer>

Sample Image

Here is a sample image: Sample Image

https://github.com/recurser/exif-orientation-examples/blob/master/Portrait_8.jpg

When I download the sample image and upload from my laptop it works, saved as portrait. When I download it and upload from my phone (Samsung S5 Running 4.4.2) it does not work and is saved landscape.

Busk answered 22/1, 2015 at 3:38 Comment(6)
post some code for us to look at!!!Kass
I added the code but it is very basic.Busk
You are passing the autorotate=true; Is that cause this rotation ?Buttercup
I added that hoping that it would solve the problem. I get the same result regardless.Busk
Yeah, I am having the same problem. Setting 'AutoRotate' to true or false will give the same result.Aker
Based on what you're saying, your laptop and phone are uploading different bytes. What client-side upload tool are you using? Some preprocess images.Tanga

© 2022 - 2024 — McMap. All rights reserved.