本篇文章更新時間:2021/12/02
如有資訊過時或語誤之處,歡迎使用 Contact 功能通知。
一介資男的 LINE 社群開站囉!歡迎入群聊聊~
如果本站內容對你有幫助,歡迎使用 BFX Pay 加密貨幣 或 新台幣 贊助支持。
印象中筆記過這個方式,後來查了筆記發現是 2018 年實作 WordCamp 活動網站時,因為要現場讓與會用到網站直接手機拍照上傳時會碰到「轉正」的問題。
這是一個滿有趣的問題!對人來說影像有方向性,但對電腦來說沒有,不過因為看影像的是人,所以這參數會被記錄在影像的 EXIF meta 裏,讓讀取裝置判斷該如何呈現給人看才是正確的。
這種「前端」能一起處理的基本上我是覺得要前端處理比較好,畢竟上傳照片之前,還有一些前處理的可能(調色、縮放、裁切...),都處理好後才上傳到後端儲存。
JS Client-Side Exif Orientation: Rotate and Mirror JPEG Images 這篇前端來處理轉正討論中提到的 JavaScript-Load-Image 專案滿不錯的!
但是,如果已經造成了羅馬,只能靠後端來修正羅馬的時候,本篇筆記又來救羅馬了XD
參考這篇討論 PHP read_exif_data and Adjust Orientation,的 GD 解法:
function image_fix_orientation(&$image, $filename) {
$exif = exif_read_data($filename);
if (!empty($exif['Orientation'])) {
switch ($exif['Orientation']) {
case 3:
$image = imagerotate($image, 180, 0);
break;
case 6:
$image = imagerotate($image, 90, 0);
break;
case 8:
$image = imagerotate($image, -90, 0);
break;
}
}
}
function apply_new_orientation($path_to_jpg) {
if (exif_imagetype($path_to_jpg) == IMAGETYPE_JPEG) {
$im = @imagecreatefromjpeg($path_to_jpg);
image_fix_orientation($im, $path_to_jpg);
if ($im) {
imagejpeg($im, $path_to_jpg);
imagedestroy($im);
}
}
}
將 apply_new_orientation
方法帶入上傳好的 JPG 檔案絕對路徑,就可以開始進行處理。
由於有使用到
exif_imagetype
這方法,會需要 PHP exif 的 extension,要提前先把這模組裝上才不會出錯!