Nginx Config For React and Node App Proxying to Wrong Path

Question

I've setup a server with an Nginx config for a React frontend and Node backend.

The Node app serves as an API for the react app. The node routes for /api/... are getting passed to the following path: /client/public/api/... This results in a 404.

I understand what may be adding this, I assume the root definition has the /client/public/ path definition. But cannot find a solution around it with the Nginx Config, attached below.

The /client/public/ part of the path string should not be in the uri of the request URL.

server {
  listen                80;
  server_name           www.domain.com;

  root                  /var/www/site_folder/client/public;

  index                 index.html;

  location ~* \.(jpg|jpeg|gif|css|png|js|ico|html)$ {
    access_log          off;
    expires             max;
  }

  location /api/(.*)$ {
    proxy_pass          http://localhost:5000;
  }

  location ~ /\.ht {
    deny                all;
  }
}

Ivan Shatsky · Accepted Answer · 2020-03-24T18:14:50.147

1

Try the following location block:

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

Do not miss the trailing slash of the proxy_pass directive parameter! You can find description of this construction behavior here.

edited Mar 24 '20 at 18:14

answered Mar 24 '20 at 16:39

Ivan Shatsky

2,726
2
7
19

So when Implement this I get the following in my error log: `[error] 27124#0: *1 open() "/var/www/example.com/client/public/api/session" failed (2: No such file or directory), client: 104.190.138.77, server: www.example.com, request: "POST /api/session HTTP/1.1", host: "example.com", referrer: "http://example.com/"` – jFasaJr Mar 24 '20 at 17:50
@JohnFasano Maybe I misunderstand your question. I thought your API requests looked like `example.com/client/public/api/some/path` and should be routed to `localhost:5000/api/some/path`. Are they looked like `example.com/api/some/path` and should be routed to `localhost:5000/some/path`? – Ivan Shatsky Mar 24 '20 at 18:00
The node app is in a /server/ folder, but when defining the domains root within /client/public/, the API calls are coming from /client/public/api/path. Both the /server and /client are at the same directory level. – jFasaJr Mar 24 '20 at 18:10
The request should be localhost:5000/some/path – jFasaJr Mar 24 '20 at 18:12
1

@JohnFasano Try the updated config, please. – Ivan Shatsky Mar 24 '20 at 18:15
Oh wow, that worked! THANK YOU! – jFasaJr Mar 24 '20 at 18:20

Nginx Config For React and Node App Proxying to Wrong Path

1 Answers1