혼합 콘텐츠 경고 및 WordPress SSL 설정 해결

게시 됨: 2017-04-03

혼합 콘텐츠 경고 및 WordPress SSL 설정 해결

유능한 웹 사이트를 만들려면 사이트 소유자, 사이트를 만드는 데 고용된 사람, 사이트 관리자 또는 관리자, 가장 중요한 청중 등 다양한 문제를 고려해야 합니다.

일반적으로 대부분의 온라인 쇼핑객과 사용자는 온라인 보안에 대해 점점 더 우려하고 있습니다. SSL 인증서는 의미 있는 모든 전자 상거래 상점이나 웹사이트에 필수 형식이 되었습니다.

사실, 웹사이트가 PCI를 준수하도록 규정된 조건 중 하나입니다. 온라인 사용자는 기밀 정보를 사이트와 공유하기 전에 "HTTPS"와 같은 SSL 인증서의 신호, 자물쇠 아이콘 및 확장된 SSL 인증서에 대한 녹색 막대를 찾습니다.

온라인에서 성공하려면 귀하의 보안과 사이트 방문자의 보안을 모두 관리해야 합니다. 아무도 "사이트 다운" 오류 메시지나 웹 브라우저 경고를 보고 싶어하지 않습니다. SSL 인증서로 사이트를 보호하는 것만으로는 충분하지 않습니다. 웹 브라우저나 웹 서버에서 제대로 구성되었는지 확인해야 합니다.

이 기사의 목적은 보안 웹 페이지를 제공하고 스크립트 이미지 및 양식과 같은 자산을 보호하고 브라우저 보안 오류를 찾아 해결하는 방법을 보여 주는 것입니다.

HTTPS 기본

Hypertext Transfer Protocol Secure 또는 HTTPS는 인터넷을 통한 보안 통신에 사용됩니다. HTTPS를 사용하는 페이지에 액세스할 때마다 URL에 https://가 표시되고 브라우저에 잠금 아이콘이 표시됩니다.

비밀번호, 신용 카드 번호 및 기타 민감한 사용자 정보와 같은 기밀 정보는 HTTPS를 사용하여 안전하게 제출해야 합니다. HTTPS 브라우징을 활성화하려면 웹 서버에 SSL 인증서를 구매하여 설치해야 합니다.

캐싱을 위해 HTTPS 양식을 포함하면서 페이지는 HTTP를 통해 계속 제공될 수 있습니다. 이것의 단점은 사용자가 보안 사이트(자물쇠 아이콘 및 녹색 막대 주소)와 관련된 신호를 볼 수 없다는 것입니다.

가장 중요한 것은 양식, 스크립트 및 이미지와 같은 HTTP 자산이 포함된 웹 페이지가 HTTPS를 통해 제공될 때 브라우저에서 경고를 표시한다는 것입니다. 브라우저 경고 메시지는 일부 사이트 방문자에게 경보를 울리고 거래를 완료하지 않거나 양식을 작성하지 못하게 할 수 있습니다.

워드프레스 HTTPS

서버에 SSL 인증서를 성공적으로 설치한 후 WordPress 사이트에 HTTPS를 구현해야 합니다. 다음은 프로세스를 진행하는 3가지 유효한 방법입니다.

옵션 1: 모든 페이지를 HTTPS로 강제 설정

모든 페이지를 HTTPS로 강제 설정하는 것이 가장 쉬운 옵션입니다. 그러나 HTTPS 페이지에 대해 캐싱이 활성화되어 있지 않으므로 적절하지 않습니다. WordPress 일반 설정으로 이동하여 HTTPS를 통해 WordPress의 모든 페이지를 제공하고 WordPress 주소(URL) 및 사이트 주소(URL)를 HTTP에서 HTTPS로 변경할 수 있습니다.

옵션 2: 개별 페이지를 HTTPS로 제한(가장 일반적)

대부분의 경우 HTTPS를 통해 로드해야 하는 민감한 정보가 포함된 페이지가 몇 개 있고 SSL 인증서가 필요하지 않은 나머지 페이지는 기본적으로 HTTP를 통해 로드됩니다.

서버 측을 사용하여 이를 활성화하거나 확인란을 제공하는 플러그인을 사용할 수 있습니다. 플러그인을 사용하면 HTTPS로 페이지를 로드하거나 HTTP 로드를 위해 선택하지 않은 상태로 두면 상자를 쉽게 선택할 수 있습니다. 이러한 플러그인의 좋은 예는 다음과 같습니다.

  • 워드프레스 HTTPS(SSL)
  • 더 나은 WP 보안

옵션 3: HTTPS 로그인 강제 또는 HTTPS 로그인과 HTTPS 관리 모두 강제 실행

로그인 페이지는 피싱과 같은 사이버 공격으로부터 보호되어야 합니다. 그렇기 때문에 로그인 페이지와 관리자 페이지를 보호하는 것이 이상적입니다. 다음 두 가지 wp-config.php 상수를 설정하여 로그인 및 관리 페이지에서 HTTPS를 강제 실행할 수 있습니다.

  • 정의('FORCE_SSL_LOGIN,' true);
  • 정의('FORCE_SSL_ADMIN,' true);

FORCE_SSL_ADMIN 상수를 설정하면 FORCE_SSL_LOGIN이 포함되어 있으므로 별도로 설정할 필요가 없습니다.

