클라우드플레어 CDN 설정(Pro 플랜)

ℹ️이 콘텐츠에는 광고가 포함되어,판매 발생 시 수익이 발생합니다.(네이버 쇼핑 커넥트, 아마존 어필리에이트, 애드센스 등)

클라우드플레어 CDN을 예전에 사용했었는데 최근 다른 워드프레스 사이트에 재 연결을 하게 되었습니]다. 캐시 플러그인은 현재 사이트와 동일한 조건으로 세팅했는데 무료 플랜은 속도가 현재 사이트에 근접하지 못하고 오히려 느린 결과를 보였습니다.(현재 사이트는 클라우드플레어 CDN이 적용되지 않은 상태입니다)

원래 사이트처럼 동일하게 세팅해서 속도를 높일까 고민하다가 Pro플랜으로 업데이트 했습니다. 확실히 업데이트 후 현재 사이트보다 조금 느리지만 미세한 차이라 크게 신경 쓸 필요도 없고 모바일 페이지는 구글 페이지스피드에서 현재 사이트보다 더 안정적이 점수(95~99)를 보였습니다.

솔직히 무료 플랜은 추천하지 않습니다. 한국에서 접속 시 오히려 한국에 있는 원본 서버보다 상당히 느린 속도가 나오기 때문입니다. 해외 방문자도 있는 웹사이트를 만들 계획이라면 Pro 플랜이나 다른 업체의 CDN이나 해외 호스팅을 알아 보는게 더 나은 선택이란 생각이 듭니다.

✅ 클라우드플레어 초기 세팅

무료 플랜부터 DNS 등록 후 사용할 수 있으며 설정 방법은 안내 메뉴에 따라 간단하게 진행할 수 있습니다.

클라우드플레어 도메인 DNS 등록

Pro 플랜 기준으로 설정 방법에 대해 알아 보겠습니다.

1. DNS 연결 후 계정 홈 화면

우측 상단의 추가를 눌러서 다른 도메인 계정을 추가할 수 있습니다.

클라우드플레어 계정 홈

2. 세팅 된 도메인의 계정 화면

도메인을 클릭해서 접속하면 사용하는 도메인 계정의 메인 화면을 확인할 수 있습니다.

클라우드플레어 계정 화면-기본 세팅

좌측 SSL/TLS, Speed, caching, 규칙, 네트워크를 기본 세팅 방법에 대해 알아 보겠습니다.

✅ 클라우드플레어 CDN 세팅

무료 플랜에서는 설정 가능한 기능만 활성화하여 이용하시면 됩니다. 페이지 내 설명서에 충분히 적혀 있는 내용들은 추가로 설명드리지 않겠습니다. 개인적으로는 차후에 다른 사이트 설정 시 활용의 목적도 있기 때문입니다.

1. SSL/TLS 설정

1.1 SSL/TLS 암호화

전체 암호화 모드는 전체(엄격)으로 설정합니다.

클라우드플레어 TLS 암호화-전체(엄격)

1.2 에지 인증서

와일드카드 SSL을 무료 플랜부터 지원해 주는 것을 확인했습니다.

클라우드플레어 에지 인증서

이 페이지에서 활성화 할 부분은 다음과 같습니다.

  • 항상 HTTPS 사용 활성화
  • 최소 TLS 버전
  • 편의적 암호화
  • TLS 1.3
  • 자동 HTTPS 다시 쓰기
  • Encrypted Client Hello
1.2.1 활성화 고려할 것
  • HSTS(HTTP 엄격한 전송 보안)
    • HSTS 설정 같은 경우는 가장 중요한 조건이 와일드카드 SSL 사용인데 혹여 CDN 업체나 호스팅 업체를 바꾸게 되면서 와일드카드 SSL이 아닌 일반 SSL을 사용할 경우 HSTS 설정 상태에서 웹사이트가 열리지 않습니다. 그렇기 때문에 클라우드플레어를 계속 사용한다거나 와일드카드 SSL을 유지할 수 있다는 확신이 있을 때 활성화를 진행해야 합니다.

2. Speed – 최적화

2.1 이미지 최적화

클라우드플레어 이미지 최적화

2.2 콘텐츠 최적화

클라우드플레어 콘텐츠 최적화1
클라우드플레어 콘텐츠 최적화2

2.3 프로토콜 최적화

