Настройка Cloudflare для WordPress: пошаговая инструкция

Click here to view original web page at oddstyle.ru

Cloudflare, выступающий в качестве обратного прокси-сервера для вашего сайта – универсальный продукт для обеспечения безопасности и производительности, который используют более 12% сайтов по всему миру. Установка Cloudflare на WordPress-сайт позволяет повысить производительность ресурса и снизить влияние злоумышленников и ботов.

Как именно это сделать?

После грамотной настройки все запросы к вашему сайту сначала будут попадать на сервер Cloudflare, который затем определит, следует ли направить запрос на исходный сервер, вывести материалы из кэша, блокировать запрос или обработать по произвольным правилам.

В данном руководстве мы подробно рассмотрим оптимальные настройки Cloudflare для WordPress и поговорим о настройках кэширования и безопасности.

Настраиваем параметры Cloudflare для WordPress

Cloudflare несет в себе массу преимуществ для безопасности и производительности, однако далеко не все опции совместимы с WordPress. Давайте подробно рассмотрим настройки Cloudflare, чтобы определить лучший функционал для вашего WP-сайта.

SSL

Cloudflare поддерживает четыре режима SSL/TLS шифрования – Off, Flexible, Full и Full (Strict).

  • Off – без шифрования.
  • Flexible – шифрует только соединение между браузером и Cloudflare.
  • Full – сквозное шифрование, допускающее наличие самоподписанного сертификата на исходном сервере.
  • Full (Strict) – сквозное шифрование, для которого потребуется бесплатный сертификат Cloudflare или сертификат от доверенного CA (удостоверяющего центра). Мы рекомендуем использовать режим Full (Strict) для максимальной безопасности. Как пример, заказать себе SSL-сертификат можно в магазине LeaderSSL.

Always Use HTTPS

Мы рекомендуем включить эту опцию для автоматического перенаправления всех HTTP-запросов на HTTPS.

HSTS

HSTS расшифровывается как «HTTP Strict Transport Security» и используется для того, чтобы принудить браузер использовать защищенные HTTPS-соединения. Включение HSTS в Cloudflare гарантирует, что HTTP-запросы никогда не попадут на ваш исходный сервер. Если ваш сайт уже перенесен на HTTPS, мы рекомендуем также настроить HSTS на вашем исходном сервере.

Minimum TLS Version

TLS – криптографический протокол, который обеспечивает безопасную передачу данных в сети. По умолчанию Cloudflare ставит TLS 1.0. Некоторые стандарты безопасности, такие как PCI DSS 3.2, требуют более свежих версий протокола TLS для соответствия требованиям. Если вы хотите задать определенную версию TLS, вы можете изменить это в разделе SSL/TLS > Edge Certificates > Minimum TLS Version.

Automatic HTTPS Rewrites

Эта опция проверяет URL-адреса HTTP-ресурсов в вашем HTML-коде, чтобы определить, доступны ли они по HTTPS. Если ресурсы доступны, то они автоматически будут переписаны с использованием варианта с HTTPS. Автоматическая перезапись HTTPS полезна для обеспечения безопасного посещения сайтов без вывода ошибок со смешанным содержимым.

Speed

Большинство настроек, связанных с производительностью, можно найти на вкладке Speed.

Image Resizing (Business Only)

Функционал ресайзинга изображений в Cloudflare доступен только для пользователей тарифа Business. При грамотной реализации в теме WordPress эта функция может быть использована для переноса генерации миниатюр в Cloudflare. Это несет в себе несколько преимуществ перед встроенной функцией генерации миниатюр в WP.

Для сайтов, динамически генерирующих размеры изображений, использование ресайзинга в Cloudflare позволяет снизить нагрузку на процессор – это позволит вашему сайту обслуживать больше пользователей одновременно без роста потребления ресурсов CPU. Ресайзинг изображений в Cloudflare помогает снизить потребление дискового пространства – миниатюры не нужно хранить на сервере.

Изменение размеров изображений в Cloudflare выполняется путем добавления конечной точки к изображениям. Посмотрите на пример ниже, который демонстрирует, как работает этот функционал.

URL исходного изображения:

https://yourdomain.com/wp-content/uploads/2020/01/picture.jpg

URL измененного изображения:

https://yourdomain.com/cdn-cgi/image/fit=contain,format=auto,metadata=none,onerror=redirect,quality=70,width=720/https://yourdomain.com/wp-content/uploads/2020/01/picture.jpg

