jQuery: 获取图片加载错误的详细信息

Question

我有一个 javascript 调用服务器端脚本 (PHP) 来提供请求的图像。为 user 和 image key 传递了参数。

如果请求的图像不存在，我将返回 404 错误。如果图像存在但用户无权访问它，我将返回 403 错误。

这是一个简化的代码示例...

$img.error(function () {
        alert("Image not known or access denied.");
    })
    .attr("src", "getimg.php?key=horse&user=fred");

我想根据问题是出在图像密钥上还是用户没有访问权限来给出不同的消息。

有什么方法可以访问返回的 HTTP 错误代码或响应中返回的文本？

Answer 1

当您将 url 直接放入 src 属性中的 PHP 脚本时，您的 javascript 将不会意识到获取图像时的任何错误。解决此问题的一种方法是触发对图像的 AJAX 请求：

$.ajax( "getimg.php?key=horse&user=fred" )
 .fail(function(jqXHR) {
    // do something here when the image wasn't loaded
    if(jqXHR.status === 403) {
       // access denied
    } else if(jqXHR.status === 404) {
      // not found
    }
  });

jqXHR 对象包含抛出的状态代码、服务器的响应等信息。更多信息here。

请注意，我这里只使用了.fail()回调函数，当图片加载成功时什么都不做。在图像中 AJAX 没有什么意义，您仍然可以将 src 设置到右侧 url 并且当可以加载图像时它会处理所有事情。我们在这里使用 AJAX 的唯一原因是以防出现问题。

jQuery: 获取图片加载错误的详细信息

jQuery: Get detail of image loading error

javascript

jquery

image

http