Cloudflare: Pages, Workers и защита
Урок 12 из 26 курса «Вайбкодинг: курс с нуля». Бесплатно, с анимациями и тестом.
Сеть, которая стоит перед сайтом
Cloudflare: компания с огромной сетью серверов по всему миру. Она встаёт между посетителем и твоим сайтом. Главная фишка: CDN, сеть доставки контента. Копии сайта лежат на серверах в разных странах, и каждый посетитель получает их с ближайшего. Точки на глобусе: это серверы. Пример: твой игровой клан живёт в разных странах, а сайт с расписанием турниров у всех грузится быстро.
Щит и замок https
Вторая работа Cloudflare: защита. Например, от DDoS-атаки, когда толпа ботов одновременно заваливает сайт запросами, чтобы он упал. Сеть отсекает такой мусор раньше, чем он дойдёт до сайта: это щит на схеме. Ещё есть SSL: шифрование связи между браузером и сайтом, его видно по https в адресе и значку замка. Сертификат для этого Cloudflare выпускает автоматически.
Pages: сайт прямо из GitHub
Pages: хостинг сайтов в Cloudflare. Схема знакомая: подключаешь репозиторий с GitHub, указываешь команду сборки, и после каждого push сайт обновляется сам. Боковая стрелка на схеме как раз про это. Каждая ветка получает свою превью-ссылку. Короче: всё из урока про деплой тут работает. Разделы панели Cloudflare со временем переименовывают и объединяют, но идея остаётся той же.
Workers: серверный код без сервера
Workers: маленькие кусочки серверного кода, которые запускаются прямо в сети Cloudflare. Настраивать свой сервер не надо. Пример: на сайте клана есть форма записи на турнир, и заявки надо сохранять. Или кнопка, которая просит ИИ придумать название команды. Ключ к ИИ во фронтенд класть нельзя, помнишь? Его держит Worker: браузер обращается к Worker, а тот с ключом идёт к ИИ.
Секреты: в панели, а не в коде
Ключи для Workers и Pages добавляют в панели Cloudflare как секреты, то есть зашифрованные переменные. Код обращается к ним по имени, например AI_KEY, а само значение в репозиторий не попадает. Идея та же, что с файлом .env: Git помнит всё, поэтому ключ в коде рано или поздно утечёт. Если ключ всё же попал в репозиторий, отзови его в сервисе и создай новый.
Когда выбирать Cloudflare
Ещё у Cloudflare есть DNS для твоего домена (чип на схеме) и хранилища данных: D1, база с таблицами, и KV, простое хранилище «ключ → значение». Бери Cloudflare, если у тебя статический сайт или простой бэкенд, свой домен и гости из разных стран. Бесплатный тариф обычно есть, лимиты смотри на сайте. Проверь, доступен ли сервис и оплата в твоей стране. Потренируйся в симуляторе Cloudflare.
Проверь себя
- Зачем сайту CDN?
Правильный ответ: Посетитель получает сайт с ближайшего сервера. CDN держит копии сайта по всему миру, поэтому страница едет к человеку с ближайшей точки и грузится быстрее. - Где хранить ключ к ИИ, который использует Worker?
Правильный ответ: В секретах в панели Cloudflare. Секрет зашифрован и не попадает в репозиторий. Во фронтенде и README ключ увидит любой. - Что значат https и замок в адресе сайта?
Правильный ответ: Связь браузера с сайтом зашифрована. SSL шифрует данные по дороге. Ловушка: замок не гарантирует, что сайт честный, он есть и у мошенников.