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

Капча

Встроенная математическая капча для защиты от ботов — без reCAPTCHA и без сторонних сервисов.

Как работает

FormHook рендерит виджет с простой арифметической задачей в изолированном iframe на домене FormHook. Пользователь вводит ответ. SDK проверяет его перед отправкой заявки.

→Виджет изолирован в iframe — не наследует стили страницы, не доступен из вашего JS
→Поддерживает тёмную / светлую тему
→Не требует Google-аккаунта, cookies или трекинга

Включение капчи

В дашборде: Сайт → Настройки → переключатель Капча.

После включения все заявки без валидного captcha_challenge_id и captcha_answer будут отклонены.

Декларативный режим

Поместите <div class="formhook-captcha"></div> внутри формы. Loader найдёт его и рендерит виджет автоматически.

html

<form data-formhook data-sitekey="ВАШ_SITE_KEY">
  <input name="email" type="email" required />

  <!-- Виджет капчи появится здесь -->
  <div class="formhook-captcha"></div>

  <button type="submit">Отправить</button>
</form>

<script src="https://app.form-hook.com/sdk/v3/loader.min.js" async defer></script>

Явный API: render()

javascript

var widgetId = null;

window.formhook.ready(function() {
  widgetId = window.formhook.render('#captcha-container', {
    sitekey: 'ВАШ_SITE_KEY',
    locale: 'ru',       // 'ru' | 'en'
    theme: 'auto',      // см. список ниже
    callback: function() {
      // Вызывается, когда пользователь решил задачу
      document.getElementById('submit-btn').disabled = false;
    },
    'expired-callback': function() {
      // Вызывается при истечении капчи
      document.getElementById('submit-btn').disabled = true;
    },
    'error-callback': function(err) {
      // err = { code, message }
      console.error(err.code, err.message);
    },
  });
});

Проверка и сброс

javascript

// Проверить, решена ли капча
if (!window.formhook.isSolved(widgetId)) {
  alert('Пожалуйста, решите капчу');
  return;
}

// Сбросить капчу после успешной отправки или ошибки
window.formhook.reset(widgetId);

Темы

Значение	Описание
`light`	Белый фон
`dark`	Чёрный фон
`dark-blue`	Тёмно-синий
`dark-red`	Тёмно-красный
`coffee`	Кремовый editorial-стиль
`auto`	По системному prefers-color-scheme

Уничтожение виджета

Вызывайте remove() при размонтировании компонента, чтобы избежать утечек памяти:

javascript

// React useEffect cleanup:
return () => {
  if (widgetId) window.formhook.remove(widgetId);
};

// Vue onUnmounted:
onUnmounted(() => {
  if (widgetId) window.formhook.remove(widgetId);
});

Прямой HTTP без SDK

Если используете прямой API, получите challenge сначала:

bash

# 1. Получить challenge
curl -X POST https://app.form-hook.com/api/c1/sites/ВАШ_SITE_KEY/captcha/challenges

# Ответ: { "challenge_id": "...", "question": "3 + 7 = ?", "expires_at": "..." }

# 2. Отправить заявку с ответом
curl -X POST https://app.form-hook.com/api/c1/sites/ВАШ_SITE_KEY/submissions \
  -H "Content-Type: application/json" \
  -d '{
    "data": { "email": "ivan@example.com" },
    "captcha_challenge_id": "CHALLENGE_ID",
    "captcha_answer": 10
  }'

Challenge истекает через 5 минут. Если пользователь долго заполняет форму — получите новый challenge перед отправкой.

← Назад Каналы уведомлений Далее → Антиспам