HTTPS로 로드된 브라우저에서 HTTP 리소스를 로드하려고 할때 주로 발생한다.
우리 프로젝트에서도 HTTPS서 api를 HTTP로 요청을 보낼때 발생. 프론트에서 vercel 배포후 api 요청을 보
니 Mixed-content 에러가 발생함.
vercel은 자동으로 HTTPS로 배포가 되고 백엔드는 HTTP로 배포되서 생긴 현상.
해결하기 위해 아래와 같이 시도했다.
<meta
http-equiv="Content-Security-Policy"content="upgrade-insecure-requests"/>
처음 겪는 이슈라 프론트에서 해결할 수 있는 방법인가? 라는 생각이 들었다.
meta 태그를 적용시키면 모든 HTTP 리소스 요청을 HTTPS로 변경하려고 시도한다.
하지만 이 방법은 올바르지 않은 방법이라고함.
이 이슈를 백엔드에게 알리고 백엔드 서버를 HTTPS로 활성화 하여 재배포후 위의 에러를 해결하였다.