Flutter 使用受 Basic Auth 保护的网络图像答案

【问题标题】：Flutter use network images protected with Basic AuthFlutter 使用受 Basic Auth 保护的网络图像
【发布时间】：2021-11-16 16:39:35
【问题描述】：

我们有一个主站点，其中包含所有用户上传的内容，这些内容通常只是个人资料图片。

所有上传的文件夹都受 nginx 和 basic auth 保护。所以你需要输入用户名和密码才能访问它。

问题

如何使用 Flutter cached_network_image 做到这一点？或类似的东西。我们不想将图像物理存储在设备上。

【问题讨论】：

Image.network 应该可以正常工作
谢谢你现在就试试
在解析图像编解码器时引发了以下 NetworkImageLoadException：HTTP 请求失败，状态码：404
@user15076841 请停止诋毁您的问题。
请不要通过破坏您的帖子为他人增加工作量。通过在 Stack Exchange (SE) 网络上发帖，您已根据 CC BY-SA license 授予 SE 分发内容的不可撤销权利（即无论您未来的选择如何）。根据 SE 政策，分发非破坏版本。因此，任何破坏行为都将被撤销。请参阅：How does deleting work? …。如果允许删除，则帖子下方左侧有一个“删除”按钮，但仅在浏览器中，而不是移动应用程序中。

标签： flutter dart nginx

【解决方案1】：

您可以使用 CachedNetworkImage 小部件上的 httpHeaders 属性来传递自定义身份验证标头。

CachedNetworkImage(
  imageUrl: ...,
  imageBuilder: ...,
  placeholder: (context, url) => CircularProgressIndicator(),
  errorWidget: (context, url, error) => Icon(Icons.error),
  httpHeaders: {
    "Authorization": "Basic $token",
  }
),

【讨论】：

谢谢，我现在就去试试。
这不起作用，我返回的服务器状态为 404。我在邮递员中做同样的事情，它可以工作。
好的，这样就可以了，服务器端的请求方法是我的错...谢谢！