[centos7] Node 배포하기, 리액트와 연결하기

centos7 환경에 개발한 노드를 배포하려한다

노드가 서버에 기본적으로 설치되어있다는 가정하에 진행하겠다

 

파질라 (FTP)로 이미 연결되어있어 이것으로 배포 파일을 옮기겠다.

우선 리액트를 배포할건데 npm run build 명령어로 빌드할 수 있다.

build 파일안에 소스들을 배포하면 된다.

 

리액트는 NGINX으로 실행되도록 하였다.

아래 글을 참고하여 설치하고 실행하면된다.

https://catnails.tistory.com/423

리액트 앱(ReactJs)와 엔진엑스(Nginx) 연동

 

이제 서버에서 node를 배포하고 실행하겠다.

package.json 와 실행할 node 파일들을 옮긴다.

npm install을 실행하면 package에 등록된 라이브러리를 해당 폴더에 설치시켜준다.

설치 후 실행 파일을 node ~.js 명령어를 실행하여 오류가 나는지 확인한다.

 

리액트, 노드 사이에 cors 정책으로 인해 방해되지 않도록 설정할 것이다.

NGINX 설정파일을 열어 아래와 같은 내용을 추가한다.

/api/~ 으로 접근을 허용한다는 설정이다

server {
    listen 80;
    
    location / {
        root /usr/local/front-app;
        index index.html index.htm;
        try_files $uri $uri/ /index.htm;
    }

    location /api/ {
        add_header 'Access-Control-Allow-Origin' '*';
        add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, DELETE, PUT';
        add_header 'Access-Control-Allow-Headers' 'Content-Type, Authorization';

        if ($request_method = 'OPTIONS') {
            add_header 'Access-Control-Allow-Origin' '*';
            add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, DELETE, PUT';
            add_header 'Access-Control-Allow-Headers' 'Content-Type, Authorization';
            return 204;
        }
    }
}

 

https://braindisk.tistory.com/40

nginx - 리버스 프록시로 스프링 CORS 문제 해결하기

 

만약 오류 없이 정상 실행되었다면, PM2으로 실행하게하여 서버가 껏다 켜져도 자동으로 켜지게 할 것이다.

pm2 start ~.js

오류 로그는 pm2 logs으로 확인할 수 있다.