如何将 Firebase 存储图像 url 保存到 firebase 数据库？答案

【问题标题】：How to save Firebase Storage image url to firebase database?如何将 Firebase 存储图像 url 保存到 firebase 数据库？
【发布时间】：2020-12-18 08:52:40
【问题描述】：

如何在 Firebase 数据库中保存上传到 Firebase 存储的图片的 url？

当下面的代码运行我得到这个错误：

HTML：

<div>
   <img id="profile-picture">
</div>

JS：

firebase.auth().onAuthStateChanged(function(user) {

var uid = firebase.auth().currentUser.uid

var fileButton = document.getElementById('choose-pfp');

fileButton.addEventListener('change', function(e) {

    var storageRef = firebase.storage().ref("profile_pictures/" + uid);

    var file = e.target.files[0];
    
    storageRef.put(file).then(function(snapshot) {

    window.alert("Profile picture has been uploaded!");



    storageRef.getDownloadURL().then(function(url) {
        document.querySelector('#profile-picture').src = url;

var url = storageRef.getDownloadURL();

        db.collection('users').doc(uid).set({
            pfpURL: url.value,
        
        })
    })
})
});

【问题讨论】：

标签： javascript html firebase google-cloud-firestore firebase-storage

【解决方案1】：

您在回调中第二次调用getDownloadURL()，它将正确的下载 URL 替换为一个承诺。

解决方案是重用传入then()的url：

storageRef.getDownloadURL().then(function(url) {
    document.querySelector('#profile-picture').src = url;

    db.collection('users').doc(uid).set({
        pfpURL: url,
    })
})

【讨论】：