Having trouble with my React Native app. I am trying to upload files, whether they are pictures or PDFs, but once uploaded, I can't seem to open them. However, "The files are getting uploaded to the storage."
export const uploadToStorage = async (document: any) => {
try {
const storage = getStorage();
const fileName = document?.name;
const storageRef = ref(storage, `files/${fileName}`);
const fileRef = ref(storageRef);
const fileType = document?.mimeType;
const metaData = {
contentType: fileType
};
const snapshot = await uploadBytesResumable(storageRef, document, metaData);
console.log('Upload successful:', snapshot);
const downloadURL = await getDownloadURL(fileRef);
console.log('Download URL:', downloadURL);
return downloadURL;
} catch (error) {
console.error('Error:', error);
throw error;
}
}
const _pickDocument = async () => {
const result = await DocumentPicker.getDocumentAsync({
multiple: false,
})
if (result !== null) {
result.assets?.map(async (item: any) => {
const filePrefix = 'file://'
if (item.uri.startsWith(filePrefix)) {
item.uri = item.uri.substring(filePrefix.length)
}
console.log('URL:' + item.mimeType)
dispatch(addPDF(item.name))
if (auth.currentUser?.uid !== null) {
console.log(auth.currentUser?.uid)
await uploadToStorage(item).then((downloadUrl) => {
setDownloadUrl(downloadUrl)
})
}
})
}
}
service firebase.storage {
match /b/{bucket}/o {
// Allow read and write access to all files
match /{allPaths=**} {
allow read, write;
}
}
}
No luck with different headers/metaData or switching to uploadBytes instead of uploadBytesResumable. The file uploads correctly but is not manually accessible from Firebase Storage.
For example, uploading a PDF results in an error message: Error: Failed to load PDF document.