Question

我想让用户上传个人资料图片，我是通过使用html文件API来完成的。

以下是我上传和显示个人资料图片的代码：

uploadPic.addEventListener('change',function(evt){
    var file = this.files[0];
    firebase.storage().ref().child(user_uid + "/" + file.name).put(file).then(function(){
        console.log("uploaded to storage");
    }).catch(function(e){
        console.log(e.message);
    });

    firebase.storage().ref().child(user_uid + "/" + file.name).getDownloadURL().then(function(url){
        user.updateProfile({photoURL: url}).then(function(){
            console.log("change success");
        }).catch(function(e){
            console.log(e.message);
        });
    }).catch(function(e){
        console.log(e.message);
    });
});

/*profile pic*/
if(user.photoURL===null){
    profilePic.src = "image/anonymous_big.png";
}else{
    console.log(user.photoURL);
    profilePic.src = user.photoURL;
}

每当用户更改文件时，它将上传到firebase存储，然后作为URL下载并将值提供给user.photoURL。

图片上传并下载成功，但个人资料图片如下：
the profile picture

如果我 console.log（user.photoURL）并单击控制台中的网址，则会显示正确的图片。我不知道出了什么问题。提前谢谢。

Answer 1

根据您的评论详细说明错误“权限被拒绝”，您应该仔细检查您的存储访问规则。

Firebase存储图像无法显示

1 个答案: