Безплатен статичен сайт в Cloudflare Pages: стъпка по стъпка

01За какви сайтове става

Pages е за статични сайтове: визитка, портфолио, документация, лендинг страница, сайт от генератор като Hugo, Eleventy или Astro. Сървърна логика (форми, вход) е възможна с Pages Functions, но заявките към тях се броят към лимита на Workers Free – 100 000 заявки на ден. Заявките към статичните файлове според Cloudflare са безплатни и неограничени и на безплатния, и на платените планове.

WordPress и PHP сайтове не работят тук. За тях ви трябва хостинг – вижте споделен хостинг, VPS или облак.

02Ограниченията на безплатния план

Ако сайтът има над 1000 файла, качете го с командата Wrangler (до 20 000 файла) или през Git.

03Плъзгане или Git: решете в началото

Direct Upload (плъзгане): качвате zip файл или една папка направо в таблото. Подходящо е, когато сайтът се променя рядко или го генерирате на компютъра си. Нова версия качвате с „Create a new deployment“ в проекта.

Git интеграция: свързвате хранилище в GitHub или GitLab, задавате команда за компилация и папка с резултата, и всяко изпращане (push) в основния клон се публикува само. Другите клонове получават тестови адреси. Cloudflare изрично пише, че проект с Direct Upload не може да се превключи към Git – за това трябва нов проект, а плъзгането не е достъпно в проект с Git.

04Git интеграция: какво попълвате

При Git проект в таблото избирате Workers & Pages → Create application → Pages → Connect to Git, давате на Cloudflare достъп до GitHub или GitLab и посочвате хранилището. После попълвате три полета:

• Build command – командата, която генерира сайта (например командата за компилация на вашия генератор). Ако сайтът е чист HTML без компилация, оставете полето празно.
• Build output directory – папката с готовия резултат, която се качва като сайт, например dist или public. Готовите шаблони за популярните инструменти я попълват сами.
• Root directory (по желание) – откъде да започне компилацията, ако в хранилището има няколко проекта.

Публикациите в основния клон (обикновено main) отиват в production, а другите клонове получават тестови адреси. 500 компилации на месец са средно около 16 на ден (наша сметка); ако изпращате всяка дребна промяна поотделно, групирайте ги.

05Преди качване: какво да проверите

• index.html е в самия корен на папката, а не в подпапка – иначе началната страница няма да се отвори.
• Връзките между страниците и пътищата към картинките работят и когато сайтът е на друг адрес (относителни пътища или пътища от корена).
• В папката няма нищо, което не бива да е публично: копия на бази, файлове с пароли, .env. Всичко, което качите, става достъпно в интернет.
• Нито един файл не е над 25 MiB, а при плъзгане файловете са до 1000.

06Собствен домейн: поддомейн или голият домейн

Сайтът първо получава адрес име-на-проекта.pages.dev. Собствен домейн добавяте от раздела Custom domains на проекта.

За поддомейн, например www.example.bg, зоната не е нужно да е в Cloudflare: при външен DNS доставчик добавяте CNAME запис към име-на-проекта.pages.dev. Важно: първо добавете домейна в таблото на Pages и чак после CNAME записа, иначе адресът не се отваря и посетителите виждат грешка 522.

За голия домейн (example.bg) домейнът трябва да е зона в същия Cloudflare акаунт, т.е. да смените DNS сървърите (NS) при регистратора към тези на Cloudflare. Тогава Cloudflare сам създава записа. Преди смяна на NS препишете в Cloudflare всички записи, особено MX за пощата – как се прави, вижте в смяна на DNS сървърите. Ако имате CAA записи, те трябва да позволяват на Cloudflare да издаде сертификат.

07Пренасочвания и заглавки с два файла

Файлът _redirects (без разширение, в папката, която публикувате) съдържа по едно пренасочване на ред, например /staro /novo 301. Ограничението е 2000 статични и 100 динамични правила, всяко до 1000 знака; за повече Cloudflare препоръчва Bulk Redirects.

Файлът _headers задава HTTP заглавки по пътища – до 100 правила. Кои заглавки за сигурност си струва да сложите, вижте в HTTP заглавки за сигурност, а резултата проверете с инструмента за пренасочвания.

→Стъпка по стъпка

1. Подгответе папката

   Сложете всички файлове на сайта в една папка с index.html най-горе. Ако нямате страница, направете я с генератора на index.html.

2. Проверете папката

   Пуснете папката през проверката за публикуване: брой файлове, размери, липсващ index.html, имена с интервали.

3. Влезте в собствения си акаунт

   Отворете таблото на Cloudflare в своя безплатен акаунт и изберете Workers & Pages.

4. Създайте проект с плъзгане

   Изберете Create application, после Get started при „Drag and drop your files“. Въведете име на проекта – от него става адресът име.pages.dev.

5. Качете и публикувайте

   Плъзнете папката или zip файла в полето и изберете Deploy site. Ако файл е над 25 MiB, ще видите червено предупреждение и трябва да качите проекта наново без него.

6. Отворете адреса pages.dev

   Проверете страниците, картинките и връзките. Нова версия по-късно качвате с Create a new deployment.

7. Добавете собствен домейн

   В Custom domains изберете Set up a domain. За поддомейн добавете CNAME към име.pages.dev при DNS доставчика си, след като сте добавили домейна в таблото; за голия домейн преместете зоната в Cloudflare.

8. Проверете DNS и сертификата

   С DNS проверката вижте записа, а с проверката на SSL – че сертификатът е издаден.

?Чести въпроси