Flutter中CachedNetworkImage无法缓存图片问题求助

核心问题定位 #

你的代码里给CachedNetworkImage设置了key: UniqueKey()，这会导致列表滚动时，每一次Widget重建都会生成全新的唯一key，CachedNetworkImage会将其识别为新的组件实例，从而忽略已有的缓存，重新下载图片。另外还要排查URL拼接和服务器缓存配置的问题。

具体解决步骤 #

• 移除UniqueKey：删除CachedNetworkImage中的key: UniqueKey()配置，CachedNetworkImage会自动根据imageUrl作为缓存标识，无需手动设置唯一key。修改后的代码片段：

ClipRRect(
  borderRadius: BorderRadius.circular(10),
  child: CachedNetworkImage(
    // 移除key: UniqueKey()
    imageUrl: post.images.isNotEmpty ? '${API.hostConnectImagesPath}${post.images[0]}' : '',
    height: 100,
    width: 100,
    fit: BoxFit.cover,
    placeholder: (context, url) => Container(),
    errorWidget: (context, url, error) => Container(),
  ),
)

• 验证URL拼接的一致性：检查API.hostConnectImagesPath和post.images[0]拼接后的URL是否完全一致，比如避免出现https://example.com//images/xxx.jpg这类重复斜杠的情况，确保每次请求同一张图片的URL完全相同，这样缓存才能正常命中。

• 检查服务器缓存响应头：确认图片所在服务器返回的HTTP响应中包含正确的缓存控制头，比如Cache-Control: public, max-age=86400（表示缓存1天）、ETag或Last-Modified。如果服务器没有设置这些头，CachedNetworkImage无法判断是否需要缓存，会每次重新请求；而你测试的硬链接服务器应该已经配置了正确的缓存头，所以缓存正常。

内容的提问来源于stack exchange，提问作者Миша Тирский