MAC 로컬 개발 환경 셋팅 - SSL 인증된 https 도메인 적용하기

개발을 하다보면 로컬 환경에서 https도메인으로 테스트를 해야하는 경우가 있습니다.

( 예를 들면,, 애플 로그인 테스트..... )

 

매번 배포해서 테스트를 하기에는 귀찮음이 이만저만이 아니죠.

 

우린 귀찮기에 행동하는 개발자이기에 로컬에서도 https로 셋팅하여 개발하도록 하죠.

 

1. 준비물

• Homebrew 설치
• Nginx 설치
• mkcert 설치
• 원하는 도메인 이름

2. Nginx 설치

brew install nginx

3. mkcert 설치

brew install mkcert

4. 인증서 생성

cd /opt/homebrew/etc/nginx
mkdir ssl
cd ssl 
mkcert {원하는도메인 ex. local.alpeca.co.kr} localhost 127.0.0.1

5. Nginx 설정 파일 편집

sudo vi /opt/homebrew/etc/nginx/nginx.conf

다음 내용을 추가합니다.

server {
	listen 443 ssl default_server;
    listen [::]:443 ssl default_server;

    ssl_certificate /opt/homebrew/etc/nginx/ssl/local.alpeca.co.kr+2.pem;
    ssl_certificate_key /opt/homebrew/etc/nginx/ssl/local.alpeca.co.kr+2-key.pem;

    ssl_session_cache       shared:SSL:1m;
    ssl_session_timeout     5m;

    ssl_ciphers     HIGH:!aNULL:!MD5;
    ssl_prefer_server_ciphers       on;

	server_name _;

    location /api/ {
    	# /api/ 경로에 대한 rewrite 설정
        rewrite ^/api(/.*)$ $1 break;
        proxy_pass http://127.0.0.1:8080; # /api/* 경로를 8080 포트로 프록시합니다.
        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;
    }

    location / {
    	proxy_pass http://127.0.0.1:5173; # 80 포트를 5173 포트로 프록시합니다.
    	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;
    }
}

6. Nginx 재시작

sudo nginx -s reload

7. Host 설정하기

sudo vi /etc/hosts

127.0.0.1       local.alpeca.co.kr

---

 

이제 https://local.alpeca.co.kr로 접속을 하시면 로컬환경에서도 https로 테스트가 가능합니다!

궁금한 점이나 문제가 발생하면 언제든 댓글을 남겨주세요.