search

ghkdqhrbals / portfolio

React기반 포트폴리오 페이지 프로젝트입니다.
0 stars 0 forks source link

NGINX Error with 502 Bad Gateway in EC2(AWS) #7

Closed ghkdqhrbals closed 2 years ago

ghkdqhrbals commented 2 years ago

ERROR

nginx | 164.125.222.37 - - [26/Jul/2022:08:23:30 +0000] "GET / HTTP/1.1" 502 157 "-" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/15.5 Safari/605.1.15" "-"

Docker containers

CONTAINER ID IMAGE COMMAND CREATED STATUS PORTS NAMES 78c1220d18c4 portfolio_nginx "/docker-entrypoint.…" 5 minutes ago Up About a minute 0.0.0.0:80->80/tcp, :::80->80/tcp nginx 5d78cbb01830 portfolio_client "docker-entrypoint.s…" 5 minutes ago Up About a minute client

ghkdqhrbals commented 2 years ago

In my desktop,

Docker containers

CONTAINER ID IMAGE COMMAND CREATED STATUS PORTS NAMES 97911f43ff87 react-portfolio-website_client "…" 26 minutes ago Up 8 minutes client 256b592d3a35 react-portfolio-website_nginx "…" 26 minutes ago Up 8 minutes 0.0.0.0:80->80/tcp nginx

And listen ports

gyuminhwangbo@Gyuminui-MacBookPro react-portfolio-website % lsof -i :80
COMMAND PID USER FD TYPE DEVICE SIZE/OFF NODE NAME Kite 727 gyuminhwangbo 24u IPv4 0x9a7e8ab200a061ed 0t0 TCP 192.168.0.36:59859->hkg12s36-in-f14.1e100.net:http (ESTABLISHED) com.docke 1083 gyuminhwangbo 121u IPv6 0x9a7e8ab1ff4b83e5 0t0 TCP *:http (LISTEN)

There are only difference in ports
EC2 0.0.0.0:80->80/tcp, :::80->80/tcp nginx DESKTOP 0.0.0.0:80->80/tcp nginx

When i run test in nginx(EC2)

ubuntu@ip-172-31-7-36:~/portfolio$ sudo docker port nginx 80/tcp -> 0.0.0.0:80 80/tcp -> :::80

When i run test in nginx(DESKTOP)

gyuminhwangbo@Gyuminui-MacBookPro react-portfolio-website % docker port nginx
80/tcp -> 0.0.0.0:80

What is meaning of 80/tcp -> :::80?

ghkdqhrbals commented 2 years ago

:::80 is ipv6 localhost:80 !!!

ghkdqhrbals commented 2 years ago

Case Solved!

In your React project, package.json exists like below.

"scripts": { "start": "react-scripts start", "build": "react-scripts build", "test": "react-scripts test", "eject": "react-scripts eject" },

Here, "start": "react-scripts start" start your React project with 3000 port by default.

Thus, if we want to run server with port 3400, we should also change default port as well as in Dockerfile

Edit Dockerfile in React project folder(client).

FROM node:18-alpine3.16 RUN mkdir /app WORKDIR /app

ENV PATH /app/node_modules/.bin:$PATH

COPY package.json /app/package.json RUN npm install --production

CMD ["/app/start.sh"] << ADDED COPY .env /app/.env << ADDED

CMD ["npm", "start"]

Make start.sh

This file makes .env file which has text PORT="3400"

!/bin/sh

set -e

echo "make .env with PORT=$PORT" echo "PORT=$PORT" > .env