如何从离子3中的firebase-storage获取图像

时间:2018-03-16 14:34:04

标签: angular ionic3 firebase-storage

这是我的存储(在firebase中手动设置),其中包含瓶子照片。

https://i.stack.imgur.com/56Dta.png

这是我的数据库(具有多个属性的瓶子)但没有他的照片

https://i.stack.imgur.com/j1eBS.png

我的问题是,

如何通过存储获取我的瓶子照片(firebase-storage doc没有帮助我)? 我能正确进行吗?

感谢您的阅读!

1 个答案:

答案 0 :(得分:1)

首先需要创建云存储参考。有多种方式:

使用初始文件路径和名称

var storage = firebase.storage();
var pathReference = storage.ref('images/stars.jpg');

或来自Google云端存储URI

var gsReference = storage.refFromURL('gs://bucket/images/stars.jpg')

或来自HTTPS网址

var httpsReference = storage.refFromURL('https://firebasestorage.googleapis.com/b/bucket/o/images%20stars.jpg');

获得参考后,您可以通过调用存储参考上的getDownloadURL()方法获取文件的下载URL。

storageRef.child('images/stars.jpg').getDownloadURL().then(function(url) {
  // `url` is the download URL for 'images/stars.jpg'

  // This can be downloaded directly:
  var xhr = new XMLHttpRequest();
  xhr.responseType = 'blob';
  xhr.onload = function(event) {
    var blob = xhr.response;
  };
  xhr.open('GET', url);
  xhr.send();

  // Or inserted into an <img> element:
  var img = document.getElementById('myimg');
  img.src = url;
}).catch(function(error) {
  // Handle any errors
});

更多详情here