API 서버의 526 에러 코드 해결 방법

API 서버에서 발생하는 526 에러 코드는 SSL 설정과 관련된 문제로 인해 발생하는 경우가 많습니다. 이 글에서는 526 에러의 원인과 해결 방법에 대해 다루겠습니다.

526 에러의 원인

526 에러는 주로 Cloudflare와 원본 서버 간의 SSL 인증서 문제로 인해 발생합니다. 특히 Cloudflare에서 SSL 설정이 “Full SSL (Strict)”로 되어 있을 때, 원본 서버의 SSL 인증서를 확인할 수 없으면 이 에러가 발생합니다.

API 서버의 CORS 설정을 완료했더라도, 클라이언트와 서버 간의 통신이 불가능할 경우 526 에러와 함께 CORS 에러가 발생할 수 있습니다. 이 경우 원본 서버의 SSL 인증서 문제를 먼저 해결해야 합니다.

Cloudflare의 SSL 설정은 다음과 같이 총 4가지 옵션이 있습니다:

Full SSL (Strict): 원본 서버에 유효한 SSL 인증서가 필요함.
Full: 원본 서버에 SSL 인증서가 필요하지만, 유효성 검사는 하지 않음.
Flexible: 사용자 브라우저와 Cloudflare 간의 통신만 SSL 적용, Cloudflare와 원본 서버 간의 통신은 SSL 미적용.
OFF: SSL 미적용.

테스트 결과, Flexible 설정에서 React 서버와 연결이 가능했으나, API 서버와의 통신은 불가능했습니다. OFF 설정에서는 React 서버와 연결이 가능하고 API 서버와의 통신도 가능했습니다.

React 애플리케이션에 SSL 인증서를 적용하기 위해 다음 단계를 수행합니다:

Certbot 인증서 발급: Certbot을 사용하여 Let’s Encrypt 인증서를 발급받습니다.
sudo apt-get install certbot sudo apt-get install python3-certbot-dns-cloudflare
package.json 수정: React 애플리케이션의 package.json 파일에서 start 스크립트를 다음과 같이 수정합니다.
json "scripts": { "start": "HTTPS=true SSL_CRT_FILE=/etc/letsencrypt/live/myloa.co.kr/cert.pem SSL_KEY_FILE=/etc/letsencrypt/live/myloa.co.kr/privkey.pem react-scripts start", "build": "GENERATE_SOURCEMAP=false react-scripts build", "test": "react-scripts test", "eject": "react-scripts eject" }
SSL 적용 확인: 도메인으로 접속하여 SSL이 제대로 적용되었는지 확인합니다. 로컬 접속 시 인증서의 상세 화면을 통해 Cloudflare와 원본 서버 간의 SSL을 확인할 수 있습니다.

SSL이 잘 적용되었는지 확인하기 위해 로컬 접속을 통해 인증서 상세 화면으로 이동합니다. 이 과정을 통해 Cloudflare와 원본 서버 간의 SSL 적용 여부를 확인할 수 있습니다.

가장 먼저 Cloudflare의 SSL 설정을 확인하고, 원본 서버의 SSL 인증서가 유효한지 점검해야 합니다.

Certbot을 사용하여 SSL 인증서를 발급받고, React의 package.json 파일에 관련 설정을 추가합니다.

CORS 설정을 올바르게 구성한 후, SSL 문제를 해결해야 API 서버와의 통신이 원활해집니다.

SSL을 사용하지 않으면 데이터 전송 중 보안 문제가 발생할 수 있으며, 사용자 정보가 탈취될 위험이 있습니다.

브라우저를 통해 도메인에 접속 후 인증서 상세 정보에서 유효성을 확인할 수 있습니다.