javascript - 如何使用 mootools 确定损坏图像的错误代码

Question

我需要一个脚本，它可以根据提供的 HTTP 状态代码确定图像未加载的原因。

我知道图像和对象上的 onError 事件，但它不会传递错误代码。因此，如果图像来源损坏或发生超时，将以相同的方式处理。

我想要的是有一个可以确定错误代码并采取相应行动的脚本。 例如:

• 404 - 用预定义的图像替换图像
• 403 - 使用回调函数通知管理员
• 504 - 尝试重新加载
• 等等

我在谷歌上做了一些搜索，但除了 onError 事件之外，我没有找到任何东西。

有什么想法吗？

Answer 1

我唯一能想到的是在失败时转到 xhr 请求，使用来自更多处理加载的 Asset.image:

new Asset.image('foo.jpg', {
    onload: function() {
        someel.adopt(this);
    },
    onerror: function() {
        new Request({
            url: this.get('src'),
            onComplete: function() {
                console.log(this.status); // 404
            }
        }).get();
    }

});

http://jsfiddle.net/dimitar/2hwej/

不完全是最大的，因为它意味着 2 个请求。要解决这个问题，您可以首先将图像加载到 xhr 请求中，然后使用 base64 数据进行输出或其他操作。