[Nginx] 502 error

배포작업

 

React

build 폴더를 home/ubuntu 에 위치시키고

/etc/nginx/sites-available에 있는 default를 다음과 같이 수정하였다.

server_name 만 있으면 react화면이 나오고 server_name 뒤에 /api를 붙히면 api server로 접속된다.

 

front단은 배포가 되어서 접속이 잘된다..

그런데 server로부터 데이터받아오는 부분에서 502 error가 난다.

 

/api/ 의 proxy_pass 부분을 어떻게 설정해줘야할 지 모르겠다..

1. localhost:5000/api

2. 127.0.0.1:5000/api

3. (server_name):5000/api

 

api뒤에/를 붙히는 것도 해봤고 location /api/에서 뒤에/도 빼봣다..

 

기존에 local에서 작업했을 때 client-package.json에서 설정한 proxy가 문제된 것 같아서 지워보기도 했다..

 

Node js는

pm2를 이용해서 ubuntu에서 실행하였다....

localhost:5000/api로는 데이터를 받을 수 있었다... 

 

 

해결방법

 

일단, ubuntu서버와 nginx, proxy에 대한 이해가 부족했고

둘째로 proxy 설정에서 문제가 있었다.

 

기존 local에서 개발한 환경은

client : localhost:3000

server : localhost:5000/api

으로 진행했었다.

 

이를 배포할때, 주소를 따로 변경할 필요가 없다.

localhost가 ubuntu 서버의 주소로 변경된다.

 

두번째로 개발할때 설정한 proxy 설정이 문제가 있었다.

 

react script의 버전이 2이하일 경우에 설정했던 방법인데, local에서는 문제없이 실행되었었다.

배포해보니 502 error가 발생하였는데,

package.json에서 proxy 추가하는 방법말고 

setupProxy.js 파일을 생성하여 proxy 설정 방법을 변경해서 해결하였다.