【发布时间】:2025-12-09 12:50:01
【问题描述】:
在 React Native 中,我使用 ImagePicker 包选择图像并将图像上传到 Firebase 存储。我还想通过 Firebase Rest Api 使用 Getdownloadurl() 方法发送 Firebase 存储图像链接。
我设法上传图片,但是当我通过发出 rest api 发布请求来发送它们时,图片链接变为 未定义。 我正在从控制台屏幕发出没有 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);
}
}
}
【问题讨论】:
标签: javascript typescript react-native firebase-storage