Firebase Storage
Firebase Storage
Firebase Storage provides secure, scalable cloud storage for user-generated content such as images, videos, and documents in React Native applications.
Installing Firebase Storage
bash
npm install @react-native-firebase/storage
Uploading a File
javascript
import storage from '@react-native-firebase/storage';
async function uploadImage(uri, userId) {
const reference = storage().ref(`avatars/${userId}.jpg`);
await reference.putFile(uri);
}
Tracking Upload Progress
javascript
const task = storage().ref(`avatars/${userId}.jpg`).putFile(uri);
task.on('state_changed', (snapshot) => {
const progress = (snapshot.bytesTransferred / snapshot.totalBytes) * 100;
setUploadProgress(progress);
});
Getting a Download URL
javascript
const url = await storage().ref(`avatars/${userId}.jpg`).getDownloadURL();
Downloading a File
javascript
const localPath = `${RNFS.DocumentDirectoryPath}/avatar.jpg`;
await storage().ref(`avatars/${userId}.jpg`).writeToFile(localPath);
Deleting a File
javascript
await storage().ref(`avatars/${userId}.jpg`).delete();
Setting Storage Security Rules
javascript
// storage.rules
service firebase.storage {
match /b/{bucket}/o {
match /avatars/{userId} {
allow write: if request.auth.uid == userId;
}
}
}
Conclusion
Firebase Storage, combined with proper security rules, provides a reliable and scalable solution for handling file uploads and downloads in React Native applications, from profile pictures to document sharing.
