How to connect my NodeJS with my Angular (in Nginx)

Question

I've a repo with angular and nodejs. I performed in jenkins:

# install globally
npm install -g bower
npm install -g gulp

# install
bower install
npm install

# build dist folder
gulp build

Now I have in my root:

Dockerfile.nginx  Dockerfile.nodejs  README.md  bower.json  dist  gulp.config.js  gulpfile.js  node_modules  package.json  server.js  src

I'm copying the dist folder inside my nginx container. So I'm hosting the angular. (with a dockerfile)

FROM nginx
# copy folder
COPY dist /usr/share/nginx/html/dist

I'm copying: gulp.config.js gulpfile.js node_modules server.js to my nodejscontainer. (also with a dockerfile)

FROM node

# Create app directory
RUN mkdir -p /usr/src/www
WORKDIR /usr/src/www 

# copy 
COPY node_modules /usr/src/www/
COPY gulpfile.js /usr/src/www/
COPY gulp.config.js /usr/src/www/
COPY server.js /usr/src/www/

 EXPOSE 8080
CMD [ "node", "server.js" ]

I run the 2 containers but the nginx does not communicate with the nodejs

EDIT1: Start containers:

docker run -d -p 8888:8888 --name "nodejs" localhost:5000/test/nodejs:1

docker run -d -p 80:80 --name "nginx" localhost:5000/test/nginx:1

EDIT2: My nginx.conf looks like this:

http {

        upstream node-app {
              least_conn;
              server nodejs:8888 weight=10 max_fails=3 fail_timeout=30s;
        }

        server {
              listen 80;
              location /dist {
                alias /usr/share/nginx/html/dist/;
               }

              location ~* /api {
              #location / {
                proxy_pass http://node-app;
                proxy_http_version 1.1;
                proxy_set_header Upgrade $http_upgrade;
                proxy_set_header Connection 'upgrade';
                proxy_set_header Host $host;
                proxy_cache_bypass $http_upgrade;
              }
        }
}

My server.js looks like:

app.get('/api/hello', requestProxy({
  url: xxx + "/hello"
}));

Answer 1

You need to expose the port of the node.js container to which nginx(angular) container will connect. See the Connect using network port mapping section of docker documentation.

Update : I think, you need to configure the nginx configuration file to the node container. This question has sample nginx file related to your use case (although, not related to containers).

Edit : To map the node app with the nginx, you first need to link the node container with nginx container.

docker run -d -p 80:80 --name "nginx" --link nodejs:nodejs localhost:5000/test/nginx:1

When you link the node container with the nginx container, the node container's address will be saved in the /etc/hosts. So the nginx container can access the node's address from there.

So, in nginx configuration file, the nodejs will be accessible as nodejs' container address:

http {

        upstream node-app {
              server nodejs:8888 weight=10 max_fails=3 fail_timeout=30s;
        }

        server {
              listen 80;

              location / {
                proxy_pass http://node-app;
                proxy_http_version 1.1;
                proxy_set_header Upgrade $http_upgrade;
                proxy_set_header Connection 'upgrade';
                proxy_set_header Host $host;
                proxy_cache_bypass $http_upgrade;
              }
        }
}

Answer 2

One solution is to link both containers as described in @manish's answer.

But be aware that this is the legacy way of connecting containers together.

---

From now on, you can use the new docker network feature to create a virtual network and connect both containers to that network:

docker network create mynetwork
docker run -d --net=mynetwork -p 8888:8888 --name "nodejs" localhost:5000/test/nodejs:1
docker run -d --net=mynetwork -p 80:80 --name "nginx" localhost:5000/test/nginx:1

With such a setup, your nginx config file must use

server nodejs:8888 weight=10 max_fails=3 fail_timeout=30s;

as you now refer to other container by their name.