如何獲取HTTP狀態代碼<img>標籤

我有一個頁面，其中包含許多根據用戶操作生成的服務器端圖像。當圖像加載成功時，我很高興，但是當服務器出現錯誤時，我必須根據發生的錯誤採取行動。如何獲取HTTP狀態代碼<img>標籤

例如：

500代碼：做這個東西。
503代碼：做的東西

等。

所以，我的問題：有沒有辦法在「img」標籤錯誤事件處理程序中獲取狀態碼？

2011-11-13 Artem Pyanykh

爲什麼你會在客戶端處理這些問題？你爲什麼不讓服務器正確處理這些圖像？ – Raynos

@Raynos的情況是這樣的：圖像是在服務器上動態創建的，但是它需要很長時間，這意味着當瀏覽器要求它們時，其中一些將不會準備好。同時，服務器端可能會出現一些嚴重錯誤，並且根本沒有圖像。所以，基於http狀態，我必須再次向服務器請求圖像，或者只是通知用戶錯誤。 –

不，你仍然做錯了。你有一個HTTP服務器，當你得到一個圖像的GET請求時，你可以「等待」它準備好。如果發生嚴重錯誤，您可以返回「嚴重錯誤」圖像。 – Raynos

不，從JavaScript中的img標記發出的請求無法獲取HTTP狀態。

你可以編寫一個firefox插件，chrome/safari擴展來做到這一點。

另一種方法是使用AJAX加載圖像（不使用img標籤）。您可以從Ajax請求獲取HTTP狀態碼。

來源

2011-11-13 00:25:47

插件是不可接受的。 AJAX似乎很好，但我應該通過AJAX獲得什麼樣的數據？我可以檢索圖像數據，但我不能用它來創建img元素。 –

您很可能需要將其作爲數據網址發送。您可能需要找到某種可以在服務器端生成數據URL的庫。然後一旦他們到達它只是將img的src設置爲數據url。這會加載很多開銷來加載圖像。真正的解決方案可能是修復服務器，以便它始終成功發送圖像。 –

Ajax不是一個好的替代品，你的想要加載的圖像被放置在外部域。 2016年關於這個問題的新情況？ – Fusion

-4

你必須在圖像上添加一個事件監聽：

例如使用jQuery：

$('#your_image') 
    .error(function(e) { 
     //add your unhappy code here 

     //unbind if needed 
     $(this).unbind('error'); 
    }) 
    .load(function(e) { 
     //add your happy code here 

     //unbind if needed 
     $(this).unbind('load'); 
    }) 
    ;

來源

2011-11-13 00:27:55 jeremymarc

好的。 eventData對象「e」中是否有狀態碼？ –

請注意，來自[API的'。error（）'：]（http://api.jquery.com/api/error/）「在瀏覽器觸發錯誤事件之前，事件處理程序**必須被**附加**，這就是爲什麼示例在**附加處理程序後設置src屬性**。「（**重點**我的）。 –

+10

只是拋出一些jQuery，肯定會解決問題！ – Raynos

您不能檢查HTTP狀態這種方式。但是，您可以使用naturalWidth屬性檢查圖像是否已加載。

if (img.naturalWidth === 0) { 
    // do sth 
}

希望它有幫助。

來源

2011-11-13 00:53:57

對於閱讀此頁面的任何人，所有瀏覽器都不支持naturalWidth屬性。這個屬性也非常敏感 - 你應該只在圖像加載後嘗試閱讀它。（http://stackoverflow.com/questions/1645166/image-naturalwidth-return-zero）我希望有所幫助。 :) – Axle

@Axle你指的是從'09發佈的帖子。現在它適用於所有最新的瀏覽器版本。 –

我碰巧在某個需要支持舊版瀏覽器的地方工作（例如IE 7和IE 8）。我敢肯定還有其他人會遭受類似的命運。相信我，尖叫着「好吧，他們應該更新他們的破碎工具！」從來沒有任何地方給我：P – Axle

如何獲取HTTP狀態代碼<img>標籤

回答

相關問題