recieve multipart/form-data request in nginx server

Question

My nextjs website is trying to send multipart/form-data request to flask backend deployed on digital ocean droplet. Here's the request sending part:

let response =  await axios.post(
            "http://{IP}/facebook", formData,{
              headers:{
                'Content-Type': 'multipart/form-data'
              }
            }
          );

here's the flask receiving part :

from flask import Flask, request , jsonify
from flask_cors import CORS

app = Flask(__name__)

CORS(app,supports_credentials=True)

@app.route("/facebook",methods=["GET", "POST"])
def facebook():
    print('GOT FACEBOOK REQUEST')
    try:
        print(request.form)
        return jsonify({"message":"Recieved request at server"})
    
    except Exception as e:        
        return jsonify({"message":f"Exception in campaign {str(e)}"})

here's my /etc/nginx/sites-avialable/app

server {
    listen 80;
    client_header_timeout 3m;
    client_body_timeout 3m;
    send_timeout 3m;
    client_max_body_size 20M;
    server_name {IP};

    location / {
        proxy_pass http://127.0.0.1:5000;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto http;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_request_buffering off;
        proxy_buffering off;
        proxy_max_temp_file_size 0;
    }
}

following is /etc/nginx/nginx.conf

user www-data;
worker_processes auto;
pid /run/nginx.pid;
include /etc/nginx/modules-enabled/*.conf;

events {
        worker_connections 768;
        # multi_accept on;
}

http {

        ##
        # Basic Settings
        ##

        sendfile on;
        tcp_nopush on;
        types_hash_max_size 2048;
        # server_tokens off;

        # server_names_hash_bucket_size 64;
        # server_name_in_redirect off;

        include /etc/nginx/mime.types;
        default_type application/octet-stream;
        ##
        # SSL Settings
        ##

        ssl_protocols TLSv1 TLSv1.1 TLSv1.2 TLSv1.3; # Dropping SSLv3, ref: POODLE
        ssl_prefer_server_ciphers on;

        ##
        # Logging Settings
        ##

        access_log /var/log/nginx/access.log;
        error_log /var/log/nginx/error.log;

        ##
        # Gzip Settings
        ##

        gzip on;

        # gzip_vary on;
        # gzip_proxied any;
        # gzip_comp_level 6;
        # gzip_buffers 16 8k;
        # gzip_http_version 1.1;
        # gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript;
        ##
        # Virtual Host Configs
        ##

        include /etc/nginx/conf.d/*.conf;
        include /etc/nginx/sites-enabled/*;
}

When i run the app at http://127.0.0.1/5000 it receives json/application request perfectly but does not receive multipart/form-data.Nothing shows up in nginx error and access logs. And there's no response from server as well.

Answer 1

Following fixes worked:

• deleting /etc/nginx/sites-enabled/default.
• previously nextjs was deployed as an app on digital ocean and it was not sending multipart/form-data requests. I redeployed it in a droplet and it worked.

EDIT : I figured out the real problem was with sending request. Previously the app was deployed on server-less platform. The workaround for sending multipart/form-data request to Server-less platform is mentioned here.

In my first answer as i mentioned i shifted app to server-based platform and the backend was also on the same droplet that's why the simple way worked.