Firebase存储-将图像上传到Firebase存储并在实时数据库中创建指向该数据库的链接

mar*_*bob 2 firebase firebase-realtime-database firebase-storage

我在将图像上传到Firebase存储时遇到问题。我需要在HTML中使用带有文件类型的输入对象。然后,我需要为该输入选择的图像上载到我的项目的Firebase存储中。还有没有一种方法可以将该图像的位置存储在实时数据库中,以便以后可以访问?我该怎么做?

先感谢您

Pet*_*dad 5

链接到数据库,请尝试以下操作:

var ref= firebase.database().ref("Uploads");
var storage = firebase.storage();
var pathReference = storage.ref('images/stars.jpg');
pathReference.getDownloadURL().then(function(url) {
ref.push().set({
imgurl: url
});
Run Code Online (Sandbox Code Playgroud)

更多信息在这里:

https://firebase.google.com/docs/storage/web/download-files

https://firebase.google.com/docs/storage/web/upload-files

将其添加到存储中之后,您将能够url使用getDownloadUrl()它,然后将其添加到数据库中:

Uploads
  pushid
     imgurl: url
Run Code Online (Sandbox Code Playgroud)


Cod*_*Spy 5

检查使用Firestore(存储)保存图像文件并使用Cloud Storage(数据库)保存图像路径、名称和文件大小的示例应用程序。

在此输入图像描述

上传图片

// The main task
this.task = this.storage.upload(path, file, { customMetadata });
Run Code Online (Sandbox Code Playgroud)

保存图像信息

  addImagetoDB(image: MyData) {
    //Create an ID for document
    const id = this.database.createId();

    //Set document id with value in database
    this.imageCollection.doc(id).set(image).then(resp => {
      console.log(resp);
    }).catch(error => {
     console.log("error " + error);
    });
  }
Run Code Online (Sandbox Code Playgroud)

源码教程链接