HTTPS 페이지에서 HTTP 자산 식별

다음은 여러분이 기다려온 기사의 중요한 부분입니다.

  1. SSL 인증서를 이미 올바르게 설치했으며 주소 표시줄에 수동으로 입력하여 HTTPS를 통해 탐색할 수 있는 경우 그리고
  2. HTTPS 플러그인 및 a/orwp-config.php 상수가 설정되고 작동합니다.
  3. 브라우저에 "안전하지 않은 콘텐츠" 또는 "암호화되지 않은 콘텐츠 경고"가 표시되어야 합니다.

그런 다음 웹 사이트에 HTTPS가 아닌 콘텐츠가 있음을 증명합니다. 다음은 혼합 콘텐츠에 대한 브라우저 보안 경고를 해결하는 몇 가지 방법입니다.

1. 소스 보기

이 방법의 경우 HTTPS를 통해 페이지를 로드하고 페이지의 아무 곳이나 마우스 오른쪽 버튼으로 클릭합니다. 브라우저에 따라 "페이지 소스 보기", "소스 보기" 또는 "소스"를 클릭합니다.

"찾기" 명령(편집 -> 찾기 또는 Ctrl+F 또는 Cmd+F)을 사용하여 다음을 검색합니다.

src="http:

(큰따옴표 포함)

src='http:

(작은 따옴표 포함)

이 방법을 사용하면 HTTPS 대신 HTTP를 통해 제공되는 이미지, iframe, 스크립트 및 기타 자산을 수동으로 찾고 있습니다. 큰따옴표와 작은따옴표로 된 항목을 찾지 못하면 다른 HTTPS 페이지로 이동하여 소스 보기를 통해 검색할 때와 동일한 연습을 반복할 수 있습니다.

2. 플러그인 사용

사용 가능한 플러그인을 사용하여 소스를 보고 다음과 같이 페이지에서 HTTP가 아닌 콘텐츠를 찾을 수 있습니다.

  • WordPress HTTPS(SSL)(위에서도 언급됨)
  • 워드프레스 HTTPS 테스트
  • SSL 안전하지 않은 콘텐츠 해결사

활성 상태에서 이러한 플러그인을 사용하여 HTTPS를 통해 사이트를 탐색하면 플러그인은 HTTP 자산에 대한 알림을 표시합니다. 일부 플러그인은 관리자에게만 표시되고 다른 플러그인은 모든 방문자에게 경고를 표시하므로 테스트하지 않는 동안 플러그인을 활성 상태로 두지 않도록 주의하십시오.

3. 제3자 웹사이트를 사용하여 안전하지 않은 자산 테스트

귀하의 페이지 URL을 제3자 웹사이트에 붙여넣고 테스트하도록 함으로써 제3자 웹사이트를 사용하여 안전하지 않은 자산을 테스트할 수 있습니다.

이러한 타사 사이트의 좋은 예는 ''Why No Padlock?''입니다. Why No Padlock은 안전하지 않게 로드된 모든 항목의 목록을 제공하는 무료 테스트 사이트입니다. 테마 또는 플러그인에서 모든 빨간색 X를 수정한 다음 "URL 다시 테스트" 버튼을 클릭하여 빨간색 X를 완전히 제거해야 합니다.

4. Google을 사용하여 웹사이트 검사

Google을 사용하는 것은 빠르고 쉽고 액세스할 수 있는 모든 페이지에서 사용할 수 있기 때문에 최고의 방법 중 하나입니다. Chrome의 Inspector에는 콘솔 탭이 있습니다. HTTPS 페이지가 주소 표시줄에 노란색 또는 빨간색으로 표시되면 아래 두 번째 및 세 번째 열에서 볼 수 있듯이 콘솔을 열어 안전하지 않은 자산을 찾으십시오.

구글 인스펙션

안전하지 않게 로드된 자산을 수정하는 방법

테마 또는 플러그인을 유지하기로 결정한 경우 다음 방법을 사용하여 수정할 수 있습니다.

  1. 플러그인 개발자에게 연락하여 오류를 보고하세요. 플러그인을 비활성화해야 합니다.
  2. 개발자의 도움을 받아 일부 파일을 수정하거나 문제를 해결할 수 있습니다.
  3. 웹사이트의 테마를 변경하면 도움이 될 수 있습니다.
  4. 현재 설치된 테마의 파일을 수정할 수도 있습니다.

HTTP에서 HTTPS로 자산 변경

문제가 되는 자산을 찾은 후 프로토콜을 준수하도록 변경하거나 다음과 같이 항상 HTTPS에서 제공하도록 변경할 수 있습니다.

1: 상대 URL 사용

자산이 테마 또는 플러그인으로 하드 코딩된 경우 'http: //site.com/assets/logo.png'에서 '//site.com/assets/logo.png'로 변경할 수 있습니다.

이 수정은 API 스크립트, iframe 또는 Google 스크립트와 같은 다른 서버의 자산을 포함할 때 이상적입니다.

2: 적절한 WordPress 코딩 표준 사용

마지막으로 일부 완고한 오류는 상대 URL을 사용하여 해결할 수 없습니다. 다음 방법으로 오류를 해결할 수 있습니다.

  • home_url() 및 관련 함수
  • is_ssl()
  • WordPress 함수 참조(빨간색은 더 이상 사용되지 않으므로 피하세요)
  • WP_DEBUG 택시도 도움이 됩니다.