如何使用 javascript 显示来自 firebase 存储的图像？

Question

我尝试将图像上传到 firebase 存储并从 firebase 存储中检索图像。但是，"retrieve" 案例不起作用：

// image upload
var storageRef = firebase.storage().ref('profilePicturesOfAbmin/original/'+file.name);
storageRef.put(file);
function error(err) {
    console.log("error",err);
} 

// retrieve image from firebase storage
var storageRef = firebase.storage().ref();
var spaceRef = storageRef.child('profilePicturesOfAbmin/original/'+file.name);
storageRef.child('profilePicturesOfAbmin/original/'+file.name).getDownloadURL().then(function(url) {
    console.log("bsbdsbsdbd");
    var test = url;
    alert("hfdghjghj",url);
}).catch(function(error) { });

Answer 1

所以看到你的错误信息，我的想法是待办事项

StorageRef.put(file, function(){
  // Now do the download
})

或者有一个等待文件上传的处理程序

Answer 2

您可能想尝试这样的事情...

var storageRef = firebase.storage().ref(filePath);

function uploadImage(event){
  var file = event.target.files[0];

  return storageRef.put(file).then(function(snapshot) {
    // put the file now do something...
    var fullPath = snapshot.metadata.fullPath;
    console.log(fullPath);
  }).catch(function(error){
    console.log("error uploading "+error);
  });
}

function retrieveImage(imageUri, imgElement){
  if (imageUri.startsWith('gs://')) {
    storageRef.refFromURL(imageUri).getMetadata().then(function(metadata) {
      imgElement.src = metadata.downloadURLs[0];
      console.log("URL is "+metadata.downloadURLs[0]);
    }).catch(function(error){
      console.log("error downloading "+error);
    });
  }
}

一旦文件上传成功，这将使用 Promise 执行操作。

发生错误时它也会记录到控制台。

Answer 3

var storageRef = firebase.storage().ref('profilePicturesOfAbmin/original/')

storageRef.listAll().then(res => {
    //for folders
    res.perfixes.forEach(folder => {
        console.log(folder);
    });
    // for files NAME and URL
    res.items.forEach(item => {
        // console.log( item.name ); 
        item.getDownloadURL().then(function (url) {
            console.log(url);
        });
    });
})

如何使用 javascript 显示来自 firebase 存储的图像？

How to display image from firebase storage using javascript?

javascript

firebase

firebase-storage