使用 EaselJS 位图时捕获错误的 URL答案

【问题标题】：Catch bad URLs when using EaselJS bitmap使用 EaselJS 位图时捕获错误的 URL
【发布时间】：2015-06-04 04:19:30
【问题描述】：

在尝试将 URL 加载到 createjs.Bitmap 之前，有没有办法检查 URL 是否指向有效图像？我一直在尝试捕捉错误 URL（在 Firefox 中）的错误，但由于某种原因不起作用。

    try {

        image = new createjs.Bitmap ( "image" );

    } catch ( err ) {

        console.log ( "oops" );
        return null;

    }

当我在 Firefox 中运行此代码时，错误仍会显示在控制台中，而记录的消息不会。那么，我的问题是，有没有办法预先验证 URL？

【问题讨论】：

标签： javascript error-handling easeljs

【解决方案1】：

如果图像是错误的、未定义的、null 等 - 它会不 throw 一个错误，所以 try/catch 什么都不做。

如果您使用PreloadJS（CreateJS 套件的一部分）加载图像，您可以监听error 事件，如果任何图像加载失败（或超时），队列将抛出该事件。

var queue = new createjs.LoadQueue();
queue.on("error", handleError);
queue.loadFile("404image.png");

目前没有仅使用原始Bitmap 实例来确定是否发生错误的内置方法。通过字符串路径传递给 Bitmap 的图像不会预加载，而只是使用 Image 实例在内部请求。

【讨论】：

嗯，好吧。这似乎应该工作。谢谢。

【解决方案2】：

您可以只使用普通 JS 来检测图像是否可以加载，如果可以，则将该实例传递给 EaselJS Bitmap：

var img = new Image();
img.onload = function() {
    console.log('img loaded');
    var bitmap = new createjs.Bitmap(img);
}
img.onerror = function() {
    console.log('error');
} 
img.src = 'notexistingimage.png';

【讨论】：

我试着做了一点，但我仍然遇到了一些错误问题。
什么样的问题？您能否提供更多信息。
好的，我想通了。我正在使用您在此处提供的代码，但后来我偶然在 onload 部分之外调用了 stage.addChild() 。所以，那没有用。此外，显然在制作位图时，在代码调用 addChild 方法之前，它不会在错误的 URL 上引发问题。