Nginx로 웹 서비스 구동하기
기본적으로 모든 경로 접속 했을 때, 빌드된 HTML, JS, CSS 를 반환 할 수 있게 할 것이다.
단, /api 로 시작하는 경로로 접속 했을 경우는 koa로 연결 할 수 있는 reverse proxy 환경을 구축 할 것이다.
네트워크 기술에서 프로토콜에 대한 대리응답하는 개념으로 알려져있다.
주로 보안상의 이유로 직접 통신을 할 수 없는 단말을 이어주는 중계서버의 역할을 한다
A ↔ proxy ↔ B
위에서 프록시는 A 와 B를 중계하는 역할을 하게 된다.
클라이언트와 서버 측에서 볼 땐 서로 상반된 개념을 띈다.
클라이언트에서는 프록시 서버가 마치 서버로 보이게 되며 반대로 서버 측에서는 프록시 서버가 클라이언트로 보이게 되는 것이다.
프록시는 단순 보안상의 이유로만 사용하는 것이 아니다. 프록시 서버에 요청된 내용들을 캐시에 저장하여 동일한 요청이 왔을 때 원격 서버에 접속 없이 바로 리턴하여 속도를 높이는 효과도 있다. 이로써 불필요한 트래픽을 줄일 수 있다.
Forward 프록시
클라이언트 호스트들과 접근하고자 하는 원격 서버 사이에 위치한다.
원격서버로 요청된 리소스를 요청한 클라이언트에게 돌려주는 역활을 한다. 클라이언트는 사용하고 있는 브라우저에 프록시 서버 사용 설정을 해야하기 때문에 자신이 프록시 서버를 이용하고 있다는 것을 인지 할 수 있다.
이 방식은 대여폭을 감소 시키는 것과 접근 정책 구현에 있어 비용이 저렴하다는 것이다. 클라이언트들이 접근할 수 있는 사이트를 제한할 수 있으므로 기업의 인트라망에 이용되기도 한다.
Reverse 프록시
외부에서 내부가 제공하는 서비스 접근시, Proxy 서버를 먼저 거쳐서 내부로 들어오는 방식이다.
해당 방식은 사용자 입장에서는 내가 Proxy 서버를 이용하여 접근 하고 있는 것을 인지 할 수 없다. 그렇기 때문에 외부에서 접근에 있어서 내부 서버를 보호 할 수 있다.
또한, Proxy가 내부 서버의 정보를 알고 있기 때문에 로드밸런싱을 통해 서버의 부하를 줄일 수 있다.
server {
listen 80;
server_name localhost;
location / {
root /home/rolled/Project16-A-Account-Book/fe/build;
index index.html index.htm;
try_files $uri /index.html;
}
location /api/ {
proxy_pass http://127.0.0.1:4000/api/;
}
}해당 설정 파일은 Project-Account-book 에 적용된 파일을 가져온 것이다.
- listen ← 접근 포트를 지정하는 부분이다. 우리는 http 웹 서버를 구축 할 것이기 때문에 80으로 지정하였습니다.
- server_name ← 서비스의 도메인, IP 주소를 적으면 된다.
- location / ← 제어 할 경로를 적고 아래에 제어 할 정보를 적는 부분이다. 우리 프로젝트는 React를 사용하기 때문에 내부 JS가 주소에 따른 렌더링을 할 예정이라 하나만 지정을 하였다.
root: 해당 경로로 접속 했을 때 반환 할 파일 경로 이다.index: 해당 경로에서 가져갈 파일 이름이다.try_files: React이기 때문에 모든 경로에 대한 라우팅은 내부 JS 가 한다. 그렇기 때문에 어떤 경로든지 root의 파일을 접근 할 수 있게 하기 위해 설정 하였다. - location /api/ ← API 서버로 요청하는 경로로 설정하였다.
만약 경로가 /api/ 로 시작한다면 해당 설정을 따르겠다는 의미가 된다.
현재 우리는 서버가
4000번 포트를 사용 하고 있기에 위와 같이 설정 하였다.