Dropzone.js status is pending and not uploading a file

Question

I am using Multer in back-end to handle file upload and Dropzone.js in front-end. Everything is fine when I use Postman to test my back-end code, but in when I use Dropzone the status is pending and file not getting uploaded. Then after 4 minutes of waiting I get Timeout error.

I am explicitly saying to use POST instead of PUT and process file uploading queue right away.

method: "post"
autoProcessQueue: true

I don't know is there any option with Dropzone.js that I am missing or my back-end code has a problem

Here is my node code to handle file upload.

var multer  = require('multer');
app.use(multer({ dest: './uploads/'}));

app.post("/attachments/:code", function (req, res, next){
    console.log("Posted Files: " + req.files);
    console.log("Posted Codes: " + req.params.code);
    res.status(200).send("Done");
});

app.get("/attachments/:code", function (req, res, next){
    res.status(200);
});

Update:

Here is the header of Postman's request which successfully uploads the file:

Accept:*/*
Accept-Encoding:gzip, deflate
Accept-Language:en-US,en;q=0.8
Cache-Control:no-cache
Connection:keep-alive
Content-Length:8414633
Content-Type:multipart/form-data; boundary=----WebKitFormBoundaryuBBzCAdVgFBBCHmB
CSP:active
Host:localhost:3000
Origin:chrome-extension://fdmmgilgnpjigdojojpjoooidkmcomcm
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/43.0.2357.124 Safari/537.36

Here is the header of Dropzone.js's request:

Access-Control-Request-Headers:accept, cache-control, content-type, x-requested-with
Access-Control-Request-Method:POST
Origin:http://localhost:9000
Referer:http://localhost:9000/
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/43.0.2357.124 Safari/537.36

Answer 1

I solved the issue by enabling Cache-Control in Access-Control-Allow-Header header of my Node server.

app.use(function (req, res, next) {
    res.header('Access-Control-Allow-Origin', '*');
    res.header('Access-Control-Allow-Headers', 'Cache-Control, Origin, X-Requested-With, Content-Type, Accept, Authorization');
    res.header('Access-Control-Allow-Methods', 'GET,PUT,PATCH,POST,DELETE');
    if (req.method === 'OPTIONS') return res.end();
    next();
});

Answer 2

you can add the multer midware into the post handler:

app.post('/upload',[ multer({ 
                            dest: './uploaded/files/',

                            onError: function (error, next) {

                              next(error);
                            }
                        }
                        ), function (req, res) {

    res.status(200).send('success');

}]);