클라우드플레어 프로토콜 최적화1
클라우드플레어 프로토콜 최적화2

2.4 기타

클라우드플레어 기타 최적화-자동 서명된 교환(SXG)

다른 웹사이트나 CMS들 역시 반응형을 사용하지 AMP 기반으로 사용하는 것 같지 않습니다. AMP URL을 최적화 할 일은 그리 많지 않을 것 같습니다.

3. Caching

3.1 구성

캐싱 수준은 표준으로 설정했습니다. 정적 콘텐츠의 캐싱을 담당하며, 클라우드플레어에서는 표준 설정을 권장합니다. HTML을 캐싱하진 않기 때문에 페이지 규칙을 생성해야 합니다.

클라우드플레어 Caching 구성1

브라우저 캐시 TTL 같은 경우에는 1개월로 설정했습니다. 사용 중인 워드프레스 사이트에서 글을 새로 쓰거나 수정, 그리고 테마 수정 등을 한 이후 워드프레스 캐시 플러그인이 해당 페이지의 캐시를 초기화 해 주면서 클라우드플레어의 캐시도 초기화 해주기 떄문입니다.

애드센스 광고는 브라우저 캐시와 별개로 실시간으로 로드되어 TTL을 길게 잡아도 무관한 것을 체크했습니다. 짧게 잡아도 1일, 5일인데 이미 문제가 있었겠죠.

클라우드플레어 Caching 구성2
클라우드플레어 Caching 구성3

3.2 Cache Rules

Cache Rules 설정


먼저 HTML 캐시를 설정합니다. 설정 후 사이트에 문제가 있을 경우 삭제하고 캐시 초기화를 진행합니다.

Cache Rules HTML 캐시 설정

▼ 로그인 페이지의 경우 캐시되지 않도록 캐시 우회 설정을 합니다.

Cache Rules 캐시 우회 설정

▼ 마지막으로 WebP, jpg와 같은 이미지 파일 및 PDF 등의 파일 확장자 캐시 설정을 합니다.

Cache Rules 확장자 캐시 설정(이미지, PDF 등의 파일)

3.3 Tiered Cache

계층형 캐시를 설정합니다.

클라우드플레어 Tiered Cache

Cache Rules 설정이 완료 되었습니다. 현재는 Pro 요금 기준 25개의 캐시 룰 중에 3개 룰만 적용했지만 시간이 날 때 유용한 룰이 있다면 추가할 예정입니다.

클라우드플레어 Cache Rules 설정 완료

4. 규칙

4.1 Page Rules

클라우드플레어 규칙-Page Rules

차후 적절한 규칙이 있다면 추가 예정입니다.

클라우드플레어 규칙-Page Rules2

4.2 Snippets

“웹 사이트 또는 응용 프로그램을 동적으로 맞춤화하는 짧고 강력한 JavaScript입니다.”라고 적혀 있고 차후에 사이트를 잘 유지한다면 제대로 쓸 수 있을지 모를 기능들도 보였습니다.

클라우드플레어 규칙-Snippets

4.3 설정

이해 가는 부분들은 설정하고 불필요하거나 알아보지 않은 설정들은 활성화 시키지 않았습니다.

4.3.1 관리되는 변환

TLS 클라이언트 인증 헤더 추가는 속도에 영향을 줄 것으로 예상되어 미사용으로 유지했으며, 방문자 위치 헤더 활성화 이유는 방문자의 국가, 도시 등을 기반으로 맞춤형 콘텐츠 표시(언어 및 맞춤 광고 등)에 유효한 것으로 판단되기 때문입니다.

클라우드플레어 규칙 - 관리되는 변환
4.3.2 URL 정규화
클라우드플레어 규칙 - URL 정규화

수신 URL 정규화는 외부에서 들어오는 URL이 다를 경우 동일하게 처리하여 정규화 하는 것을 의미합니다.

https://example.com/page
https://example.com/page?utm_source=google

보안 강화, 불필요한 중복 방지 및 SEO와 캐싱 최적화에 도움이 되는 부분으로 확인되어 활성화를 유지합니다.

5. 네트워크

클라우드플레어 네트워크 설정1
클라우드플레어 네트워크 설정2
클라우드플레어 네트워크 설정3

크게 어려운 건 없었지만 정리하는데 생각보다 시간이 오래 걸리는군요. 차후 다른 워드프레스 사이트 세팅이나 현재 세팅한 페이지의 설정한 내역을 확인할 때 이 포스트를 참고할 예정입니다.

