img標記中的圖像旋轉不正確

的問題是，當我使用img標籤

<img src="http://www.example.com/image.jpg" alt="">

展示一些圖片，我得到錯誤的方向轉動，有時圖像是倒過來，有時是旋轉45度。

如果我通過訪問

http://www.example.com/image.jpg

直接在瀏覽器中加載的圖像的圖像顯示權。

什麼似乎是問題，我該如何解決這個問題？

來源

2014-11-02 Alex

檢查你的css是否有任何旋轉應用在圖像上。 – Shubanker 2014-11-02 08:02:42

@Subhanker CSS旋轉不影響PHP上傳 – 2014-11-02 08:03:50

我讀到這可能是一個Exif方向的問題......但我該如何解決這個問題？ – Alex 2014-11-02 08:05:57

我發現了這個問題。無法正確顯示的圖像會從Samsung和iPhone等移動設備上傳。所以EXIF的方向就是手機的方向。

要查看圖像的確切exif，您可以在這裏測試http://regex.info/exif.cgi。即使您在Chrome或Firefox等瀏覽器中直接打開圖片，也會看到正確方向的圖片，但如果使用html img標籤加載圖片，則會顯示exif方向。

所以最好的解決方案是在上傳圖片之前檢查exif方向，然後使用php函數將其轉換爲正確的方向。

function image_fix_orientation($path) 
{ 
    $image = imagecreatefromjpeg($path); 
    $exif = exif_read_data($path); 

    if (empty($exif['Orientation'])) 
    { 
     return false; 
    } 

    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; 
    } 

    imagejpeg($image, $path); 

    return true; 
} 

// For JPEG image only 
image_fix_orientation('/path/to/image.jpg');

來源

2014-11-02 10:14:22 Alex

img標記中的圖像旋轉不正確

回答

相關問題