Flutter NetworkImage 处理 403 错误

Question

在我的Flutter移动应用程序中，通过NetworkImage()加载用户的个人资料图像时，我收到403状态代码作为响应。

在出现403状态代码或图像 URL 损坏等情况下，如何通过显示资产文件夹中的图像来处理此问题。

目前我已经通过向图像 URL 发送HTTP GET请求并检查状态代码是否为 200来处理它。 如果是 200，我使用NetworkImage() ，否则我使用AssetImage()加载图像并使用FutureBuilder()构建小部件。

虽然这很有效，但我觉得处理这么小的场景很麻烦，而且可以以我不知道的更好的方式完成。

处理这种情况的最佳方法是什么？

Answer 1

您在这种情况下做得很简单，我没有发现任何问题：

  if (response.statusCode == 200) {
    return NetworkImage();
  } else {
    return AssetImage();
  }

Answer 2

我通过使用precacheImage实现了这一点。 这会将您的图像预缓存到颤振缓存中。 它还有一个onError函数，你可以在缓存图像时处理错误。

String validatedUrl;

precacheImage(
  NetworkImage(urlToCheck),
  context,
  onError: (
    exception,
    stacktrace,
  ) {
    print(exception.toString());
    setState(() {
      validatedUrl = '';
    });
  },
).whenComplete(() {
  if (validatedUrl == null) {
    setState(() {
      validatedUrl = urlToCheck;
    });
  }
});

然后validatedUrl要么为null，要么为空，要么带有经过验证的url。

• null -> 尚未验证
• empty -> 下载图像时出错
• url -> 成功下载图片

Answer 3

请尝试以下方法。 在这里，如果图像可用，它将加载网络图像，否则它将重定向到错误回调。 在错误回调中，您可以返回所需的小部件。 在您的情况下，您想从资产加载，以便您可以像下面这样使用它。 如果要检查错误状态代码，则需要解析我打印的异常。

 Image.network('https://www.outbrain.com/techblog/wp-content/uploads/2017/05/road-sign-361513_960_720.jpg',
            errorBuilder: (BuildContext context, Object exception, StackTrace? stackTrace) {
            print("Exception >> ${exception.toString()}");           
              return Image.asset('assets/images/lake.jpg');
            },
          )