REACT-BOOT Nginx 세팅(+CORS Handling)

danhyeon·2024년 4월 19일

Deploy

목록 보기
1/6

/etc/nginx/nginx.conf

user root;	-- (1)
worker_processes auto;
error_log /var/log/nginx/error.log notice;
pid /run/nginx.pid;

include /usr/share/nginx/modules/*.conf;

events {
    worker_connections 1024;
}

http {
    log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                      '$status $body_bytes_sent "$http_referer" '
                      '"$http_user_agent" "$http_x_forwarded_for"';

    access_log  /var/log/nginx/access.log  main;

    sendfile            on;
    tcp_nopush          on;
    keepalive_timeout   65;
    types_hash_max_size 4096;
    client_max_body_size 20M;

    include             /etc/nginx/mime.types;
    default_type        application/octet-stream;

    include /etc/nginx/conf.d/*.conf;

    server {
        listen       80; 		--(2)
        listen       [::]:80; 	--(2)
        server_name  _;

        include /etc/nginx/default.d/*.conf;	--(3)

        error_page 404 /404.html;
        location = /404.html {
        }

        error_page 500 502 503 504 /50x.html;
        location = /50x.html {
        }
    }
}

(1) - nginx가 가질 리눅스 유저 권한
(2) - ipv4/ipv6 포트 80번으로 들어오는 모든 요청 Listen
(3) - /etc/nginx/default.d 하위 경로에 있는 확장자 .conf에 해당하는 모든 파일 내용 불러옴

/etc/nginx/default.d/default.conf

location / {	--(1)
	root /home/ec2-user/fe/build;	--(2)
	index index.html;	--(3)
	try_files $uri /index.html;
}

location /api/ {	--(4)
	rewrite /api/(.*) /$1 break;	--(5)

	add_header 'Access-Control-Allow-Origin' '*' always;	--(6)
	add_header 'Access-Control-Allow-Methods' 'GET, POST, DELETE, PATCH, OPTIONS';
	add_header 'Access-Control-Max-Age' 86400;
	
	proxy_pass http://localhost:8080;	--(7)
	proxy_http_version 1.1;
	proxy_set_header X-Real-IP $remote_addr;
	proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
	proxy_set_header Host $host;
}

(1) - http://host/ 로 들어오는 모든 요청 에 대해 처리
(2) - 자원을 찾을 root 경로를 설정
(3) - 해당 경로에서 index.html 자원을 찾아 반환
(4) - http://host/api/로 들어오는 (WAS에 대한)요청에 한하여 처리
(5) - 백엔드 API는 /api라는 prefix를 사용하지 않기 때문에 해당 prefix를 제거
(6)
- CORS, 브라우저가 자원을 응답 받았을 때, Origin과 동일한 값을 가진 해당 헤더가 존재하면 Drop하지 않음
- ( * )는 모든 도메인을 의미 (권장하지 않음)
- 명시된 HTTP 메소드에 해당하는 요청에 대해 Allow
(7) - nginx(reverse proxy)가 받은 해당 요청을 넘겨 받을 목적지(WAS)

profile
문제를 반복하지 않기

0개의 댓글