NGINX Proxy Manager와 CloudFlare를 이용한 웹 개발 테스트 환경 구성하기

NPM은 Docker를 기반으로 하여 설치할 수 있습니다. 아래와 같은 방법으로 설치를 진행합니다:
1. NPM 데이터 파일을 저장할 폴더를 생성합니다.
2. 해당 폴더 내에 docker-compose.yml 파일을 작성합니다.
3. 다음 명령어로 Docker 서비스를 실행합니다:
$ docker-compose up -d
4. 설치가 완료되면 http://localhost:81로 접속하여 초기 계정으로 로그인합니다.

초기 로그인 정보

이메일: admin@example.com
비밀번호: changeme

CloudFlare DNS 설정

개인 도메인 설정

CloudFlare와 연동된 개인 도메인을 설정합니다. 개발 서버의 사설 IP 주소를 확인한 후, CloudFlare의 DNS 관리 페이지에서 다음과 같이 A레코드를 추가합니다:
– 서브도메인: 개발 서버의 사설 IP 주소를 입력합니다.
– 프록시 기능은 해제한 뒤 저장합니다.

API Token 발급

SSL 인증서 발급 시 DNS Challenge를 사용하기 위해 API Token을 발급받아야 합니다. CloudFlare의 API 토큰 생성 페이지에서 다음 설정을 진행합니다:
1. 토큰 이름 및 권한 설정 (영역, DNS, 편집).
2. 생성된 토큰은 한 번만 표시되므로 안전하게 보관합니다.

NGINX Proxy Manager Reverse-Proxy 설정

이제 NPM에서 Reverse Proxy 설정을 진행합니다.
1. http://localhost:81에 접속하여 로그인한 후 “Proxy Hosts” 메뉴로 이동합니다.
2. “Add Proxy Host”를 선택하여 아래 정보를 입력합니다:
– Domain Names: CloudFlare DNS에서 등록한 서브도메인
– Forward Hostname / IP: 등록한 사설 IP 주소
– Forward Port: 개발 서버의 포트 번호
– Scheme: http로 설정

SSL 인증서 요청

SSL 설정에서 “Request a new SSL Certificate”를 선택하고 다음 옵션을 활성화합니다:
– Force SSL
– HTTP/2 Support
– Use a DNS Challenge (CloudFlare 선택 후 API Token 입력)

모든 설정이 완료되면 저장 버튼을 클릭하여 Reverse Proxy를 생성합니다.

실전 활용법 및 주의사항

이제 모든 설정이 완료되었습니다. 같은 로컬 네트워크 내의 디바이스는 CloudFlare에 연결된 개인 도메인의 서브도메인으로 접근할 때 동일한 개발 서버에 연결됩니다.

주의사항: 네트워크 환경이 변경되면 개발 서버의 IP 주소가 변경될 수 있으므로, CloudFlare의 A레코드 및 NPM의 Forward Hostname / IP를 반드시 업데이트해야 합니다.

자주 묻는 질문

질문1: SSL 인증서 발급이 실패할 경우 어떻게 해야 하나요?

SSL 인증서 발급 시 DNS Challenge를 활성화해야 합니다. 문제가 지속되면 CloudFlare 설정을 다시 확인해보세요.

질문2: 개발 서버의 사설 IP 주소가 변경되면 어떻게 하나요?

서버의 IP 주소가 변경되면 CloudFlare의 A레코드와 NPM의 Forward Hostname / IP를 업데이트해야 합니다.

질문3: NGINX Proxy Manager의 기본 설정은 어떻게 하나요?

초기 로그인 후, 기본 설정에서 필요한 도메인과 포트를 설정한 후 SSL 인증서를 요청해야 합니다.

질문4: Docker 및 docker-compose 설치는 어떻게 하나요?

Docker와 docker-compose 설치방법은 공식 문서를 참고하거나 관련 포스트를 확인하시기 바랍니다.

질문5: 여러 플랫폼의 OAuth 로그인 테스트는 어떻게 하나요?

동일한 도메인과 SSL 적용을 통해 다양한 디바이스에서 OAuth 로그인을 테스트할 수 있습니다.

이전 글: 현대카드 슈퍼매치 14 티켓팅을 위한 공식 사이트 방문 가이드