혼합 콘텐츠 오류를 해결하여, 방문자의 웹 브라우저가 HTTPS를 통해 제공되는 HTTP 리소스를 차단하지 않도록 하세요.
개요
Cloudflare에 추가된 도메인은 SSL 인증서를 받으며 HTTPS를 통해 트래픽을 처리할 수 있습니다. 하지만 Cloudflare를 사용하기 시작한 후 처음 HTTPS 트래픽을 처리할 때는, 일부 고객에게 콘텐츠 없음이나 페이지 렌더링 문제가 발생하기도 합니다.
일반적으로 HTTPS를 통해 제공되는 웹 페이지에서 HTTP 리소스를 요청하기 때문에 문제가 발생합니다. 예를 들어, 사용자가 브라우저에 https://example.com을 입력했는데, 페이지에는 HTML 형식의 HTTP를 통해 <img src="http://example.com/resource.jpg">를 참조하는 이미지가 있는 경우입니다.
일반적으로 웹사이트가 HTTPS를 통해 안전하게 모든 리소스를 로드하면 방문자 브라우저의 주소 표시줄에 자물쇠 아이콘(일반적으로 녹색)가 나타납니다.
이것은 사이트에 유효한 SSL 인증서가 있으며 사이트가 로드한 모든 리소스가 HTTPS를 통해 로드됐다는 것을 의미합니다. 녹색 자물쇠는 방문자에게 연결이 안전하다는 것을 보장합니다. 혼합 콘텐츠 증상에는 녹색 자물쇠 아이콘 대신 다른 아이콘이 나타나는 것이 있습니다.
혼합 콘텐츠 발생 시 증상
대부분의 최신 브라우저는 안전한 HTTPS 페이지에서 HTTP 요청을 차단합니다. 차단된 콘텐츠에는 이미지, JavaScript, CSS 또는 페이지 외관과 행동에 영향을 줄 수 있는 기타 콘텐츠가 포함될 수 있습니다.
다음은 요청된 웹사이트에 대해 브라우저에 혼합 콘텐츠가 있다는 것을 보여줍니다.
-
Firefox
URL 옆에 노랑 삼각형은 주의를 의미합니다.
-
IE(버전 10)
“보안 콘텐츠만 표시”라는 경고 메시지가 나타납니다.
-
Microsoft Edge
“안전한 콘텐츠만 보고 있습니다”라는 경고 메시지가 나타납니다.
-
Chrome
URL 옆에 정보 또는 경고 기호가 나타납니다.
혼합 콘텐츠 경고가 나타나면 웹 브라우저가 리소스를 로드하지만 URL에 녹색 자물쇠 아이콘이 표시되지 않습니다. 브라우저의 디버그 도구에 경고 메시지가 나타납니다.
혼합 콘텐츠 오류가 발생하면, 브라우저는 안전하지 않은 연결을 통한 리소스 로드를 거부합니다.
브라우저의 디버그 도구를 사용하여 이러한 문제를 파악하는 방법은 Chrome 및 Firefox 문서를 참조하시기 바랍니다. 또는 페이지 소스를 보고 다른 리소스의 경로에 대한 구체적인 http:// 참조를 찾을 수 있습니다.
문제 해결
혼합 콘텐츠 오류를 해결하는 방법은 두 가지가 있습니다.
1. HTTP 또는 HTTPS 프로토콜을 지정하지 말고 HTML 소스를 통해 모든 리소스를 로드하세요. 다음 예와 같이 하세요.
http://domain.com/path/to.file
대신
//domain.com/path/to.file
2. 콘텐츠 관리 시스템에 따라, 자동으로 HTTP 리소스를 HTTPS에 다시 쓰는 플러그인이 있는지 확인하세요. Cloudflare는 SSL/TLS 앱의 에지 인증서 탭 내에서 자동 HTTPS 다시 쓰기를 통해 그러한 서비스를 제공합니다.