上传的图像（base64）在 firebase putString 方法中看起来已损坏答案

【问题标题】：Uploaded image (base64) looks corrupted in firebase putString method上传的图像（base64）在 firebase putString 方法中看起来已损坏
【发布时间】：2018-09-18 03:51:36
【问题描述】：

我正在使用 putString 方法将图像（base64）上传到 firebase

uploadTask = fireStorage.ref('/your/path/here').child('file_name').putString(snapshot, 'base64', { contentType: 'image/jpg' });

它是一个有效的 base64 内容（因为它是一个巨大的字符串，所以我可以将它粘贴在这里。但我已经通过将其解码为在线图像来检查它）但它开始像这样

/9j/4AAQSkZJRgABAQAAkACQAAD/4QCMRXhpZgAATU0AKgAAAAgABQES

上传（到 firebase）的图片看起来像一个 1 像素的盒子。

这是网址图片

https://firebasestorage.googleapis.com/v0/b/manage-my-rides-1493889860531.appspot.com/o/lala%2Fchild.jpg?alt=media&token=63c9078a-7124-41a1-9349-6a2f2c6d8379

firebase 代码

var uploadedFile = await fireStorage.ref("lala").child("child.jpg").putString(snapshot, 'base64', {
        contentType: 'image/jpg'
    });
var url = await fireStorage.ref("lala").child("child.jpg").getDownloadURL();
    console.log(url);

【问题讨论】：

尝试从你的字符串中删除data:image/jpeg;base64，如果它存在的话
@PritishVaidya 它不在那里。更新了我的问题。

标签： firebase react-native firebase-storage

【解决方案1】：

我尝试使用各种方法设置base64，但似乎不起作用。 图像在存储过程中似乎损坏了

这里有一个快速的解决方法

fetch(YOUR_ORIGINAL_BASE_64_STRING)
    .then(res => res.blob())
    .then(blob => 
      fireStorage.ref('/your/path/here').child('file_name').put(blob);
    )

示例

var url = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg=="

let storageRef = firebase.storage().ref().child('image');
fetch(url)
    .then(res => res.blob())
    .then(blob =>
        storageRef.put(blob).then(function(snapshot) {
            console.log(snapshot)
            console.log('Uploaded a blob!');
        })
    )

【讨论】：

感激不尽。你真棒。 firebasestorage.googleapis.com/v0/b/…