带有404图像响应的<img> onerror

Question

我正在从服务器加载图像,当存在404时返回图像.也就是说,如果我加载的图像不存在,服务器将返回404响应,其中200x200 PNG后备图像显示"照片不是可用"就可以了.

我想检测这种情况发生在客户端的时间.我尝试了这个onerror属性:

<img src="http://example.com/photo.jpg" onerror="console.log(this)" />

此代码仅在服务器的404响应完全没有图像时有效.由于我的404响应,onerror事件永远不会被触发.

有没有解决这个问题的方法,没有用JavaScript预加载图像？

Answer 1

我采取的解决方法是通过 ajax 调用一个内部方法，该方法使用 httpclient 检查图像是否返回 404 预制页面。如果是这样（任何状态 404），则返回我自己的匿名图像，如果不是，则返回字符串本身。