ExpressJS File Upload Stopped After NGINX Reverse Proxy Deployment

Question

I'm using Multer for file upload on my ExpressJS Application, all upload were working find until I deployed the application with nginx as reverse proxy. I can't seem to figure out what is wrong. I was also using Vimeo library for Vimeo uploads, which has also stopped.

Everything below still works perfectly on my local system and was working perfectly online until I started using a domain on NGINX instead of a NodeJS IP:PORT

I have also installed Lets Encrypt SSL during the same process, I'm not sure if that will cause trouble here.

The following is the my code for upload of Image to Filesystem & Video to Vimeo Server using Vimeo API.

var multer  = require('multer')
var upload = multer({ dest:'public/uploads/' })
var Vimeo = require('vimeo').Vimeo;
var lib = new Vimeo('somekey', 'someuser', 'somepass');


/* HANDLE IMAGE POST */
router.post('/profile', upload.single('picture'), function(req, res) {
  if(req.file){
    req.body.picture = req.file.filename;
  }
});


/* HANDLE VIDEO POST */
router.post('/video-vimeo', upload.single('vimeovideo'), function(req, res) {
  if(req.file){
    req.body.videourl = req.file.filename;
  }
  var vimeoUrl ='/public/uploads/'+req.file.filename;
  lib.streamingUpload(vimeoUrl,  function (error, body, status_code, headers) {
      if (error) { throw error; }
      lib.request(headers.location, function (error, body, status_code, headers) {
          var video = {};
          video._id = req.body._id;
          video.videourl = body.link;
          videoModel.findByIdAndUpdate(video._id, video, function(err, dish) {
            if (err) { console.log(err); }
            else{ res.redirect(req.get('referer')); }
          });
      });
  });
});

My nginx settings (/etc/nginx/sites-enabled):

server {
    listen 443 ssl http2 default_server;
    listen [::]:443 ssl http2 default_server;
    include snippets/ssl-example.com.conf;
    include snippets/ssl-params.conf;

    server_name example.com www.example.com;

    location / {
        proxy_pass http://localhost:8080;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
    }
}

NodeJS Server in Express (bin/www):

var app = require('../app');
var debug = require('debug')('example:server');
var http = require('http');

var port = normalizePort(process.env.PORT || '8080');
app.set('port', port);

var server = http.createServer(app);

server.listen(port, 'localhost');
server.on('error', onError);
server.on('listening', onListening);

I have found some article suggesting to add the following in my NGINX configuration (It didn't work for me):

location /public/uploads {
    limit_except POST          { deny all; }

    client_body_temp_path      /tmp/;
    client_body_in_file_only   on;
    client_body_buffer_size    128K;
    client_max_body_size       1000M;

    proxy_pass_request_headers on;
    proxy_set_header           X-FILE $request_body_file;
    proxy_set_body             off;
    proxy_redirect             off;
    proxy_pass                 http://localhost:8080/public/uploads;
}

Please let me know if this is a common problem? and what did I do wrong?

@FranciscoMateo I just checked, the nginx error log and access log show nothing error like. I don't have any node logs. The only error I see is the transaction is going through but the images are being rendered as broken since they are not found. — Aayush
– Aayush, Commented Jul 16, 2017 at 18:35
I am also using Nginx with a reverse proxy and unable to use multer in production when it is working fine locally. — Forrest Wilkins
– Forrest Wilkins, Commented May 26, 2020 at 19:25

Levi99 · Accepted Answer · 2021-03-21 18:58:05Z

0

I recently ran into this problem, and spent a few days trying to figure it out.

When in production mode the uploads folder is in a different location than when in development mode, or on localhost.

Try running some console logs in both development and production to find out where your uploads folder is.

This is my code for multer.diskStorage

const storage = multer.diskStorage({
  destination(req, file, cb) {
    process.env.NODE_ENV === 'production'
      ? cb(null, '../uploads/')
      : cb(null, 'uploads/')
  },
  filename(req, file, cb) {
    cb(
      null,
      `${file.fieldname}-${Date.now()}${path.extname(file.originalname)}`
    )
  },
})

answered Mar 21, 2021 at 18:58

Levi99

12 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Yordani Bonilla · Accepted Answer · 2023-11-24 11:01:34Z

0

But what is the issue. For me the file.originalname is incomplete i only get the extension and it was working fine in development mode. Only ran into this problem in production with nginx as reverse proxy with lets encrypt ssl.

answered Nov 24, 2023 at 11:01

Yordani Bonilla

931 silver badge8 bronze badges

1 Comment

Community Over a year ago

As it’s currently written, your answer is unclear. Please edit to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers in the help center.

Collectives™ on Stack Overflow

ExpressJS File Upload Stopped After NGINX Reverse Proxy Deployment

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related