Параметр «width» можно настроить для динамической генерации разных размеров миниатюр без дополнительной нагрузки на исходный сервер. Если вы ищете автономный сервис, который предлагает аналогичные возможности, рассмотрите Imgix или Cloudinary.

Polish (Pro Only)

Cloudflare Polish – сервис оптимизации изображений, который автоматически сжимает JPG, PNG, GIF и т.д. Изображения обрабатываются на стороне Cloudflare, а это означает, что на сервере, где расположен ваш сайт, не будет проблем с производительностью. Polish также поддерживает формат Google WEBP – это означает, что оптимизированные изображения WEBP будут автоматически передаваться в Chrome, Brave и другие браузеры, которые поддерживают этот формат.

Polish – полезная функция для WordPress-сайтов по нескольким причинам. Если вы используете плагин для оптимизации изображений, такой как ShortPixel или Imagify, вы можете попробовать перейти на Polish для снижения нагрузки на процессор. Как результат, ваш сайт будет работать стабильнее для ваших посетителей. Поскольку изображения, оптимизированные с помощью Polish, хранятся и кэшируются вне сервера, вам не нужно беспокоиться об использовании дискового пространства для хранения WEBP-версий изображений.

Auto Minify

Возможность автоматической минификации Cloudflare позволяет автоматически сжать кэшированные CSS, JSS, и HTML-ресурсы. Если вы уже не минимизируете ресурсы с помощью плагинов, таких как Autoptimize или WP-Rocket, рекомендуем вам включить эту опцию в Cloudflare.

Brotli

Brotli – это альтернатива GZIP, алгоритму сжатия, который снижает размер веб-запросов перед тем, как они будут доставлены посетителям. По сравнению с GZIP Brotli предлагает более высокую степень сжатия, что приводит к ускоренной загрузке страниц для пользователей. Проблема в том, что не все веб-браузеры поддерживают сжатие Brotli. В любом случае мы рекомендуем включить функцию Brotli, поскольку запросы из неподдерживаемых браузеров будут просто откатываться к сжатию GZIP.

Enhanced HTTP/2 Prioritization (Pro Only)

Введение HTTP/2 привело к значительному увеличению производительности веб-сайтов за счет распараллеливания и мультиплексирования. Улучшенная HTTP/2 приоритизация в Cloudflare интеллектуально анализирует HTML-код вашего сайта для определения порядка загрузки ресурсов с целью достижения максимальной производительности. Согласно Cloudflare, улучшенная HTTP/2 приоритизация позволяет сократить время загрузки страниц до 50%.

Mirage (Pro Only)

Mirage – это функция оптимизации изображений, предназначенная для мобильных и низкоскоростных подключений. Когда Mirage включен, изображения заменяются заполнителями низкого разрешения во время начальной загрузки страницы. После загрузки страниц все изображения выводятся в формате «ленивой загрузки» уже в полном разрешении.

Mirage также может комбинировать несколько запросов изображений в один запрос, что уменьшает количество раундтрипов (циклических переходов), необходимых для полной загрузки страницы. Если ваш сайт использует много изображений и ориентирован на мобильную аудиторию, Mirage способен оказать положительное влияние на производительность.

Rocket Loader

Rocket Loader – функционал, который ускоряет загрузку JavaScript-ресурсов, подгружая их асинхронно. Это позволяет сократить контент, блокирующий обработку страницы, что дает возможность быстрее ее загружать. Мы рекомендуем сначала протестировать сайт с включенным Rocket Loader, чтобы понять, улучшит ли он скорость загрузки ваших страниц. Если ваш сайт WordPress зависит от загрузки JavaScript ресурсов в определенном порядке, вы можете избежать использования Rocket Loader путем добавления атрибута data-cfasync=”false” в тег script.

Caching

По умолчанию Cloudflare кэширует статичные ресурсы, такие как CSS, JS, изображения. Обратите внимание, что Cloudflare не кэширует сгенерированный HTML-код вашего сайта по умолчанию.

Caching Level

Мы рекомендуем оставить уровень кэширования как Standard, что позволяет получить доступ к обновленным версиям ресурсов с помощью уникальной строки запроса.

Browser Cache Expiration

Мы рекомендуем сохранять этот параметр как «Respect Existing Headers». В итоге статичные ресурсы в кэше вашего браузера будут храниться в течение одного года. Если вы хотите выставить более короткий срок действия, измените эту настройку.

Firewall

