javascript – 从图像错误处理程序读取响应标头

2019年7月21日 151次阅读

我有一个< img />我的页面中的元素,它的src属性定期由
Javascript更改.

当src属性更改时,我在服务器上的代码检查：

>用户是否已登录？
>图像存在吗？

然后它相应地发送响应,图像或带有错误标题的响应(状态403禁止或404未找到).

这是我的问题：我使用以下代码处理img错误

$(function(){
    var $img = $('#test_image');
    $img.on('error',function(e){
        // here, I need to read the headers (at least status code)
        console.log(e);
    }).attr('src','http://example.com/loadimg.php?img=3');
});

如果用户因为会话已过期或者他尝试加载的图像不存在而无法加载图像,则需要显示不同的错误消息.

我在哪里可以从处理程序中找到eventObject中的响应头和/或状态代码？

谢谢.

jsfiddle

最佳答案 如果您的开销不是很大,您可以发送Head请求以查看错误时返回的内容

var http = new XMLHttpRequest();
http.open('HEAD', url, true); // True is for async
http.send();
if (http.status == 404) {
    //
} else if (http.status == 403) {
    //
} else {
    //
}
点赞