![](/img/trans.png)
[英]How to upload multiple image to firebase in react native fetch blob
[英]React Native Firebase Multiple Image Upload Problem
在 React Native 中,我使用 ImagePicker package select 圖像並將圖像上傳到 Firebase 存儲。 I also want to send Firebase Storage image links using the Getdownloadurl() method with the Firebase Rest Api.
我設法上傳圖像,但是當我通過發出 rest api 發布請求發送它們時,圖像鏈接 go未定義。 我正在從控制台屏幕發出一個沒有 100% 的總圖像大小的發布請求。
const uploadImage = async (uploadUri: string, transferred: number) => {
let filename = uploadUri.substring(uploadUri.lastIndexOf('/') + 1);
transferred = 0;
const storageRef = storage().ref(`images/${filename}`);
const task = storageRef.putFile(uploadUri);
task.on('state_changed', taskSnapshot => {
console.log(`${taskSnapshot.bytesTransferred} transferred out of ${taskSnapshot.totalBytes}`);
transferred = Math.round((taskSnapshot.bytesTransferred / taskSnapshot.totalBytes) * 100);
});
try {
await task;
const url = await storageRef.getDownloadURL();
return url;
} catch (error) {
console.log(error);
return null;
}
}
export const addPost = (files: string[], post: Post): ThunkAction<void, RootState, null, AddPostAction> => {
return async dispatch => {
try {
dispatch({ type: ADD_POST_LOADING, payload: true });
const imageData: Image[] = [];
files.map(async (item) => {
const imageUrl = await uploadImage(item, 0);
imageData.push({ image: imageUrl! });
});
const postData: Post = {
...post,
thumb: imageData[0].image
}
const response = await fetch(`${BASE_URL}/post.json`, { method: "POST", body: JSON.stringify(postData) });
if (response.ok) {
const successPostData: AddPostSuccess = await response.json();
dispatch({ type: ADD_POST_SUCCESS, payload: successPostData });
} else {
dispatch({ type: ADD_POST_ERROR, payload: "404" });
}
} catch (error) {
console.log(error);
}
}
}
map
無法處理async
代碼。 嘗試改變這部分:
files.map(async (item) => {
const imageUrl = await uploadImage(item, 0);
imageData.push({ image: imageUrl! });
});
對此:
for (let i = 0; i < files.length; i++) {
const item = files[i];
const imageUrl = await uploadImage(item, 0);
imageData.push({ image: imageUrl! });
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.