Skip to content
🛡 Захист чекауту WooCommerce: 2 способи додати CAPTCHA за 15 хвилин
WooCommerceПлагіни WordPressWordPress
7 хв1,410 слів

🛡 Захист чекауту WooCommerce: 2 способи додати CAPTCHA за 15 хвилин

Спам-замовлення, боти в кошику та фальшиві реєстрації, через це проходить кожен магазин на WooCommerce. Чистити базу від сміттєвих замовлень вручну ніхто не хоче, а кожен десятий лід від бота — це втрачений час і гроші.

CAPTCHA вирішує проблему за 10 хвилин налаштування. Без плагінів-комбайнів, без правок ядра.

Нижче, два робочих способи додати перевірку на чекауті: через безплатний плагін і через код у functions.php. Плюс бонус: захист сторінки входу за ті самі 5 хвилин.

Що таке CAPTCHA і навіщо вона на чекауті

💡 Швидкий огляд:

  • Що таке CAPTCHA та які типи бувають, коротко, без теорії заради теорії
  • Два способи встановлення: через безплатний плагін reCAPTCHA for WooCommerce і через код
  • Бонус: CAPTCHA на сторінці входу в адмінку, захист від брутфорсу
  • Типові помилки під час налаштування та як їх уникнути

CAPTCHA (Completely Automated Public Turing Test to Tell Computers and Humans Apart) — це тест, який відрізняє живого відвідувача від бота. Користувач ставить галочку «Я не робот», розв’язує просту картинку або головоломку, і тільки після цього форма надсилається. Бот таке не пройде: йому потрібно зрозуміти задачу, якої він не навчений.

Для WooCommerce-магазину CAPTCHA на чекауті, не примха, а необхідність. Спам-боти вміють заповнювати поля оформлення замовлення та натискати «Надіслати»: власник отримує десятки порожніх замовлень, які висять в адмінці та забивають CRM. Реальний кейс: після ввімкнення reCAPTCHA на тестовому сайті кількість фальшивих замовлень впала до нуля за добу, без фільтрів, без банів за IP, без правок .htaccess.

Шість основних типів CAPTCHA: текстова (спотворені літери та цифри), аудіо (для людей із порушеннями зору), математична (прості приклади на кшталт «3 + 4»), графічна (вибрати всі картинки зі світлофором), головоломка (перетягнути пазл) і невидима (reCAPTCHA v3, працює у фоновому режимі, аналізує поведінку користувача). Для магазину найкраще підходить reCAPTCHA v2 (checkbox) або невидима v3, вони не дратують покупців і водночас відсікають переважну більшість ботів.

Огляд плагінів: що ставити на WooCommerce

На ринку три основні плагіни, які закривають задачу. Розберемо коротко, який для чого підходить.

ReCAPTCHA for WooCommerce (RelyWP)

Безплатний, без преміум-версії взагалі. Підтримує reCAPTCHA v2 на чекауті, сторінці входу, реєстрації та скиданні пароля. 40 000+ активних встановлень, рейтинг 4,5 на WordPress.org. Встановлюється за хвилину: API-ключі Google → позначити галочками форми → готово. Мінус: тільки v2, v3 не підтримується, якщо потрібна невидима перевірка, дивіться альтернативи.

Advanced Google reCAPTCHA (WebFactory)

200 000+ встановлень, рейтинг 4,8 на WordPress.org. Закриває чекаут WooCommerce, Easy Digital Downloads, BuddyPress і стандартні форми WordPress. Підтримує v2 і v3, є математична капча як fallback. Безплатна версія покриває 90% задач; PRO-версія додає блокування за країнами. З нюансів: інтерфейс на любителя (вкладки старого дизайну), а у відгуках періодично спливають конфлікти з кастомними темами.

ReCaptcha by BestWebSoft

Безплатна версія + преміум за $24 на рік. v2, v3 та enterprise-режим. Налаштування розміру та розташування віджета, мультимовність, RTL. Мінус: прив’язка до Google-сервісів, для проєктів під GDPR може бути критично. Але як робочий інструмент, надійний, перевірений на десятках live-проєктів.

Спосіб 1: CAPTCHA через плагін (без коду)

Найпростіший шлях. Беремо reCAPTCHA for WooCommerce, він безплатний, легкий і не потребує танців із бубном.

Крок 1: Встановлення та активація

