我必须从 Firebase 下载图像才能显示它吗？

Posted 2023-02-23

【中文标题】我必须从 Firebase 下载图像才能显示它吗？

【英文标题】：Must I download image from Firebase to display it?

【发布时间】：2019-01-04 06:33:26

【问题描述】：

我正在使用 Flutter 和 Firebase。我已经设法使用这样的方案将用户个人资料照片上传到 Firebase 存储：

用户/userid.png

到目前为止，每当我需要显示用户个人资料图像时，我都必须先将其下载到本地；喜欢

final String fileName = uid + ".png";

Directory appDocDir = await getTemporaryDirectory();

String appDocPath = appDocDir.path;
final File file = File('$appDocPath/$fileName');
// clears the file
file.writeAsStringSync("");
final StorageReference ref = FirebaseStorage.instance.ref().child('users/' + fileName);

final StorageFileDownloadTask downloadTask = ref.writeToFile(file);

final int byteNumber = (await downloadTask.future).totalByteCount;

print("byteNumber : $byteNumber");
     catch(e) 
      return null;
    

但是，我想知道我是否可以跳过这一步而只使用 NetworkImage() 函数，例如：

final StorageReference ref = FirebaseStorage.instance.ref().child('users/' + user.uid + ".png");
String downloadURL = await ref.getDownloadURL();

downloadURL = Uri.decodeFull(downloadURL.toString());
print("FB Storage URL: $downloadURL");


return new NetworkImage(downloadURL);

它不起作用并引发异常。

我想要做什么；有可能吗？

【问题讨论】：

请添加例外。

【参考方案1】：

您要显示的图像的数据始终必须读入您要在其中显示它的应用程序。但您不必像现在这样自己处理下载。

Firebase 存储中的任何文件都有一个所谓的下载 URL。拥有此 URL 的任何人都可以读取该文件，而无需使用 Firebase Storage SDK。互联网上的大多数图片都是这样的，所以有很多库可以处理这样的图片 URL。

例如，Flutter cookbook has a section on displaying images from the internet，它表明Image 小部件可以显示来自如下 URL 的图像：

Image.network(
  'https://raw.githubusercontent.com/flutter/website/master/_includes/code/layout/lakes/images/lake.jpg',
)

如果这使用来自 Github 的图像，您还可以使用来自 Firebase 存储的下载 URL。

大多数应用在上传文件时会将文件的下载 URL 存储在其数据库中。如果您没有下载 URL，而只有路径，则可以通过以下方式获取下载 URL：

final StorageReference ref = FirebaseStorage.instance.ref().child('users/' + fileName);
final Uri downloadUrl = await ref.getDownloadUrl();

我不是 Flutter 专家，所以该代码 sn-p 中可能存在一些问题。

【参考方案2】：

好的，我发现我遇到了错误。 我正在将 URI 转换为字符串并在 NetworkImage 中使用它。 当我从 URI 中删除 .ToString() 时，它可以工作。