FirebaseHow-ToBeginner · 3 min read

How to Delete File from Firebase Storage Quickly and Safely

To delete a file from Firebase Storage, use the delete() method on a reference to the file. First, create a reference to the file using ref(), then call delete() to remove it from storage.

📐

Syntax

The basic syntax to delete a file involves two steps: creating a reference to the file and calling the delete() method on that reference.

ref(path): Creates a reference to the file at the given path in Firebase Storage.
delete(): Deletes the file the reference points to.

javascript

const storageRef = firebase.storage().ref('path/to/file.jpg');
storageRef.delete().then(() => {
  // File deleted successfully
}).catch((error) => {
  // Handle errors here
});

💻

Example

This example shows how to delete a file named image.png stored in the images folder of Firebase Storage. It handles success and error cases.

javascript

import { getStorage, ref, deleteObject } from 'firebase/storage';

const storage = getStorage();
const fileRef = ref(storage, 'images/image.png');

deleteObject(fileRef).then(() => {
  console.log('File deleted successfully');
}).catch((error) => {
  console.error('Error deleting file:', error);
});

Output

File deleted successfully

⚠️

Common Pitfalls

Common mistakes when deleting files from Firebase Storage include:

Using an incorrect file path in the reference, which causes a "file not found" error.
Not handling errors, so failures are silent and hard to debug.
Trying to delete files without proper Firebase Storage permissions set in security rules.

Always verify the file path and ensure your app has permission to delete files.

javascript

/* Wrong: Incorrect path causes error */
import { getStorage, ref } from 'firebase/storage';
const storage = getStorage();
const wrongRef = ref(storage, 'wrongfolder/wrongfile.png');

// deleteObject is the correct method to delete files in modular SDK
import { deleteObject } from 'firebase/storage';
deleteObject(wrongRef).catch(error => console.error('Failed:', error));

/* Right: Correct path and error handling */
const correctRef = ref(storage, 'images/image.png');
deleteObject(correctRef).then(() => console.log('Deleted')).catch(error => console.error('Failed:', error));

📊

Quick Reference

Here is a quick summary of the key steps to delete a file from Firebase Storage:

Step	Description
1. Create Reference	Use `ref(storage, 'path/to/file')` to point to the file.
2. Call Delete	Use `deleteObject(ref)` to delete the file.
3. Handle Result	Use `then()` for success and `catch()` for errors.
4. Check Permissions	Ensure Firebase Storage rules allow deletion.

✅

Key Takeaways

Use a correct file path when creating the storage reference to avoid errors.

Call the delete method on the file reference to remove the file from Firebase Storage.

Always handle success and error cases to know if deletion worked.

Check Firebase Storage security rules to ensure your app has permission to delete files.

Use the modular Firebase SDK methods like getStorage, ref, and deleteObject for best practice.