CODEWITHSUNDEEP
javascriptnode.jsmongodb
Jude Vinod
Jude Vinod

Reputation: 13

Can't upload files to Node.js

Can't upload files to the server. I've used npm install express-fileupload and also did the var fileUpload = require('express-fileupload') and app.use(fileUpload()). And while calling

router.post('/add-products',(req,res)=>{
  console.log(req.body);
  console.log(req.files.image);

It says cannot read image of null.

Upvotes: 0

Views: 740

Answers (1)

Murat Colyaran
Murat Colyaran

Reputation: 2189

I can give you a working full example.

Project structure:

- storage (empty folder)
- routes
 -> upload.route.js
- controllers
 -> upload.controller.js
index.js

index.js

const express = require('express');
const app = express();
const route = require('./routes/upload.route');
app.use('/', route);

let port = 8000;
app.listen(port);
console.log(`API listens localhost:${port}`);

This is your upload.route.js

const express = require('express');
const router = express.Router();
const { uploadController } = require('../controllers/upload.controller');

router.use('/media/upload', uploadController);

module.exports = router;

This is upload.controller.js

const formidable = require('formidable');
const path = require('path');

exports.upload = async (req, res) => {

    try {
        // Receive the media and store it
        let [uploadPath, filename] = await processUpload(req);

        return res
            .status(200)
            .send({
                success: 1,
                message: "File uploaded",
                filename,
                uploadPath
            });

    } catch (error) {

        return res
            .status(400)
            .send({
                success: 0,
                message: "Ops! Something went wrong",
                errorObject: error.message
            });
    }
}

function processUpload(req) {

    return new Promise((resolve, reject) => {
        try {
            let uploadDir = __dirname + `/../storage`;

            // We used helper formidable package
            let form = new formidable.IncomingForm()

            form.multiples = true;
            form.keepExtensions = true;

            // Upload path
            form.uploadDir = uploadDir;

            let result;

            form.on('fileBegin', function (name, file) {

                if (!file.type) reject(new Error("No media specified!"));

                const fileExt = path.extname(file.name);

                let filename = "test" + fileExt;

                file.path = path.join(uploadDir, filename);

                // Return the path where file uploaded
                result = [file.path, uuid];
            });

            form.parse(req, (err, fields, files) => {
                if (err) return reject("Upload failed.");
                resolve(result);
            });


        } catch (error) {
            reject("Upload failed.");
        }
    });
}

When you call localhost:8000/media/upload with a POST or PUT request with postman form-data. You can see the uploaded file under the storage folder in the project.

Let me know if something goes wrong with the code

Note: You need to use formidable (For uploading) package to run the example

Upvotes: 1

Related Questions