Multer encountering an error due to issues with TypeScript typings

Question

Multer encountering an error due to issues with TypeScript typings

The code snippet below shows my current implementation:

import multer from "multer";
const upload = multer().single('file');
router.post('/add', async (req, res) => {
    upload(req, res, async (err: any) => {
        if (err) {
            res.status(500).send(err.toString())
        }
        else {
            res.status(200).send(await addMedia(req.file.filename))
        }
    })
});

I am currently in the process of determining the appropriate Error type to replace any. However, when I attempted to use MulterError, I encountered the following error message :

Argument of type '(err: MulterError) => Promise' is not assignable to parameter of type 'NextFunction'. Types of parameters 'err' and 'deferToNext' are incompatible. Type 'string' is not assignable to type 'MulterError'.

Using unknown is not feasible due to the .toString() method. While string does work, it does not accurately reflect the type, as further investigation reveals that a MulterError is present.

An additional point of confusion lies with the 3rd parameter of the upload function - this may possibly be contributing to my dilemma.

typescript express multer

Answer 1

Answer №1

This is the approach I took to manage errors

const storage: multer.StorageEngine = multer.diskStorage({
    destination: (_req, _file, callback) => {
        const path = `./uploads/`;
        // check and create folder if it doesn't exist
        fs.mkdirSync(path, { recursive: true });
        callback(null, path);
    },
    filename: (_req, file, callback) => {
        callback(null, new Date().toISOString() + file.originalname);
    }
});

const fileLimit = {
    fileSize: 1024 * 1024 * 10 // limit file size to 10MB
};
const fileFilter = (
    _req: Request,
    file: Express.Multer.File,
    callback: FileFilterCallback
) => {
    // send error if file type is not an image
    if (!file || file.mimetype.split('/')[0] != 'image') {
        return callback(new Error('Only images are allowed'));
    }
    callback(null, true);
};

const upload: multer.Multer = multer({
    storage: storage,
    limits: fileLimit,
    fileFilter: fileFilter
});

const galleryUpload = upload.single('galleryImage');
// Upload gallery image
router.post('/', async (req: Request, res: Response) => {
    galleryUpload(req, res, (err: unknown) => {
        if (err instanceof multer.MulterError) {
            // Handle Multer error during upload.
            return res.status(400).send({ message: err.message });
        } else if (err instanceof Error) {
            // Handle unknown error during upload.
            return res.status(400).send({ message: err.message });
        }
        return res.status(200).send({ message: 'Image uploaded successfully' });
    });
});

Answer 2

This is the approach I took to manage errors

const storage: multer.StorageEngine = multer.diskStorage({
    destination: (_req, _file, callback) => {
        const path = `./uploads/`;
        // check and create folder if it doesn't exist
        fs.mkdirSync(path, { recursive: true });
        callback(null, path);
    },
    filename: (_req, file, callback) => {
        callback(null, new Date().toISOString() + file.originalname);
    }
});

const fileLimit = {
    fileSize: 1024 * 1024 * 10 // limit file size to 10MB
};
const fileFilter = (
    _req: Request,
    file: Express.Multer.File,
    callback: FileFilterCallback
) => {
    // send error if file type is not an image
    if (!file || file.mimetype.split('/')[0] != 'image') {
        return callback(new Error('Only images are allowed'));
    }
    callback(null, true);
};

const upload: multer.Multer = multer({
    storage: storage,
    limits: fileLimit,
    fileFilter: fileFilter
});

const galleryUpload = upload.single('galleryImage');
// Upload gallery image
router.post('/', async (req: Request, res: Response) => {
    galleryUpload(req, res, (err: unknown) => {
        if (err instanceof multer.MulterError) {
            // Handle Multer error during upload.
            return res.status(400).send({ message: err.message });
        } else if (err instanceof Error) {
            // Handle unknown error during upload.
            return res.status(400).send({ message: err.message });
        }
        return res.status(200).send({ message: 'Image uploaded successfully' });
    });
});

Multer encountering an error due to issues with TypeScript typings

Answer №1

Similar questions

Verify if an express module has a next() function available

I am a beginner in the world of MEAN stack development. Recently, I attempted to save the data from my form submissions to a MongoDB database, but unfortunately, I have encountered

What is the proper way to incorporate the "pdf" package into a TypeScript project?

Are you struggling with perplexing TypeScript error messages caused by a hyphen in the package name?

Why isn't the parent (click) event triggered by the child element in Angular 4?

Creating a personalized news feed using getstream.io in Node.js - a step-by-step guide

VS 2015 solution loses files upon saving

What is the best way to extract values from case-sensitive query param variables?

How to send variables to a function when a value changes in TypeScript and Angular

Determine the data type of a property within a JavaScript object

Calling Array.prototype.slice results in an array with no elements

Guide on creating a style instance in a component class using Material-UI and Typescript

Incorrect handling of double quotes within an object in an Angular component file

The instantiation of generic types in Typescript

Express cookie not being saved in React application by Chrome

Every time I attempt to start my React app using npm start, I encounter the error message stating "Something is already running on port 3000"

Is there a way to combine two arrays of objects that may be undefined?

What is the most efficient way to execute useEffect when only one specific dependency changes among multiple dependencies?

Dealing with Promise Wrapper Already Declared in TypeScript Return TypeMismatch

Allowing the use of the colon character in Node.js Express routes using Google custom methods