HTTPS에서 HTTP로의 요청: CORS 에러와 해결방안 (정부데이터)

joyoung·2023년 6월 8일
1

정부 데이터 API 요청시 CORS 에러가 발생하였습니다.

CORS ( Cross-Origin Resource Sharing )
직역하면 교차 원본 리소스 공유 라고 합니다

브라우저가 리소스 로드를 허용해야 하는 자체 원본이 아닌 원본 (도메인, 구성표 또는 포트) 을 서버가 나타낼 수 있도록 하는 HTTP 헤더 기반 메커니즘입니다.

클라 - 서버 통신에서의 문제가 아닌
즉 cors는 브라우저 정책임을 인지. 브라우저는 크롬 ,사파리 ,폭스 등
브라우저 보안 정책임을 인지하는게 중요

CORS 에러가 발생하는 이유를 알아봅시다

1. https -> http로 통신 또는 http-> https로 통신 하는 경우

이는 브라우저가 판단하기에 서로 다른 출저로 간주 이를 혼합 콘텐츠 (Mixed Content) 로 치부하여 브라우저에서 차단시키고 cors 에러를 표시합니다

2. 서버 cors 허용 설정을 하지 않았을 경우 경우

서버에서 특정 도메인 , 포트 , 프로토콜에 대해 cors 요청을 허용하려면 http응답 헤더에 Access-Control-Allow-Origin 에 해당 도메인을 추가시켜줘야 합니다.

저는 1번 항목에서 정부 API는 요청이 실패했습니다
이를 로컬 HTTPS 환경에서 http에 요청하였기 때문

로컬 개발 환경에서 고군분투 끝에 vite 프록시 옵션을 통해
개발환경에서 통신은 해결 하였지만, 실제 넷리파이 빌드 배포시에는 어째서 인지 이 옵션이 적용이 되질 않았습니다...

결국 백엔드 에서 http 통신하여 하여 이 문제를 해결하였습니다.

용어 설명

HTTP

HTTP는 HyperText Transfer Protocol의 약자로, 인터넷에서 데이터를 주고받기 위한 통신 규약입니다.
웹 브라우저와 웹 서버 사이에서 클라이언트-서버 모델을 기반으로 데이터를 전송하는 데 사용됩니다.

HTTPS

HTTPS(보안 HTTP)는 HTTP의 보안 버전으로, HTTP에 암호화 계층을 추가한 프로토콜입니다. HTTPS는 SSL(Secure Sockets Layer) 또는 TLS(Transport Layer Security) 프로토콜을 사용하여 클라이언트와 서버 간의 통신을 암호화합니다.
이를 통해 데이터의 기밀성과 무결성을 보호하고, 중간에 제3자가 데이터를 도청하거나 조작하는 것을 방지할 수 있습니다.
HTTPS는 주로 웹 사이트에서 개인 정보와 민감한 정보를 전송할 때 사용됩니다.

CORS

CORS(Cross-Origin Resource Sharing)는 웹 브라우저에서 동작하는 보안 메커니즘입니다. 웹 애플리케이션은 보안 상의 이유로 스크립트를 실행하는 도메인과 리소스를 요청하는 도메인이 일치해야 합니다.
하지만, CORS는 도메인이 다른 경우에도 리소스 요청을 허용하는 방법을 제공합니다.

profile
꾸준히

0개의 댓글