浏览器如何判断一个img的onerror事件答案

【问题标题】：How does the browser determine an onerror event for an img浏览器如何判断一个img的onerror事件
【发布时间】：2015-04-29 07:57:51
【问题描述】：

我正在开发一个应用程序，它将向客户端提供一些图像，有时图像可能是空白的，我们使用 spring mvc 作为控制器，这是核心代码：

@RequestMapping
public ResponseEntity<byte[]> getImg(String id) {
    byte[] res = imgService.find(id); // this res  may be null
    headers.setDate("Expires", System.currentTimeMillis() + 24 * 3600 * 1000 * 7);
    return ResponseEntity.ok().headers(headers).contentType(MediaType.IMAGE_PNG).body(res);
}

如图所示，无论图片是否存在，响应码始终为200。

在客户端加载图片后，我会为图片添加onerror事件，但是我发现一旦服务器找不到图片就会触发onerror事件（这意味着body 可能为 null)，即使状态码为 200。

然后我尝试在所需图像丢失后返回固定图像，并且没有触发onerro事件。

所以不知道浏览器是怎么认为某个img加载错误的，好像不是根据状态码。

有关于这方面的文件吗？

【问题讨论】：

你确定 byte[] res = imgService.find(id); res 返回您的图像，或者仅在您的评论中它将为空。因此，在您的问题“图像（这意味着主体可能为空）中，即使状态代码为 200。”所以这意味着你应该检查如果数据为空你应该添加onerror，200状态意味着http协议没有发生错误。

标签： javascript html spring-mvc

【解决方案1】：

在 Img 标签上添加事件监听器并调用您的自定义逻辑。

示例代码：

<img id="photo"
     onload='loaded(this.id)'
     src=""
     alt="alt text"
     />

关于如何检测图像加载错误的帖子。 Post 1，使用纯 Javascript 和 this 进行检测。

【讨论】：