Acecore SystemsКорпоративный сайт Acecore
Русский
Связаться
Меню

Insights / Технические материалы

Как добавить комментарии в Astro-блог только на Cloudflare

Как мы добавили комментарии в Astro-блог без внешнего сервиса: Cloudflare Pages Functions, D1, Turnstile и конфигурация Wrangler.

Gui
  • Технологии
  • Cloudflare
  • Astro
  • Безопасность
  • Веб-сайт
Как добавить комментарии в Astro-блог только на Cloudflare
Содержание
  1. Архитектура
  2. Почему D1
  3. Wrangler и окружения
  4. Turnstile на сервере
  5. Anti-spam
  6. SEO
  7. Итог
  8. Ссылки

Комментарии добавляют состояние в статический сайт.

Acecore не стал подключать внешний сервис комментариев. В PR #101 функция реализована только на Cloudflare.

  • Astro показывает UI.
  • Cloudflare Pages Functions предоставляет /api/comments.
  • Cloudflare D1 хранит комментарии.
  • Cloudflare Turnstile защищает POST.
  • wrangler.jsonc задает binding COMMENTS_DB.

Главное преимущество: комментарии не становятся сторонним виджетом внутри страницы.

Архитектура

Слой Файл или сервис
UI src/components/BlogComments.astro
Вставка в статью src/views/BlogPostPage.astro
API functions/api/comments.ts
Хранилище D1 binding COMMENTS_DB
Защита Cloudflare Turnstile
Schema migrations/0001_create_blog_comments.sql

UI читает через GET /api/comments?slug=...&locale=... и отправляет через POST /api/comments.

Function проверяет origin, payload, Turnstile, лимиты, дубликаты и запрещенный контент.

Почему D1

Комментарии удобно хранить в SQL: фильтр по статье, сортировка по времени, soft delete через deleted_at, дубликаты через body_hash, лимиты через client_hash.

Видимые строки имеют deleted_at IS NULL. Spam можно скрыть без физического удаления.

Запросы используют prepared statements и bind(), поэтому пользовательский ввод не склеивается с SQL.

Wrangler и окружения

COMMENTS_DB задается в wrangler.jsonc и указывает на единственную D1-базу acecore-comments.

Так имя binding остается стабильным, а Cloudflare dashboard и репозиторий используют одно имя базы.

Turnstile на сервере

Widget в браузере недостаточен.

Pages Function отправляет token в Cloudflare Siteverify с TURNSTILE_SECRET_KEY, а также проверяет hostname из результата.

Anti-spam

Первая версия строгая:

  • без URL
  • без email
  • без HTML
  • без Markdown-ссылок
  • без длинных повторов
  • без рекламных слов
  • honeypot поле

Rate limit есть в памяти и в D1. IP не сохраняется напрямую; используется salted hash.

SEO

Комментарии загружаются на клиенте, а блок помечен data-pagefind-ignore. Они не индексируются как основной текст статьи.

Для корпоративного блога это безопаснее: статья — редакционный контент, комментарии — взаимодействие.

Итог

Внешний сервис комментариев удобен, но не обязателен.

Если сайт уже работает на Cloudflare Pages, Pages Functions + D1 + Turnstile + Wrangler достаточно для легкой системы комментариев.

Ссылки

Cloudflare Comments

Архитектура комментариев, созданная только на Cloudflare

Astro отображает интерфейс, Cloudflare Pages Functions образуют границу API, а D1 и Turnstile соединяются как компоненты Cloudflare.

  1. Разместить интерфейс в Astro

    Разместить под статьёй список комментариев, форму отправки и виджет Turnstile.

  2. Принимать через Pages Function

    `/api/comments` обрабатывает GET/POST/OPTIONS, проверяет ввод и отвечает за CORS.

  3. Сохранять в D1

    Через binding `COMMENTS_DB` сохранять комментарии, hash и время создания в совместимой с SQLite D1.

  4. Защищать с помощью Turnstile

    Выполнять server-side validation token Cloudflare Turnstile и проверять hostname allowlist.

Разница между внешним сервисом комментариев и собственной реализацией на Cloudflare

Внешний сервис комментариев

  • Быстро внедряется, но интерфейс, хранилище, условия и скорость отображения зависят от сервиса
  • Внешние script и iframe легко влияют на загрузку страницы статьи
  • Многоязычный интерфейс и единство с дизайном сайта часто ограничены
  • Обработка, удаление и миграция комментариев зависят от спецификации сервиса

Реализация только на Cloudflare

  • Pages Functions, D1 и Turnstile обеспечивают API и хранилище
  • HTML и CSS Astro естественно встраиваются в дизайн сайта
  • Конфигурация Wrangler позволяет согласовать D1 binding с именем базы на Cloudflare
  • Команда сама определяет защиту от спама, удаление и объём сохраняемых персональных данных

Что решить до реализации

  • Хранить комментарии в собственной архитектуре Cloudflare, не передавая их внешнему сервису
  • Использовать D1 как хранилище, а Cloudflare Pages Functions как границу API
  • Всегда выполнять server-side validation token Turnstile
  • Отклонять URL, адреса электронной почты, HTML, Markdown-ссылки и рекламные формулировки до отправки
  • Согласовать имя базы D1 и binding COMMENTS_DB с конфигурацией Cloudflare

Вопросы

Почему не внешний виджет?

Внешний сервис быстро подключается, но UI, данные, скрипты, модерация и миграция зависят от него. Здесь все остается в сайте и Cloudflare.

Достаточно ли D1?

Для выборки по post_slug, сортировки, soft delete, rate limit и дубликатов D1 хорошо подходит.

Достаточно ли Turnstile в браузере?

Нет. Pages Function должна проверить token через Siteverify перед записью в D1.