Webflow

Caputchin ложится на сайт Webflow через пользовательский код. Устанавливать marketplace-приложение не нужно: ты добавляешь виджет так же, как любой сторонний скрипт, и связываешь его со своей формой. Работают и полный виджет, и игры.

1. Подключи виджет

Открой Site Settings → Custom Code своего проекта и вставь загрузчик в поле Head Code:

<script src="https://cdn.jsdelivr.net/npm/@caputchin/widget@3/dist/widget.js"></script>

@3 закрепляет текущую мажорную версию, так что ты получаешь исправления и новые игры без внезапного ломающего изменения. Эта одна строка регистрирует элементы <caputchin-widget> и <caputchin-game> для всего сайта. (Смотри Клиентскую интеграцию про вариант с npm, если у твоего сайта есть шаг сборки.)

2. Помести его на форму

В Designer добавь элемент Embed (Add panel → Components → Embed) внутрь <form>, который хочешь защитить, и положи в него виджет. Возьми свой публичный ключ сайта из панели:

<caputchin-widget sitekey="cpt_pub_..." trigger="form-submit"></caputchin-widget>

trigger="form-submit" запускает проверку при отправке формы и удерживает отправку, пока она не пройдена. Галочку можно и нажать: посетитель вправе кликнуть её и подтвердиться до отправки, тогда токен подставляется на месте, а форма не отправляется. При успехе (хоть по клику, хоть по отправке) виджет подставляет скрытый <input name="caputchin-token"> в окружающую форму, и твой шаг проверки читает именно его.

Для игры вместо галочки используй <caputchin-game>:

<caputchin-game sitekey="cpt_pub_..." game="caputchin/games/leaf-memory" layout="inline"></caputchin-game>

3. Проверь токен

Виджет доказывает, что в браузере прошёл человек; токен ты всё равно подтверждаешь на сервере, прежде чем довериться отправке. Выбери режим, который подходит твоей схеме.

Свой собственный бэкенд (рекомендуется, если он есть)

Открой настройки формы в Designer, поставь Send to → Custom action и направь его на свой эндпоинт. Твой сервер читает поле caputchin-token и подтверждает его через /siteverify. Точный серверный вызов смотри в Серверной интеграции и в Переходе с reCAPTCHA.

Размещённая проверка Caputchin (без бэкенда)

Если ты не держишь сервер, направь Custom action формы на URL своего пересыльщика размещённой проверки из панели. Caputchin проверяет токен и доставляет отправку в твой webhook или на почту. Это платная функция, и она заменяет собственный ящик отправок Webflow (форма отправляется в Caputchin, а не в Webflow). Смотри Размещённую проверку.

Клиентские ворота (сдерживающая мера, без серверной проверки)

Оставь форму на собственном обработчике Webflow и положись на trigger="form-submit", чтобы блокировать отправку, пока проверка не пройдена. Это поднимает планку для ботов, но не даёт подтверждённой на сервере гарантии, так что применяй это только там, где такое допустимо.