Если ваш хостинг не предлагает настраиваемый файрвол, вы можете использовать базовое решение, которое встроено в бесплатный тарифный план Cloudflare. Оно допускает 5 произвольных правил. Правила файрвола могут быть настроены так, чтобы блокировать определенные IP-адреса, пользовательские агенты, методы запросов, HTTP-рефереры и даже страны.

Простой пример: если вы заметили, что ваш магазин WooCommerce получает много поддельных заказов из стран за пределами вашего целевого рынка, вы можете использовать бесплатный файрвол, чтобы заблокировать трафик со всей страны.

Тариф Pro в Cloudflare включает более надежный файрвол веб-приложений (WAF). В нем существуют специализированные управляемые наборы правил, которые позволяют вам еще сильнее защитить ваш сайт. К примеру, есть правила, которые предназначены для WordPress- и PHP-сайтов.

Для большинства сайтов на WordPress вполне достаточно того уровня безопасности, который предлагается в бесплатном тарифе Cloudflare. Если же вы ведете критически важный для бизнеса сайт, который требует больше защиты, вы можете переключиться на Pro-уровень и использовать улучшенные наборы правил в файрволе веб-приложений.

Network

В параметрах Network в Cloudflare мы рекомендуем включить HTTP/2, HTTP/3 (с QUIC) и 0-RTT Connection Resumption.

Как мы уже говорили ранее, HTTP/2 позволяет улучшить HTTP/1.1 за счет дополнительного распараллеливания и мультиплексирования. Аналогично, HTTP/3 улучшает производительность HTTP/2 за счет использования нового протокола на базе UDP под названием QUIC вместо традиционного TCP.

Защищенные HTTP/3-соединения также выигрывают от оптимизированной процедуры рукопожатий, которая улучшает время соединения. Если у вас включен HTTP/3 в Cloudflare, ваши клиенты могут использовать HTTP/3 (при наличии поддержки) для подключения к серверам Cloudflare.

Наконец, возможность 0-RTT Connection Resumption улучшает время загрузки сайта для посетителей, которые уже ранее заходили на ваш сайт.

Page Rules

Функционал правил страниц позволяет настраивать параметры для определенных URL-адресов. Правила страницы нужны для отключения кэширования для определенных ресурсов, изменения уровня безопасности для выбранной страницы и т.д. Одним из наиболее популярных случаев использования правил страницы является настройка Cloudflare для «кэширования всего».

Кэширование HTML с помощью Cloudflare Page Rule

Cloudflare кэширует только статичные ресурсы, такие как CSS, JS и изображения. В качестве меры безопасности Cloudflare по умолчанию на кэширует HTML. Сайты на WordPress и на других CMS являются динамическими в том смысле, что они требуют администрирования в защищенном бэкэнде. При включенном HTML-кэшировании эти защищенные страницы бэкэнда будут кэшироваться и станут видимыми для любого пользователя.

