将从ReactNative/Expo ImagePicker中挑选的图像保存到Baqend
问题描述:
我很难节省从Expo(React Native)中挑选的图像。将从ReactNative/Expo ImagePicker中挑选的图像保存到Baqend
https://docs.expo.io/versions/latest/sdk/imagepicker.html
看来阵营本地没有上传所选图像作为BLOB支持,但确实有一个base64选项。
代码:
_pickImage = async() => {
let pickerResult = await ImagePicker.launchImageLibraryAsync({
allowsEditing: true,
base64: true,
aspect: [4, 4],
});
this._handleImagePicked(pickerResult);
};
_handleImagePicked(pickerResult) {
const uri = pickerResult.base64;
const img = new db.File({ name: 'test.jpg', data: uri, type: 'base64', mimeType: 'image/jpg' });
db.UserData.load(this.state.UserDataID).then(UserData => {
img.upload({ force: true }).then((file) => {
UserData.photo = "https://remarkable-apple-95.app.baqend.com/v1" + file.id;
alert(file.id)
return UserData.update();
},
(error) => { alert(error); }
);
});
}
当我console.log(pickerResult.base64)
我得到一个超长字符串,它看起来像的base64,但在运行时,该img.upload
抛出错误,它说"PersistentError: An unexpected persistent error occurred."
答
你”再右吧。 React Native不支持二进制数据。不幸的是Baqend还不支持base64文件上传。
作为一种解决办法,你有两个选择:
-
使用React Native Fetch Blob库,它绕过的局限阵营本地不上传,并通过本机代码直接下载文件支持二进制文件,还给参考对那些。您的代码可能类似于此:
ImagePicker.showImagePicker(options, async (response) => { const upload = new db.message.UploadFile('files', 'uploadFetchBlob.jpg') const body = 'RNFetchBlob-' + response.uri; RNFetchBlob.fetch('PUT', 'https://{YOUR-APP-NAME}.app.baqend.com/v1' + upload.request.path, upload.request.headers, body).then((res) => { db.File({ parent: 'files', name: 'uploadFetchBlob.jpg'}).url }) });
遗憾的是随着世博会的客户端这不会工作的权利,但你必须退出你的项目和使用“本机代码”。
- 第二种方法是不直接使用baqend文件端点,而是将base64字符串上传到baqend模块。在那里你可以解析你的base64字符串,并将它上传到你的后端模块中的文件。你可以在我们的指南中找到这个例子。 https://www.baqend.com/guide/topics/baqend-code/#handling-binary-data
希望这会有帮助