DEV WIKI
인프라 · 문제 해결 가이드

HTTPS 적용 뒤 이미지나 스크립트가 표시되지 않아요

HTTPS 적용 뒤 이미지·스크립트·API가 표시되지 않을 때 브라우저 Console과 Network의 Mixed Content 관찰값을 기준으로 다음 Problem을 고르는 가이드입니다.

빠른 답변

HTTPS 페이지에서 HTTP 리소스가 차단됐는지 먼저 확인하고, 차단된 URL과 리소스 유형을 기록한 뒤 Mixed Content 진단 문서로 이동해야 합니다. 화면 문구와 실제 응답 상태가 다르면 별도로 구분합니다.

적용 범위
이 가이드의 시작 증상과 각 분기 조건이 일치하는 경우
출처 확인일
2026-08-04
최종 검토
2026-08-04
수정일
2026-08-04
대상
사이트 운영자, 쇼핑몰 운영자, 웹 에이전시, 프리랜서
오류·수정 제보 (새 창에서 열림)

이 가이드가 맞는 경우

  • 애플리케이션 오류 메시지
  • 서버 5xx 응답

상황별 다음 단계

호스팅사·개발자에게 전달할 내용

변경 전 기록

  • 페이지 주소와 차단된 하위 리소스 URL·리소스 유형·확인 시각을 전달합니다.
  • Console의 Mixed Content 문구와 Network의 요청 상태·차단 이유를 전달합니다.
  • 비밀번호, 인증 토큰, 세션 쿠키, 결제 정보, 개인정보는 전달하지 않습니다.

알아둘 점

“HTTPS로 바꾼 뒤 이미지가 안 보여요”, “스크립트가 실행되지 않아요”, “Mixed Content가 떠요”처럼 검색하는 상황에서 사용합니다. 먼저 브라우저 Console·Network에서 HTTP 하위 리소스가 차단됐는지 확인하고, 화면 문구와 실제 응답 상태가 다를 때만 별도 Problem으로 이동합니다.

먼저 기록할 것

  1. 페이지 주소와 문제가 발생한 이미지·스타일·스크립트·iframe·API 요청의 URL을 기록합니다.
  2. Console의 Mixed Content 문구와 Network의 요청 상태·차단 이유를 기록합니다.
  3. 최근 HTTPS 전환, CDN·WordPress·카페24 스킨·외부 스크립트 변경 시각을 기록합니다.
  4. 쿠키·토큰·개인정보가 포함된 URL은 기록 전에 값을 가립니다.

상황별 다음 단계

관찰값다음 문서
HTTPS 페이지가 HTTP 리소스를 요청하고 브라우저가 차단함Mixed Content 리소스 차단
화면 문구와 Network 응답 상태가 서로 다름화면 오류 문구와 실제 HTTP 상태 불일치

HTTP 403·500이 보인다는 이유만으로 Mixed Content로 분류하지 않습니다. 해당 상태가 실제 요청에 대한 응답이면 HTTP 상태 코드 Problem을 별도로 확인합니다.

수정 후 재확인

외부 리소스의 공식 HTTPS 주소를 적용한 뒤 같은 페이지를 새로 엽니다. Console의 Mixed Content 차단이 사라졌는지, Network에서 요청 URL이 HTTPS이고 응답이 정상인지, 이미지·스타일·스크립트·API 기능이 각각 동작하는지 확인합니다.

참고 자료

혼합 콘텐츠 - 웹 보안 | MDN (새 창에서 열림)

MDN Web Docs (Mozilla) · 공식 자료 · 확인 범위: HTTPS 페이지가 HTTP 리소스를 요청하는 상태의 정의, 브라우저가 리소스 유형에 따라 업그레이드하거나 차단하는 동작, 개발자 콘솔과 실제 리소스 URL을 확인하는 방법 · 확인일: 2026-08-04