I have a project which contains 3 containers : reverse proxy container (jwilder-nginx-proxy image), fontend container (nginx container serving an application developed and bundled by Vue js) and a backend container (a node6 container serving a NodeJs+ExpressJs app). Both Backend and frontend are behind the reverse proxy. Here is how it should work in my local host:
Everything seems to be working perfectly fine, Except for the backend container. When I try to access the backend, I get a '502 bad gateway' error. here is what nginx logs:
2017/12/19 06:47:28 [error] 6#6: *3 connect() failed (111: Connection
refused) while connecting to upstream, client: 172.22.0.1, server: ,
request: "GET /favicon.ico HTTP/1.1", upstream:
"http://172.22.0.3:3000/favicon.ico", host: "localhost:3500", referrer:
"http://localhost:3500/"
In my backend Dockerfile i used this:
EXPOSE 3000
And here is my docker-compose.yml file:
version: '3'
services:
api:
image: myapp/api
restart: always
networks:
- myapp_network
gui:
image: myapp/gui
restart: always
networks:
- myapp_network
reverse:
image: nginx-reverse
depends_on:
- api
- gui
ports:
- 80:8080
- 3500:3500
restart: always
volumes:
- /var/run/docker.sock:/tmp/docker.sock
networks:
- myapp_network
networks:
myapp_network:
driver: bridge
Same goes for the gui, which is an nginx server listening to 8080 inside of the container and mapped to port 80 outside of it, i used this in the Dockerfile :
EXPOSE 8080
I believe that something is wrong with my nginx.conf file (the one I used to configure the reverse proxy not the GUI app) :
nginx.conf (reverse proxy config):
http
{
sendfile on;
upstream myapp-api
{
server api:3000;
}
server
{
listen 3500;
add_header Access-Control-Allow-Origin * always;
add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
add_header 'Access-Control-Allow-Headers' 'Content-Type';
gzip_types text/plain text/css application/json application/x-javascript
text/xml application/xml application/xml+rss text/javascript;
location /
{
proxy_pass http://myapp-api/;
proxy_redirect off;
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-Host $server_name;
}
}
upstream myapp-gui
{
server gui:8080;
}
server
{
listen 8080;
add_header Access-Control-Allow-Origin * always;
add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
add_header 'Access-Control-Allow-Headers' 'Content-Type';
gzip_types text/plain text/css application/json application/x-javascript
text/xml application/xml application/xml+rss text/javascript;
location /
{
proxy_pass http://myapp-gui;
proxy_redirect off;
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-Host $server_name;
}
}
}
Is there something wrong in my docker-compose file ? or the nginx config ? I used the same logic for both Frontend and Backend. Only the backend's not working. The Frontend is working.
I didnt use the expose directive in the Dockerfile of the nginx-reverse-proxy, as I'm mapping the ports in the compose file.
Hope someone can help me out.
Thank you
EDIT : It seems that everything is configured well. problem is the node js app. Seems like Nginx cant handle requests to a nodejs app... anone can help ?
To everyone having the same problem, here is the solution: