DevOps2 мин чтения

Статический сайт на Cloudflare Workers за пять минут

Без сервера, без FTP и обычно без счетов. Конфигурация wrangler, заголовки кеша, редиректы и своя страница 404.

workers

Иллюстративное фото: Unsplash

Этот блог пишется в WordPress, но вы читаете его как обычные HTML-файлы с Cloudflare Workers. Для сайта, которому не нужна база данных при каждом визите, это самый быстрый и дешёвый путь: файлы лежат на краю сети, рядом с читателем.

Конфигурация

Нужен один файл. Секция [assets] указывает, из какой папки отдавать файлы — скрипт Worker писать вообще не нужно.

name = "my-site"
compatibility_date = "2026-10-01"

[assets]
directory = "./dist"
not_found_handling = "404-page"

Опция not_found_handling = "404-page" для несуществующих адресов вернёт ваш 404.html с кодом 404, а не пустой ответ.

Деплой

npx wrangler login     # один раз, открывает браузер
npm run build
npx wrangler deploy

Через несколько секунд сайт работает по адресу my-site.<аккаунт>.workers.dev. Свой домен подключается в панели одним кликом, если DNS в Cloudflare.

Кеш и заголовки

Файл _headers в папке со сборкой задаёт заголовки для путей. Файлы с хешем в имени можно кешировать «навсегда», HTML — ненадолго, чтобы новая версия появлялась сразу.

/assets/*
  Cache-Control: public, max-age=31536000, immutable

/*.html
  Cache-Control: public, max-age=300

Редиректы

Поменяли адрес статьи? Файл _redirects обработает это без кода, а поисковик перенесёт позицию на новый URL.

/old-url/   /new-url/   301

Сколько это стоит

На бесплатном тарифе запросы к самим статическим файлам не учитываются в лимите вызовов Worker. Для блога или сайта-визитки счёт обычно нулевой. Лимиты и цены меняются, поэтому перед большим проектом загляните в актуальную документацию.

Когда не статика Живые комментарии, вход в кабинет, корзина с остатками на складе — тут уже нужен бэкенд. Тогда тот же Worker может получить код и базу D1, но это тема для отдельного текста.

STOS

Блог о фронтенде, DevOps и инструментах

Сделано на WordPress: своя блочная тема, Polylang, Yoast SEO. Посмотреть админку WordPress в Playground ↗

STOS — вымышленный блог, концепт-проект для портфолио. Автор и тексты — примеры.