Skip to content

[BE] Nginx 학습 정리

이승관 edited this page Dec 2, 2024 · 1 revision

기본 개념

  • 오픈소스 웹 서버 소프트웨어
  • 리버스 프록시, 로드 밸런서, 메일 프록시, HTTP 캐시로 사용
  • 가볍고 높은 성능을 제공
  • 이벤트 기반 비동기 아키텍처 사용

주요 특징

  1. 높은 성능
    • 이벤트 기반 처리로 적은 리소스로 많은 연결 처리
    • 작은 메모리 공간으로 높은 동시성 제공
  2. 안정성
    • 마스터 프로세스와 워커 프로세스 분리
    • 오류 발생 시 다른 프로세스에 영향 최소화
  3. 다양한 기능
    • 정적 파일 서빙
    • 리버스 프록시
    • 로드 밸런싱
    • SSL/TLS 종단
    • HTTP/2 지원
    • FastCGI 지원

리버스 프록시

기본 개념

클라이언트 <-> 리버스 프록시 서버 <-> 실제 서버(백엔드)

  • 클라이언트는 리버스 프록시 서버에만 요청을 보냄
  • 실제 서버의 존재를 클라이언트가 알 수 없음
  • 리버스 프록시가 요청을 받아서 적절한 내부 서버로 전달

주요 장점

  1. 보안 강화
    • 실제 서버의 IP 주소를 숨김
    • 직접적인 공격 위험 감소
    • SSL/TLS 종단점 역할
  2. 로드 밸런싱
    • 여러 서버에 트래픽 분산
    • 서버 부하 분산
  3. 캐싱
    • 자주 요청되는 콘텐츠 캐싱
    • 응답 시간 개선
    • 서버 부하 감소
  4. 압축
    • 응답 데이터 압축
    • 대역폭 사용량 감소

Mixed Content 에러

클라이언트 (HTTPS: 443) → 서버 (HTTP:3000)

  1. 프론트엔드는 HTTPS(443)로 서비스
  2. 백엔드 API는 HTTP(3000)로 서비스
  3. 브라우저의 보안 정책으로 인해 차단

이 에러를 해결하기 위해 Nginx를 도입했습니다.

# 1. 이벤트 블록: Nginx의 이벤트 처리 방식을 설정
events {
    # 워커 프로세스당 동시에 처리할 수 있는 연결 수를 1024개로 제한
    worker_connections 1024;
}

# 2. HTTP 블록: HTTP 관련 전역 설정
http {
    # mime.types 파일을 포함 (파일 확장자와 MIME 타입 매핑)
    include /etc/nginx/mime.types;
    # 기본 MIME 타입 설정
    default_type application/octet-stream;

    # 3. 서버 블록: 가상 호스트 설정
    server {
        # HTTP(80)포트 리스닝
        listen 80;
        # HTTPS(443)포트 리스닝, SSL 활성화
        listen 443 ssl;
        # 서버 도메인 이름 설정
        server_name corinee.site www.corinee.site;

        # 4. SSL 인증서 설정
        # Let's Encrypt 인증서 경로 설정
        ssl_certificate /etc/letsencrypt/live/corinee.site/fullchain.pem;
        # 프라이빗 키 경로 설정
        ssl_certificate_key /etc/letsencrypt/live/corinee.site/privkey.pem;

        # 5. 프론트엔드 설정
        location / {
            # 정적 파일이 위치한 루트 디렉토리
            root   /usr/share/nginx/html;
            # 기본으로 제공할 파일
            index  index.html index.htm;
            # SPA를 위한 라우팅 설정 (404 대신 index.html로 리다이렉트)
            try_files $uri $uri/ /index.html;
        }

        # 6. 백엔드 API 설정
        location /api {
            # 백엔드 서버로 요청 전달
            proxy_pass http://server:3000;
            # HTTP 프로토콜 버전 설정
            proxy_http_version 1.1;
            # 웹소켓 지원을 위한 헤더 설정
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection 'upgrade';
            # 원본 호스트 정보 전달
            proxy_set_header Host $host;
            # 프록시 캐시 무시 설정
            proxy_cache_bypass $http_upgrade;
            # 클라이언트 실제 IP 전달
            proxy_set_header X-Real-IP $remote_addr;
            # 프록시 서버 리스트 전달
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            # 현재 프로토콜(http/https) 전달
            proxy_set_header X-Forwarded-Proto $scheme;

            # 7. CORS 헤더 설정
            # 허용할 오리진 설정
            add_header 'Access-Control-Allow-Origin' 'https://www.corinee.site' always;
            # 허용할 HTTP 메서드 설정
            add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS' always;
            # 허용할 헤더 설정
            add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range,Authorization' always;
            # 브라우저에 노출할 헤더 설정
            add_header 'Access-Control-Expose-Headers' 'Content-Length,Content-Range' always;
        }
    }
}

💻 개발 일지

💻 공통

💻 FE

💻 BE

🙋‍♂️ 소개

📒 문서

☀️ 데일리 스크럼

🤝🏼 회의록

Clone this wiki locally