Параметр «кэшировать все» в Cloudflare может быть настроен путем добавления правил страниц с подстановочными знаками, охватывающими весь сайт. Пример: *oddstyle.ru/*

Если опция «кэшировать все» включена, то Cloudflare будет кэшировать HTML-страницы вашего сайта во всей своей мировой сети дата-центров.

Мы не рекомендуем настраивать кэширование всего в Cloudflare, если ваш сайт не является статичным. К примеру, большинство сайтов, генерируемых Gatsby и Hugo, не имеют динамических функций, которые могут ломаться при полностраничном кэшировании.

Bypass Cache on Cookies

Можно, конечно, настроить кэширование всего на вашем WordPress-сайте с помощью параметров Cloudflare. Тариф Business в Cloudflare позволяет вам создавать правила страниц, которые позволяют обойти кэш для некоторых cookies.

Чтобы запросы от залогиненных пользователей не кэшировались, вы можете использовать настройку обхода куки wordpress_logged_in. Аналогично, для WooCommerce можно настроить обход куки woocommerce_items_in_cart и wp_woocommerce_session_.

Задание Cache-Control Headers

Еще одна опция выборочного обхода кэша Cloudflare – использование PHP для добавления заголовков ответов управления кэшем при выполнении определенных условий. Чтобы этот метод сработал, вам нужно включить Origin Cache Control в правиле «cache everything».

Включение опции Origin Cache Control заставит Cloudflare учитывать заголовки ответов от вашего веб-сервера (к примеру, Nginx) и серверных приложений (к примеру, PHP и WordPress). Чтобы исключить кэширование определенных страниц, вы можете добавить следующие заголовки ответов в шаблоны вашей WordPress-темы. Код также можно адаптировать для внесения в файл functions.php.

01<?php header("Cache-Control: no-store, no-cache, must-revalidate, max-age=0"); header("Cache-Control: post-check=0, pre-check=0," false); header("Pragma: no-cache"); ?>

Если этот код добавить в верхнюю часть single.php, Cloudflare не будет кэшировать ваши отдельные посты и записи. Этот код также может быть заключен в логические операторы для выполнения при соблюдении определенных условий. К примеру, использование этого кода с функцией is_user_logged_in() гарантирует, что Cloudflare не будет кэшировать страницы для залогиненных пользователей.

В качестве примера мы внесли приведенный ниже код в файл header.php. Этот PHP-код добавит заголовки cache-control и Pragma ко всем страницам, когда пользователь является залогиненным.

01<?php if ( is_user_logged_in() ) { header("Cache-Control: no-store, no-cache, must-revalidate, max-age=0"); header("Cache-Control: post-check=0, pre-check=0", false); header("Pragma: no-cache"); } ?>

Изучив заголовки ответа для залогиненного запроса, мы видим следующее:

Cache-Control: no-store, no-cache, must-revalidate, max-age=0
Cache-Control: post-check=0, pre-check=0
CF-Cache-Status: BYPASS
CF-RAY: 588140b43a4f74a7-IAD
cf-request-id: 0244a6c4a0000074a7bdb0e200000001
Connection: keep-alive
Content-Encoding: gzip
Content-Type: text/html; charset=UTF-8
Date: Wed, 22 Apr 2020 18:01:54 GMT
Expires: Wed, 11 Jan 1984 05:00:00 GMT
Link: <http://brianwp.com/wp-json/>; rel="https://api.w.org/"
Pragma: no-cache
Server: cloudflare
Transfer-Encoding: chunked
Vary: Accept-Encoding
X-Content-Type-Options: nosniff
X-Kinsta-Cache: BYPASS

Просмотр той же страницы в качестве logged-out пользователя дает следующие заголовки ответа:

Age: 5
CF-Cache-Status: HIT
CF-RAY: 5881420dad7d74a7-IAD
cf-request-id: 0244a79c8d000074a7bd820200000001
Connection: keep-alive
Content-Encoding: gzip
Content-Type: text/html; charset=UTF-8
Date: Wed, 22 Apr 2020 18:02:49 GMT
Link: <http://brianwp.com/wp-json/>; rel="https://api.w.org/"
Server: cloudflare
Transfer-Encoding: chunked
Vary: Accept-Encoding
X-Content-Type-Options: nosniff
X-Kinsta-Cache: BYPASS

Как вы можете видеть, есть заголовок CF-Cache-Status: HIT, который указывает, что страница передается из кэша Cloudflare.

Argo и Railgun

Cloudflare предлагает дополнительные продукты для повышения производительности. Эти возможности оплачиваются отдельно, но на них стоит обратить внимание, если вы хотите еще больше оптимизировать свой сайт.

Argo

Argo – аддон для Cloudflare, который обеспечивает умную маршрутизацию для вашего сайта. С включенным Argo трафик направляется в обход перегруженных областей в сети Cloudflare. Как показали наши тесты, загрузка страниц с использованием Argo ускорилась на 20-30%. Зачастую эксперименты с Argo дают положительные результаты.

Railgun

Railgun – это WAN-продукт, который устанавливает защищенный туннель между вашим сервером и серверами Cloudflare. Railgun предназначен для ускорения доставки некэшированного контента. К примеру, если страница A и страница B имеют идентичные структуры хэдера и футера с разным содержанием тела, Railgun будет знать об этом и передаст только необходимые различия с помощью сильно сжатого потока двоичных данных.

Railgun доступен только для тарифов business и enterprise и требует установки дополнительного ПО на сервер. Ускорение Railgun для большинства пользователей не требуется. Однако если вы поддерживаете WooCommerce-магазин с высоким трафиком или форум, который не может быть кэширован, Railgun потенциально поможет увеличить скорость вашего сайта.

Плагин Cloudflare для WordPress

Команда Cloudflare поддерживает официальный плагин для WordPress. Хотя этого плагин не является обязательным требованием, он дает некоторые полезные функции, включая оптимизированные для WordPress настройки Cloudflare, наборы правил безопасности для WP, автоматическую очистку кэша и т.д.

Если вы являетесь опытным пользователем, лучше не ставьте плагин – вместо этого настройте параметры в консоли Cloudflare, чтобы избежать конфликтов с произвольными правилами страниц.

Источник: kinsta.com