Lazy Panda



Upload file to Firebase Storage as a Formdata using Multer

Many times we need to upload files to some storage system using multipart/form-data as an HTTP request body. And that could be the best way to upload files to any Cloud storage or server. Let's see how we can do that using NodeJS and Firebase storage.

firebase storage image upload using multer

Step 1: Firebase Account setup and enabled Firebase Storage.

To do that please follow the link '' and get started. 


Step 2: Make the Firebase storage publicly accessible. 

Based on application needs, if the storage is behind the login screen then there is no need to make the storage publicly accessible read / write. But in my case, I am uploading files without login to google cloud. I have to make the storage publicly accessible. The rule is being set as below -

rules_version = '2';
service {
  match /b/{bucket}/o {
    match /{allPaths=**} {
      allow read, write;

Step 3: Save and keep google config (help to connect Firebase from NodeJS)

Firebase Project config

firebase config

Firebase Config will be used in NodeJS

firebase config nodejs

Step 4: Now create a NodeJS & TypeScript application. 

I have already prepared a boilerplate Node Js with a TypeScript application. Feel free to check this out. 

NodeJS with TypeScript boilerplate code - Read more.


Step 5: Configure Route path, Multer, and Firebase

In this step, we will write Node Js code and explain how all the component will work together. 

firebase storage with multer

Install the following package.

npm install firebase multer @types/multer


Set up the image process middleware, where we can keep the image filter, memory storage, and limits. 


Now, upload the file to Firebase storage, before that if you need you could create a bucket as well. 

uploadImageToFirebase(fileDetails: any): Promise<IFileStatus> {

return new Promise<IFileStatus>(async (resolve, reject) => {

const fileStatus: IFileStatus = {

isUploaded: false,

filePath: ''



if (!this.isValidRequest) return reject(fileStatus);


// initialize & get reference of firebase storage

const app = initializeApp(this.firebaseConfig);

const storage = getStorage(app);

const storageRef = ref(storage, `lp-blog/${fileDetails.originalname}`);

const metatype = { contentType: fileDetails.mimetype, name: fileDetails.originalname };


await uploadBytes(storageRef, fileDetails.buffer, metatype)

.then(async (snapshot) => {

fileStatus.isUploaded = true;

fileStatus.filePath = `${fileDetails.originalname}`;



.catch((error) => {

console.log('Error: ', error);







Advantages of Using Multer

Using Multer in your Node.js applications simplifies the otherwise complicated process of uploading and saving images directly on your server. Multer is also based on a busboy, a Node.js module for parsing incoming form data, making it very efficient for parsing form data.