Question

React app isn't able to connect to backend API using Nginx and Docker.

Hello

I’m trying to make my dockerized React app served by Nginx to connect to backend using the proxy_pass configuration in nginx.conf file and it keep throwing below error.

2021/03/03 23:41:35 [error] 28#28: *1 connect() failed (111: Connection refused) while connecting to upstream, client: 172.21.0.1, server: 127.0.0.1, request: "POST /authentication/login/ HTTP/1.1", upstream: "http://127.0.0.1:5000/login/", host: "127.0.0.1:8888", referrer: "http://127.0.0.1:8888/login"

Both API backend and containerized React app are running on local. React is running on http://127.0.0.1:8888 and the API is running on http://127.0.0.1:5000.

My nginx.conf file is looking like below

upstream api_server {
  server 127.0.0.1:5000;
}

server {
  charset UTF-8;
  listen 80;
  root /usr/share/nginx/html;
  index index.html index.htm;

  server_name 127.0.0.1;

  location /authentication/ {
    proxy_pass http://api_server/;
  }

  location / {
    try_files $uri /index.html;
  }

  error_page   500 502 503 504  /50x.html;

  location = /50x.html {
    root   /usr/share/nginx/html;
  }
}

I’ve tried different variations of above, but same results. Can anybody suggest me how to resolve this issue?

Subscribe
Share

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

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.

Hi there,

It sounds like that the containers might not be connected to one Docker network. You need to make sure that you create a Docker network, and attach all of the containers to that network.

Feel free to share your docker-compose.yaml file here so I could try to advise you further.

Regards, Bobby