Question

Serving React frontend and Flask backend with Nginx reverse proxy

I’ve been trying to set up a React frontend and a Flask backend using Nginx as a reverse proxy to differentiate the two. I have the flask backend running a Gunicorn server on localhost:5000, but I can’t seem to get the Nginx location block to register it. My config file looks like this:

server {
  listen 80;
  root /var/www/[react-app-domain-name]/html;
  index index.html index.htm;

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

  location / {
    try_files $uri $uri/ = 404;
  }

  location /api {
    include proxy_params;
    proxy_pass http://localhost:5000;
  }
}

My understanding is that this should route all traffic through my react app at root, except for requests that have “/api”, which should then be routed through my backend Flask api. However, when I try to access a /api route, all I get back is a 404 response. This also happens if I true to access it through curl on the command line.

Here’s the 404 error log that I have:

2020/09/09 21:03:05 [crit] 36926#36926: *114 connect() to unix:/home/[name]/backend/backend.sock failed (2: No such file or directory) while connecting to upstream, client: 127.0.0.1, server: , request: "GET /api/ HTTP/1.0", upstream: "http://unix:/home/[name]/backend/backend.sock:/api/", host: "[hostname]"

Any help would be very much appreciated. I’m tearing my hair out here. Thanks.


Submit an answer

This textbox defaults to using Markdown to format your answer.

You can type !ref in this text area to quickly search our full set of tutorials, documentation & marketplace offerings and insert the link!

Sign In or Sign Up to Answer

These answers are provided by our Community. If you find them useful, show some love by clicking the heart. If you run into issues leave a comment, or add your own answer to help others.

Want to learn more? Join the DigitalOcean Community!

Join our DigitalOcean community of over a million developers for free! Get help and share knowledge in Q&A, subscribe to topics of interest, and get courses and tools that will help you grow as a developer and scale your project or business.

Hi,

Jumping right in, does this file exist on the file system?

/home/[name]/backend/backend.sock

If that file doesn’t exist, then you need to figure out what should be running to create it.

If it does exist, then the nginx user might not have permission to access the parent directory.

Hope this helps… if you have more details or run into new errors please let us know - good luck!