Similar Posts

  • 워드프레스 테마 확인(&플러그인) 감지 사이트

    사이트가 xe 또는 워드프레스로 만들어졌는지 궁금할 때가 있습니다. 개인적으로 xe보다는 더 많은 확장이 가능한 플러그인과 많은 종류의 테마, 그리고 더 안정적인 사이트 및 서버 관리가 가능한 워드프레스가 더 관리하기 편하다고 생각합니다. 워드프레스 테마 확인 사이트에 대해 알아보겠습니다. 왜냐하면 워드프레스 블로그를 운영하다 보면, 다른 워드프레스로 운영되는 홈페이지는 어떤 플러그인과 어떤 테마를 사용하는지 궁금할 때가…

  • On page SEO: 온페이지 SEO 정의 및 10가지 체크 리스트

    목차✅ 클라우드플레어 초기 세팅1. DNS 연결 후 계정 홈 화면2. 세팅 된 도메인의 계정 화면✅ 클라우드플레어 CDN 세팅1. SSL/TLS 설정2. Speed – 최적화3. Caching4. 규칙5. 네트워크 온페이지 SEO란 무엇인가? 온페이지 SEO(On-page SEO or On-site SEO)는 검색엔진과 사용자를 위해 웹페이지의 콘텐츠를 최적화 하는 SEO를 의미합니다. 온페이지 SEO란 웹 페이지 내에서 행해지는 SEO라고 할 수…

  • DOM(Document Object Model) 구조와 정의

    대부분의 웹페이지는 HTML로 구성되어 있지만, 우리가 브라우저에서 상호 작용하는 것은 단순한 정적인 HTML 문서가 아닙니다. 웹페이지는 브라우저에 의해 DOM(Document Object Model)이라는 구조화된 객체 모델로 변환되며, 이 DOM을 통해 JavaScript는 페이지의 내용을 읽고 수정할 수 있습니다. DOM은 웹의 핵심 작동 원리이자 프로그래밍 가능한 웹의 뼈대입니다. 버튼 클릭, 폼 입력, 실시간 데이터 변경 등 우리가…

  • 글로벌 SEO 비교 사이트 4군데

    글로벌 SEO 비교 사이트를 찾고 있다면 SimilarWeb, Ahrefs SEMrush, Moz와 같은 인기있는 웹사이트를 추천합니다. 이 사이트들은 트래픽 및 키워드 순위 정보를 제공하여 전 세계적인 SEO 분석을 가능케 합니다. 이 중에서 웹사이트 순위 정보도 제공하는 사이트는 SimilarWeb, Alexa, SEMrush와 같은 사이트들입니다. 이러한 사이트들은 글로벌 SEO 분석에 도움이 되는 강력한 도구로, 인기와 신뢰성이 높습니다. 목차✅…

  • 아이폰 캘린더 스팸 삭제 방법(아이폰XR기준)

    아이폰 사용 중에 아이폰 캘린더 구독에 이상한 알람이 오는 경우가 있습니다. 지속적으로 캘린더에 악성 메시지가 이벤트 알람으로 지속적으로오는 경우인데 아이폰 캘린더 스팸 삭제를 해야 합니다. 원인은 문제가 있는 웹사이트 등에 접속 후 알람이 뜨는 것이며 바이러스에 걸린 것이라고까지 볼 필요는 없습니다. 목차✅ 클라우드플레어 초기 세팅1. DNS 연결 후 계정 홈 화면2. 세팅 된…

  • [SEO]구글 판다(Google Panda)

    구글 판다(Google Panda) 알고리즘은 2011년 2월에 출시된 구글의 검색 순위 결정 알고리즘입니다. 판다의 초기 출시 후 영어 검색 결과에 12%의 영향력을 주었던 판다의 목적은 “낮은 품질의 사이트” 및 “빈약한 콘텐츠의 사이트”의 순위를 낮추는 것이 목표였습니다. 또한 다수의 프리렌서 작가를 고용하거나 자동화 된 도구를 이용해서 검색 알고리즘을 충족해서 웹 콘텐츠를 생성하는 회사의 순위를 낮추는…

답글 남기기

이메일 주소는 공개되지 않습니다. 필수 필드는 *로 표시됩니다

Prove your humanity: 6   +   4   =