html5 미리보기의 이미지 방향이 잘못되었습니다.

Question

이미지가 수직이 아니며 (예 : 창 브라우저 및 이미지가 수직이 아닙니다.) 일부 서버 (예 : gmail, stackoverflow)에 업로드 할 때 이미지가 올바르지 않다고 가정합니다. 이미지가 똑바로됩니다.

나는이 질문에 내가 html5와 javascript로 미리보기 로직을 ​​쓰고있다는 것을 물었습니다. 내가 말한 이미지는 창 브라우저에서 정확히 무엇을 볼 수 있는지 보여줍니다. 서버가 방향을 조정하는 데 어떤 트릭을했는지 궁금합니다. 경우 (당신이 EXIF ​​데이터를 가져올 수 있습니다 ImageInfo 같은 스크립트를 사용하는 경우

Answer 1

태그로 다시 렌더링되는 canvas 요소를 사용하여 클라이언트 측을 생성하거나 조작하는 이미지에 대해 이야기하고 있다고 생각합니다. 옳은?

서버 쪽에서는 이미지의 EXIF ​​방향 플래그를보고 방향을 결정할 수 있습니다. jQuery fileExif과 같은 라이브러리를 사용하여이 플래그를 클라이언트 측에서 검사 할 수 있습니다. 서버 측에서

Answer 2

: 창에 표시된

이미지 :

이미지를 직접 업로드 스택 오버 플로우하기 이미지가 있음). 그렇지 않다면 실제로 일어난 이유를 알 수 없습니다. 작업하고있는 컴퓨터에 "가짜"라고 표시 될 수 있습니다. 일부 이미지 관리자는 원래 회전 된 이미지의 복제본을 유지할 수 있습니다.

EXIF ​​속성 Orientation은 크기가 오리엔테이션과 비교하여 이미지가 변경되었는지 여부를 알려줍니다.

Answer 3

:
이 당신은 방향을 자동으로 그래픽 마법 같은 이미지를 올바르게 도구를 사용할 수 있습니다 http://www.graphicsmagick.org/GraphicsMagick.html

gm.exe -convert -auto-orient MyImage.jpg MyImageCorrectOrientation.jpg