Skip to content

react nginx 연결 방법 reverse proxy는 이제 그만

Published by armada on 2018-07-19

nodejs를 서비스할 때 nginx의 reverse proxy를 이용하는 것은 이제 필수가 됐다.

하지만 react(이하 SPA 방식의 웹 서비스)는 reverse proxy를 이용할 이유가 없다.
react는 웹 콘텐츠가 전부다.
nodejs 없이 nginx에서 바로 서비스할 수 있다.

nodejs가 나쁘지 않은 웹 서버 역할을 제공 하지만 nginx가 제공하는 멀티쓰래딩과 강력한 케싱 기능을 능가할 수 없다.

따라서 nginx -> nodejs로 갈 필요 없이 그냥 nginx에서 서비스하면된다.

아래 nginx설정으로 nginx -&ampgt nodejs로 reverse proxy 하는 설정이다.


 location / {
            proxy_http_version 1.1; 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-Proto $scheme;
            proxy_set_header    Upgrade $http_upgrade;
            proxy_set_header    Connection "upgrade"; proxy_pass http://localhost:8080/;
            proxy_read_timeout  90;
    }

이 부분을 아래와 같이 수정하면 된다.


location / {
    try_files $uri /index.html =404;
  }

이 설정으로 nginx에서 react를 콘텐츠를 읽어 바로 서비스하게 된다.

$uri 경로는 react가 빌드 된 경로(보통 public이나 build 디렉터리)를 지정하면 된다.

Published inNodeJs