SSL 보안 인증서 적용 후 워드프레스 이미지가 깨지는 문제 해결

워드프레스 사이트에 SSL 보안 인증서를 적용하고 주소를 http에서 https로 변경한 후에 이미지가 깨지는 문제의 해결을 맡았습니다. 일반적으로 이 문제는 DB에서 일괄적으로 URL을 변경하면 해결이 됩니다. 하지만 해당 사이트는 너무 오래되었고 DB에서 URL을 검색하면 검색이 되지 않는 이상한 현상이 발생하여 DB에서 수정을 하지 못하는 상황이 되었습니다.

SSL 보안 인증서 적용 후 워드프레스 이미지가 깨지는 문제 해결

SSL 인증서를 적용하고 사이트 주소를 http에서 https로 변경할 경우 이미지가 깨질 수 있습니다.

보통 이 문제가 발생하면 간단한 플러그인으로도 해결이 가능합니다. 예를 들어, Go Live Update Urls와 같은 플러그인을 사용하면 워드프레스 대시보드 내에서 URL을 일괄 변경할 수 있습니다. 

다양한 플러그인이 있으므로 플러그인을 활용하는 것을 고려할 수 있습니다. 다만, 플러그인을 사용하거나 phpMyAdmin에 접속하여 직접 URL을 변경하든, 먼저 DB 백업을 실시한 후에 진행할 것을 권장합니다.

문제의 사이트의 경우 조금 특히했습니다. 이미지 URL을 살펴보니 다음과 같이 이미지가 삽입된 곳은 이미지가 모두 엑박으로 표시되었습니다.

src="/example.49dev.kr/..."
src="/domain-name.com/..."

iwinv라는 호스팅에서 사이트가 호스팅되고 있었는데, 아마 위의 URL은 처음 가입 시에 부여받은 임시 도메인 주소인 것 같습니다. 그리고 아래 URL은 해당 사이트의 주소입니다.

임시 도메인 주소로 접속하면 DNS_PROBE_FINISHED_NXDOMAIN 오류로 인해 접속이 불가능했습니다.

이미지 URL에 src="/example.com..."과 같이 설정할 경우 상대주소로 인식하여 실제로는 https://example[.]com/example.com과 같이 인식하여 이미지가 깨지는 것 같습니다. src="//example.com..."과 같이 입력되면 문제가 발생하지 않을 것입니다. (실제로 테스트를 해보니 /를 //로 바꾸니 이미지가 잘 표시되는 것 같습니다.)

//로 바꿀 경우 혼합 콘텐츠(Mixed Content) 오류가 발생할 수 있다고 하므로 가장 바람직한 방법은 모든 이미지 주소가 src="https://example[.]com/..."가 같이 명시적으로 https://를 추가하는 것이 좋을 것 같습니다.

플러그인으로 일괄적으로 변경하려고 시도해보았지만, 플러그인에서 src="..." 부분을 인식하지 못하여 DB에서 일괄 변경을 시도해 보았습니다. 하지만 이상하게 DB에서 이미지 URL을 검색하면 검색이 되지 않았습니다. 또, DB를 수정하려고 시도하면 사이트가 깨지는 이상한 현상도 발생했습니다.

사이트를 살펴보니 워드프레스 버전이 4.4.33이었고, PHP 버전이 5.6.40으로 매우 낮았습니다.

사이트에 아바다 테마가 설치된 상태였는데, 버전이 3.8.8이었습니다.

아바다 3.8.8은 2015년 10월 27일에 릴리스되었습니다.

거의 10년 동안 업데이트 없이 이때까지 운영해 온 것 같습니다.

워드프레스는 보안에 강하지만 이처럼 업데이트를 하지 않고 방치하면 보안에 문제가 발생하여 멀웨어에 감염되거나 해킹될 가능성이 높으므로 가급적 워드프레스, 테마, 플러그인을 모두 최신 버전으로 업데이트하여 유지할 것을 권장합니다.

DB에서 모든 /example.49dev.kr/...과 /domain-name.com/...을 일괄 변경하고 싶었지만 URL 구조가 이상하여 일괄 변경하면 예상치 못한 오류가 발생할 가능성이 높아서 (그리고 이상하게 이러한 URL을 DB에서 검색해도 검색 결과에 나타나지 않았습니다) 다른 방법으로 문제를 해결했습니다.

국내 호스팅의 경우 카페24의 매니지드 워드프레스를 선택하면 SSL 보안 인증서가 무료로 제공됩니다. 클라우드웨이즈나 케미클라우드, 패스트코멧 등 해외호스팅은 오래전부터 SSL 인증서가 무료로 제공되어 왔습니다.

기존에 운영하던 사이트에 SSL 인증서를 적용할 경우...

1. 모든 http 주소를 https 주소로 일괄 변경하고
2. http 트래픽을 https 주소로 리디렉션 설정하시기 바랍니다.

클라우드웨이즈를 이용하는 경우에는 애플리케이션 설정에서 HTTPS 리다이렉트 기능을 활성화할 수 있습니다.

카페24의 경우 PHP 7.3과 PHP 7.4에서는 301 리디렉션이 지원되지 않는다고 하므로 PHP 8.2로 업그레이드하시기 바랍니다. PHP 버전을 변경하기 전에 반드시 데이터와 디비를 다운로드해야 합니다. 그렇지 않으면 PHP 버전 변경 후에 사이트를 복구할 수 없는 재앙이 발생할 수 있습니다.

https://avada.tistory.com/3640

카페24에서 SSL 인증서 설치 후 http → https 리디렉션 설정 오류 (feat. 그누보드)

 

👉 워드프레스나 웹호스팅 관련 문제의 해결에 어려움을 겪는 경우 여기에서 서비스(유료)를 의뢰하실 수 있습니다.

참고

https://avada.tistory.com/3621

카페24 뉴아우토반 호스팅: SSL 보안 인증서

https://avada.tistory.com/3458

블루호스트에서 멀웨어 치료 및 클라우드웨이즈로 워드프레스 이전 작업