게으른 개발자의 끄적거림

Mixed content 해결 방법 (feat. 타 블로그)

끄적잉 2023. 4. 3. 23:13
반응형

Mixed content(혼합 콘텐츠)란 ?

최초 HTML이 안전한 HTTPS 연결을 통해 로드될 때 혼합 콘텐츠가 발생하지만 다른 리소스(예: 이미지, 동영상, 스타일시트, 스크립트)는 안전하지 않은 HTTP 연결을 통해 로드 됩니다. 이는 HTTP 콘텐츠와 HTTPS 콘텐츠가 함께 로드되어 동일한 페이지를 표시하므로 혼합 콘텐츠라고 하는데, 최초의 요청은 HTTPS 연결을 통해 보안 처리되었습니다. 최신 브라우저는 이 유형의 콘텐츠에 대한 경고를 표시하여 해당 페이지에 보안되지 않은 리소스가 포함되어 있음을 사용자에게 알려 줍니다.

Mixed Content (혼합 콘텐츠)로 인해 HTTPS의 약화

보안되지 않은 HTTP 프로토콜을 사용하여 하위 리소스를 요청하는 경우 해당 요청은 공격자가 네트워크 연결을 도청하고 양자 간 통신을 보거나 수정하는 수단인 중간자(man-in-the-middle) 공격에 취약하므로 전체 페이지의 보안이 약화됩니다. 공격자는 해당 리소스를 사용하여 손상된 자원뿐만 아니라 페이지를 완전히 제어할 수 있습니다.

대부분의 브라우저가 혼합 콘텐츠 경고를 사용자에게 보고하지만 그때는 너무 늦습니다. 보안되지 않은 요청이 이미 수행되었고 해당 페이지의 보안이 손상되었기 때문입니다. 불행하게도 이 시나리오는 웹에서 흔히 발생하는데, 대부분의 사이트의 기능을 제한하지 않고는 모든 혼합 요청을 차단할 수 없기 때문입니다.

 

 

URL 부분에서 수정하는 방법

Step 1.
https://를 https:// 로 변경하고 https를 통해 사용 가능한지 확인

브라우저에서 새 탭을 열고 주소 표시줄에 URL을 입력하고 http://를 https://로 변경하여 HTTPS를 통해 해당 URL을 사용할 수 있는지 확인합니다.

HTTP와 HTTPS를 통해 표시된 리소스가 동일한 경우 아무 이상이 없습니다. 2단계로 진행합니다.

 

Step 2.
URL를 http://에서 https://로 변경 하고 원본파일을 저장하고 필요한 경우 업데이트 파일을 다시 배포 합니다.


Srep3.
오류를 찾은 처음 페이지를 보고 오류가 더이상 나타나지 않는지 확인

 

 

 

웹 서비스에서 수정하는 방법

웹 서비스에서 소스에 적용하는 방법으로는 다음과 같은 META 태그를 헤더에 추가하여, http 콘텐츠를 자동으로 https로 변환하여 로딩하도록 하는 방법이 있습니다.

 

 

<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">

 

위 META 태그를 적용한 경우에 있어서, 웹 서비스가 이루어지는 호스와 다른 서버에서 불러오는 리소스에 대해서는 주의해야할 점이 있습니다.
리소스가 저장된 별도 서버에서 https가 반드시 지원이 되어야만 문제가 없습니다. 만약 별도 리소스를 위한 서버에서 https가 지원이 되지 않는다면 근본적으로 보안상 서비스가 불가합니다.

이를 해결하기 위해서는 다음과 같은 방법들을 적용해 볼 수 있습니다.

  • https가 지원되는 다른 서버의 동일한 리소스를 활용하는 방법
  • 필요한 리소스들을 직접 다운로드하여 웹 서비스와 동일한 호스트에서 직접 서비스 하는 방법
  • 해당 리소스를 제외하고 서비스를 구성하는 방법

 

 

 

 

 

 

 

 

참고자료 : 

 

https://cert.crosscert.com/%EF%BB%BFhttps-%ED%81%AC%EB%A1%AC%EA%B3%BC-%ED%8C%8C%EC%9D%B4%EC%96%B4%ED%8F%AD%EC%8A%A4-%ED%98%BC%ED%95%A9-%EC%BB%A8%ED%85%90%EC%B8%A0mixed-content-%EC%B0%A8%EB%8B%A8/

 

HTTPS - 크롬과 파이어폭스, 혼합 컨텐츠(Mixed Content) 차단 - SSL 인증서 발급,종류,가격비교 | 한국

Chrome 및 Firefox 는 보안성 향상 및 https로 전환을 유도하기 위해 혼합 콘텐츠 차단에 대한 일정을 발표 했습니다 Mixed content(혼합 콘텐츠)란 ? 최초 HTML이 안전한 HTTPS 연결을 통해 로드될 때 혼합

cert.crosscert.com

https://hbesthee.tistory.com/1923

 

Mixed content 문제 해결 방법

문제점 및 증상 잘 접속이 되던 웹 서비스가 https를 적용한 이후, 갑작스럽게 접속에 문제가 발생하기 시작하였습니다. 특정 리소스들이 모두 불러와지지 않고 화면이 깨지는 현상이 발생하였습

hbesthee.tistory.com

 

반응형

'게으른 개발자의 끄적거림' 카테고리의 다른 글

OSI 7계층이란?  (0) 2023.04.06
forward sendredirect 비교  (0) 2023.04.05
URL 인코딩/디코딩  (0) 2023.03.30
String Method 간단 예제(substring, replace, indexOf 등)  (0) 2023.03.29
향상된 for문 예제  (0) 2023.03.27