Breaking News: Grepper is joining You.com. Read the official announcement!

upload multiple images from html to firebase storage using multer and firebase dependencies version 9.21.0

yoga saja answered on May 31, 2023 Popularity 3/10 Helpfulness 3/10

answer upload multiple images from html to firebase storage using multer and firebase dependencies version 9.21.0

upload multiple images from html to firebase storage using multer and firebase dependencies version 9.21.0

Comment

// upload multiple images from html to firebase storage 
using multer and firebase dependencies version 9.21.0

// html
<form action="/upload" method="POST" enctype="multipart/form-data">
   <input type="file" name="images" accept="image/*" multiple required>
   <button type="submit">Upload</button>
</form>

// node.js
import express from 'express';
import { initializeApp } from 'firebase/app';
import { getStorage, ref, uploadBytes, getDownloadURL } from 'firebase/storage';
import multer from 'multer';

const firebaseConfig = {
  // Add your Firebase configuration object here
  // apiKey: "...",
  // authDomain: "...",
  // projectId: "...",
  // ...
};

const app = express();
const storage = getStorage(initializeApp(firebaseConfig));

// Set up multer middleware
const upload = multer({ storage: multer.memoryStorage() });
// more multer configuration visit doc in npm sdh cukup jelas

app.post('/upload', upload.array('images'), async (req, res) => {
  const files = req.files;

  if (!files || files.length === 0) {
    res.status(400).send('No files uploaded.');
    return;
  }

  try {
    const uploadPromises = files.map(async (file) => {
      // Create a unique filename or use the original file name
      const filename = file.originalname;

      // Upload each file to Firebase Storage
      const storageRef = ref(storage, filename);
      await uploadBytes(storageRef, file.buffer);

      // Get the public URL of each uploaded file
      const downloadURL = await getDownloadURL(storageRef);

      return downloadURL;
    });

    // Wait for all uploads to complete
    const downloadURLs = await Promise.all(uploadPromises);

    // Files uploaded successfully, send the download URLs to the client
    res.status(200).send(downloadURLs);
  } catch (error) {
    console.error('Error uploading files:', error);
    res.status(500).send('Error uploading files.');
  }
});

app.listen(3000, () => {
  console.log('Server started on port 3000');
});

Popularity 3/10 Helpfulness 3/10 Language whatever

Source: Grepper

Tags: dependencies firebase firebase-storage html multer upload using version whatever

Link to this answer
Share Copy Link

Contributed on May 31 2023

yoga saja

0 Answers Avg Quality 2/10

upload multiple images from html to firebase storage using multer and firebase dependencies version 9.21.0

Contents

More Related Answers

upload multiple images from html to firebase storage using multer and firebase dependencies version 9.21.0

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.