Заходимо в адмінку WordPress: Plugins → Add New. У рядку пошуку вводимо recaptcha for woo.

Знайшли, натискаємо Install Now, чекаємо пару секунд і активуємо.

Після активації в меню Settings з’явиться пункт reCAPTCHA WooCommerce.

Крок 2: API-ключі Google

Заходимо на сторінку створення ключів reCAPTCHA. Заповнюємо:

  • Label, будь-яке ім’я (наприклад, «Мій магазин»)
  • reCAPTCHA type, v2 (прапорець «I'm not a robot»)
  • Domains, домен магазину без https://

Тиснемо Submit, система видасть Site Key і Secret Key.

Крок 3: Налаштування плагіна

Копіюємо ключі та вставляємо в поля плагіна: Settings → reCAPTCHA WooCommerce.

Прокручуємо нижче, секція WooCommerce Forms. Позначаємо прапорцем WooCommerce Checkout (і Login/Register, якщо потрібно захистити вхід).

Зберігаємо зміни.

Крок 4: Перевірка

На тій самій сторінці налаштувань є кнопка Test API Response. Натискаємо, якщо ключі правильні, побачимо зелений статус.

Готово. Тепер на сторінці оформлення замовлення перед кнопкою «Оформити замовлення» буде капча. Перевірте в режимі інкогніто, бот-тест має з’явитися.

Спосіб 2: CAPTCHA через код (без зайвих плагінів)

Якщо не хочете встановлювати ще один плагін, ось сніпет, який додає reCAPTCHA на оформлення замовлення через functions.php.

Крок 1: Підготовка

Перед редагуванням коду зробіть повний бекап сайту. Редагуємо файл functions.php дочірньої теми або використовуємо плагін Code Snippets — це безпечніше: помилка в коді не покладе сайт, сніпет просто вимкнеться.

Крок 2: Код

Нижче наведено дві функції PHP. Перша виводить віджет reCAPTCHA на чекауті, друга перевіряє відповідь Google під час надсилання замовлення.

1/**
2 * Виведення reCAPTCHA на сторінці чекауту WooCommerce
3 */
4function doublee_show_me_the_checkout_captcha($checkout) {
5    echo '<div class="g-recaptcha" data-sitekey="YOUR_SITE_KEY"></div>';
6}
7add_action('woocommerce_checkout_order_review', 'doublee_show_me_the_checkout_captcha', 18);
8 
9/**
10 * Перевірка відповіді reCAPTCHA при оформленні замовлення
11 */
12function doublee_process_recaptcha() {
13    $postdata = $_POST['g-recaptcha-response'];
14    $verified_recaptcha = file_get_contents(
15        'https://www.google.com/recaptcha/api/siteverify?secret=YOUR_SECRET_KEY&response=' . $postdata
16    );
17    $response = json_decode($verified_recaptcha);
18    if (!$response->success) {
19        wc_add_notice('Please verify that you are not a robot', 'error');
20    }
21}
22add_action('woocommerce_checkout_process', 'doublee_process_recaptcha');

Що тут відбувається:

  • woocommerce_checkout_order_review, хук, який спрацьовує під час виведення блоку замовлення на чекауті. На нього вішаємо виведення <div> з data-атрибутом data-sitekey (той самий Site Key із консолі Google).
  • woocommerce_checkout_process, хук валідації під час надсилання замовлення. Функція надсилає відповідь капчі на сервер Google через siteverify-ендпоінт, декодує JSON і, якщо перевірку не пройдено, додає помилку через wc_add_notice(), штатний механізм WooCommerce.
  • Якщо на хостингу вимкнено allow_url_fopen (функція file_get_contents для URL не працює), замініть її на wp_remote_get(), він працює через cURL і не залежить від php.ini.

Крок 3: Вставлення та перевірка

Додайте код через Code Snippets або в functions.php дочірньої теми, збережіть.

Після збереження зайдіть на сторінку чекауту в режимі інкогніто, має з’явитися віджет reCAPTCHA. Спробуйте надіслати замовлення без позначки: з’явиться помилка «Please verify that you are not a robot».

Бонус: CAPTCHA на сторінці входу

Чекаут, не єдина больова точка. Брутфорс-атаки на /wp-login.php і /my-account/ тривають цілодобово, навіть на невеликих магазинах. Ті самі reCAPTCHA for WooCommerce закривають форму входу за пару кліків.

Заходимо в Settings → reCAPTCHA WooCommerce, секція WooCommerce Forms, і вмикаємо Login:

Зберегли, і /my-account/ захищено. Якщо потрібно закрити ще й /wp-login.php, цей самий плагін підтримує WordPress-форми: та сама логіка, позначка WordPress Login Form.

Типові проблеми та як їх вирішити

  • Капча не з’являється на чекауті. Перевірте ключі: Site Key і Secret Key мають бути від v2 («I'm not a robot» Checkbox), а не від v3. Якщо версія не збігається, віджет просто не рендериться.
  • Капча відображається двічі. Найімовірніше, у вас активні два плагіни з reCAPTCHA одночасно (наприклад, один у темі, інший окремо). Вимкніть дублікат.
  • Помилка «Invalid key» під час тесту API. Або помилка під час копіювання ключів, або ключі створені для іншого домену. Перестворіть ключі та перевірте домен у консолі Google.
  • Конфлікт із кастомним шаблоном чекауту. Перемкніться на стандартну тему (Storefront) і перевірте: якщо капча з’явилася, проблема в хуках вашої теми. Рішення: кастомний хук у коді (Спосіб 2) із прив’язкою до вашого шаблону.
  • Чекаут не завантажується після ввімкнення CAPTCHA. Очистіть кеш (плагін + браузер), вимкніть мініфікацію JS на час тесту: конфлікти найчастіше виникають через агресивну оптимізацію скриптів.
  • Покупці скаржаться, що капча відхиляє реальних людей. Знизьте чутливість у налаштуваннях reCAPTCHA або перейдіть на v2 Checkbox: він м’якший за v3 і не блокує за «підозрілою» поведінковою моделлю.

⁉️🤔 Часті запитання

Чи потрібна CAPTCHA на чекауті, якщо вже встановлено антиспам-плагін?

Антиспам-плагіни на кшталт Akismet захищають коментарі та форми зворотного зв’язку, але не чекаут WooCommerce. Боти для фальшивих замовлень обходять стандартні фільтри: їм не потрібні поля коментарів, вони заповнюють саме форму оформлення. CAPTCHA закриває цю діру.

Яку версію reCAPTCHA обрати, v2 чи v3?

Для магазину ми радимо v2 Checkbox: відвідувач ставить одну галочку, і замовлення йде. v3 працює у фоновому режимі та може заблокувати реального покупця, якщо його поведінкова модель здасться системі «підозрілою», а на чекауті кожен клієнт на вагу золота.

Чи можна захистити капчею лише гостьовий чекаут, а залогінених користувачів пропускати?

Так. У плагіні reCAPTCHA for WooCommerce галочка WooCommerce Checkout вмикає капчу для всіх. Щоб пропускати залогінених, доведеться додати умову в код (Спосіб 2): обгорнути хук у if (!is_user_logged_in()). Без коду, лише плагінами з умовною логікою на кшталт Advanced Google reCAPTCHA PRO.

Чи впливає CAPTCHA на швидкість завантаження чекауту?

Помітно, ні. Скрипт reCAPTCHA завантажується асинхронно й лише на тих сторінках, де форма реально виводиться. Жодного зайвого навантаження на весь сайт. На практиці різниця у швидкості чекауту до та після, у межах 100-200 мс.

Підсумки

Додати CAPTCHA на чекаут WooCommerce — це завдання на 15 хвилин, а ефект, чистий. Жодних спам-замовлень, жодного ручного чищення бази, жодних ботів у воронці.

Якщо не хочете ставити зайві плагіни, беріть другий спосіб із кодом. Він додає рівно дві функції у functions.php і не потребує оновлень. Якщо віддаєте перевагу підходу «поставив і забув», reCAPTCHA for WooCommerce: безплатний, 40 тисяч встановлень, живі оновлення та підтримка Block Checkout з коробки.

Перевірте, що капча працює на всіх пристроях: відкрийте чекаут із телефона та з десктопа в режимі інкогніто. Якщо на мобільному віджет з’їжджає, поправте CSS-контейнер або перемкніть розмір віджета на Compact у консолі Google reCAPTCHA. П’ять хвилин тесту зараз зекономлять години розгрібання спам-замовлень потім.

Редакція
РедакціяРедакційна команда→ Усі публікації

Професійна команда авторів та редакторів, що спеціалізуються на створенні якісного контенту.