React Native:从Firebase Storage下载映像

React-Native: Download Image from Firebase Storage

本文关键字：Storage 下载 映像 Firebase Native React      更新时间：2023-09-26

预信息：

我仍然打开了一个Firebase项目，并且我仍然成功地使用Firebase数据库(因此firebase.initializeApp(config)工作(。我在Firebase Storage的文件夹">/Images/"中上传了几个图像，并将它们命名为image1.jpg、images2.jpg..

React Native：0.31.0，Firebase:3.3.0

我想要什么：

我想从Firebase存储中获取图像，并将其放入<Image>

我实际做了什么：

var storageRef = firebase.storage().ref('Images/image1.jpg');
//1. Try:
storageRef.getDownloadURL().then(function(url) {
  console.log(url);
)}
//2. Try:
var sampleImage = storageRef.getDownloadURL().then(function(url) {
  console.log(url);
)}
//3. Try:
var sampleImage = storageRef.getDownloadURL();

有关代码的信息：

  1. 代码未到达console.log(url)点

    2.1.尝试将sampleImage用作<Image>对象中的source：空图像

    2.2.尝试log sampleImage:undefined

    2.3.尝试log时，url:未达到此点

    3.1.尝试将sampleImage用作<Image>对象中的source：空图像

    3.2.尝试log sampleImage:{ F: 0, ka: undefined, o: { F: 0, ... } }

所有尝试在2-3分钟后返回相同的错误代码。

Firebase存储：超过了操作的最大重试时间，请尝试再一次

事先非常感谢你的帮助。

根据文档，您的第一个似乎是正确的。我相信你会收到一个错误，所以也要连接一个错误回调：

storageRef.getDownloadURL().then(function(url) {
    console.log(url);
}, function(error){
    console.log(error);
});

请参阅：https://firebase.google.com/docs/reference/js/firebase.storage.Reference#getDownloadURL

更新

我向Firebase支持部门报告了这个问题，并得到了以下回复：

我们的工程师回来了，这似乎是一个安卓系统特定的问题(适用于iOS([..]我们目前正在处理这个问题，但关于时间线，我们目前无法分享

研究

这似乎是react native的XMLHttpRequest出现问题导致的实际错误。当以您描述的相同方式尝试getDownloadURL((时，会发生相同的事情(即达到最大重试时间(。

然而，当重写react native的polyfill的XMLHttpRequest时，如本堆栈溢出所述，线程getDownloadURL((将正常完成并返回一个有效的URL。

我们使用的是react native v0.33.0，Firebase v3.4.1

解决方案

在此期间，我们一直在使用这种变通方法；绕过Firebase API：

var bucket = firebase.storage().ref().bucket;
var firebaseUrl = "https://firebasestorage.googleapis.com/v0/b/" + bucket + "/o/";
var finalUrl = firebaseUrl + 'path%2Fto%2Fresource';
firebase.auth().currentUser.getToken()
.then((token) => {
  fetch(finalUrl, {headers: {'Authorization' : 'Firebase ' + token}})
  .then((response) => response.json())
  .then((responseJson) => {
    var downloadURL = finalUrl + "?alt=media&token=" + responseJson.downloadTokens})
  })
});

这个问题似乎影响了一小部分用户，因为我在这里只看到了其他方面提出的问题。然而，这似乎是一个实际的错误，当它发生时会非常令人衰弱，所以如果有更多的输入，我们将不胜感激。

从存储中获取所有图像

firebase.storage().ref().child('filename').list().then(result => {
    // Loop over each item
    result.items.forEach(pics => {
        firebase.storage().ref().child(pics.fullPath).getDownloadURL().then((url) => {
            console.log(url);
            //these url will be used to display images
         })
     });
})
相关文章：