═════════════════════════════════════════
flutter: The following message was thrown resolving an image codec:
flutter: Couldn't download or retrieve file.
模拟器显示空白。
这种场景假设我们要捕获异常,增加 try-catch,如下:
Widget _buildWidget() {
try {
return Image(image: new CachedNetworkImageProvider('test'));
} catch (e) {
print('enter catch exception start');
print(e);
print('enter catch exception end');
return Container();
}
}
依然没法捕获。
但是我们通过其自带的错误回调,如下:
Widget _buildWidget() {
return Image(
image: new CachedNetworkImageProvider(
'test',
errorListener: () {
print('enter errorListener');
}
)
);
}
可以看到控制台进入了 errorListener,打印了对应日志。
虽然 Flutter 自带的错误日志依然输出了,但是通过 errorListener 我们可以获得这种异常情况。
flutter: enter errorListener
flutter: ══╡ EXCEPTION CAUGHT BY IMAGE RESOURCE SERVICE ╞════════════════════════════════════════════════════
flutter: The following message was thrown resolving an image codec:
flutter: Couldn't download or retrieve file.
3.可访问非图片 url,比如 http://mp.weixin.qq.com/mp/homepage?__biz=MzI3OTAyNzAwNg==&hid=5&sn=7e4598d8b00537fe2846f2e85d746b9a&scene=18#wechat_redirect
Widget _buildWidget() {
return Image(
image: new CachedNetworkImageProvider(
'http://mp.weixin.qq.com/mp/homepage?__biz=MzI3OTAyNzAwNg==&hid=5&sn=7e4598d8b00537fe2846f2e85d746b9a&scene=18#wechat_redirect',
errorListener: () {
print('enter errorListener');
}
)
);
}
运行,控制台会报错,并且没法捕获,控制台输出如下:
[VERBOSE-2:codec.cc(97)] Failed decoding image. Data is either invalid, or it is encoded using an unsupported format.
flutter: ══╡ EXCEPTION CAUGHT BY IMAGE RESOURCE SERVICE ╞════════════════════════════════════════════════════
flutter: The following _Exception was thrown resolving an image codec:
flutter: Exception: operation failed
使用 try-catch 也是一样,这里就不赘余了。
图片通用异常捕获处理
通过上面的学习,我们可以发现不管是 Image.network 还是 cached_network_image 没法覆盖全上面两种异常的捕获处理。
不过这两个的共同点就是他们都返回 Image。
所以对于图片的异常捕获可以使用下面通用模板:
// Image image = Image(image: new CachedNetworkImageProvider(''));
Image image = Image.network('');
final ImageStream stream = image.image.resolve(ImageConfiguration.empty);
stream.addListener((_, __) {}, onError: (dynamic exception, StackTrace stackTrace) {
//TODO error callback
});
这里首先是获得 Image,如果获得的是 ImageProvider,只需要把 image.image 换为你的 ImageProvider 即可,当然这个笔者没测试,只是看源码上面模板 image.image 的类型是 ImageProvider。
addListener 有两个回调,其中成功回调是必填的,有两个参数,因为这里不需要用到,因此第一个参数是一个下划线,第二个参数是两个下划线。可能你会说不需要用到,可不可以直接填 null。不行,这边测试了,填 null 当图片加载成功时控制台会抛异常。所以提供一个不需要任何实现的回调即可。
错误回调是可选的,因为我们本篇的主题就是要获取错误回调,所以这里提供了实现。
针对我们上面的 3 个例子,我们看看通用模板是否可以全部捕获。
1.一个图片的 url
Widget _buildWidget() {
Image image = Image.network('https://upload-images.jianshu.io/upload_images/5361063-e413832da0038304.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/800');
final ImageStream stream = image.image.resolve(ImageConfiguration.empty);
stream.addListener((_,__){}, onError: (dynamic exception, StackTrace stackTrace) {
print('enter onError start');
print(exception);
print(stackTrace);
print('enter onError end');
});
return image;
}
图片加载成功。
2.不可访问 url,如随便一个字符串 test
Widget _buildWidget() {
Image image = Image.network('test');
final ImageStream stream = image.image.resolve(ImageConfiguration.empty);
stream.addListener((_,__){}, onError: (dynamic exception