Can i use multer without express in nextjs?

Viewed 1338
import type { NextApiRequest, NextApiResponse } from 'next'
import multer from 'multer'
const upload = multer({ dest: 'public/uploads/' })

export default async (req: any, res: NextApiResponse) => {
  // Swith case method
  switch (req.method) {
    // Case 'POST' for auth
    case 'POST':
      try {
        upload.single('image')
        res.status(201).json('ok')
      } catch (err) {
        console.log(err)
      }

      return

      break
    default:
      break
  }
}

I don't used express route, So I don't know how to call Middleware in the code snippet above.

2 Answers

Yes it works well locally but when you deploy on vercel, it doesn't work, which is certainly due to the serverless nature of Nextjs. you can replace it with formidable-serverless which works very well locally and in production on Vercel.

import formidable from 'formidable-serverless';


export default async(req, res) => {
  const form = new formidable.IncomingForm();
  form.keepExtensions = true;

  form.parse(req, async (err, fields, files) => {
    if (err) {
      return res.status(400).json({ message: err });
    }

    return res.json(files);
  });
}

and don't forget to export the config object

export const config = {
  api: {
    externalResolver: true,
  },
}

in order to avoid this warning

Yes, you can use multer to parse your incoming request, if you mimmic it's middlware environment. Example use:

pages/api/formWithFiles.js
import multer from 'multer'

// disable next.js' default body parser
export const config = {
  api: { bodyParser: false }
}

export default async function handler(req, res) {
  await new Promise(resolve => {
    // you may use any other multer function
    const mw = multer().any()

    //use resolve() instead of next()
    mw(req, res, resolve)
  })

  // example response
  res.status(200).json({
    body: req.body,
    files: req.files
  })
}

Related