Попрощайтесь із Спамом! Повний путівник по reCAPTCHA

У 2013 році Target тепер знаменито скомпрометував дані десятків мільйонів покупців у події, що призвела до зниження продажів, численних судових позовів, і навіть змусила генерального директора піти у відставку.

Що сталося?

Хакери отримали доступ до Target через третю сторону, яка не мала CAPTCHA або будь-якого виду аутентифікації для перевірки, що в систему входить людина — а не шкідливий Bot — .

Звідти, боту не знадобилося багато часу, щоб проникнути до організації цього стороннього постачальника та працювати своїм шляхом у платіжну мережу великого роздрібного продавця.

Який урок тут?

Якщо зловмисники шукають шлях на ваш сайт, CAPTCHA може стати потужною першою лінією оборони, і навіть переконати їх перейти до більш легкої мети (гра слів *надзвичайно* задумана).

Зацікавлені цією концепцією CAPTCHA?

Тоді читайте далі, щоб дізнатися:

• Різниця між CAPTCHA та reCAPTCHA (та що означають усі ці букви!)
• Основні типи CAPTCHA, що використовуються сьогодні
• Як CAPTCHA можуть допомогти власникам веб-сайтів уникнути спаму та зловживань
• Кілька недоліків, які варто врахувати при використанні CAPTCHA
• Два способи додавання Google reCAPTCHA на ваш сайт WordPress

Що таке reCAPTCHA?

Готуйтеся, друзі, адже це буде багатошарово.

Почнемо з базового визначення: “reCAPTCHA — це сервіс від Google, який допомагає захищати вебсайти від спаму та зловживань.”

reCAPTCHA від Google – це популярна брендова версія CAPTCHA. Початкова ідея CAPTCHA була задумана в Університеті Карнегі-Меллон близько 2000 року. reCAPTCHA також була створена розробниками з того ж університету, а потім куплена Google приблизно у 2009 році.

Тепер наступний шар: Що насправді означають усі літери в слові “CAPTCHA”?

Фраза CAPTCHA є скороченням від “повністю автоматизований загальнодоступний тест Тьюрінга для розрізнення комп’ютерів та людей”.

І це пояснення приводить нас до останнього, логічного шару, який варто розглянути: Що таке тест Тьюрінга?

Якщо ви як ми, то ваше основне знайомство з Тюринговим тестом відбулося завдяки фільму 2014 року The Imitation Game, де головну роль відіграв математик та комп’ютерний науковець Алан Тюрінг.

Алан Тьюрінг розробив тест Тьюрінга (який спочатку називався грою в імітацію — скромно), щоб відповісти на питання, “Чи можуть машини думати?”

Сьогодні Тест Тьюрінга в основному використовується для розрізнення людей та ботів, перевіряючи здатність бота демонструвати таку саму інтелектуальну поведінку, як у людини. Боти, у цьому випадку, означають автоматизовані програмні системи, часто засновані на штучному інтелекті (AI).

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

Тепер, коли ви знаєте достатньо, щоб точно написати роман на тему CAPTCHA, давайте поговоримо про всі різні способи, якими ми бачимо цю концепцію в повсякденному житті.

Різні типи CAPTCHA

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

Текстові CAPTCHA

Текстові CAPTCHA показують символи у дивних розташуваннях, використовуючи незвичайні шрифти та на кольорових тлі.

Ці CAPTCHA вимагають логічного мислення і перекладу для розуміння того, що означає кожна літера та цифра — це інтелектуальне завдання, з яким не можуть впоратися багато попередньо запрограмованих ботів.

Каптчі на основі зображень

З використанням CAPTCHA на основі зображень користувач сайту повинен визначити, які зображення відповідають запропонованому запиту. Використовуючи схожі за зовнішнім виглядом фотографії, які вимагають певного рівня логіки для розрізнення, цей варіант також може обдурити ботів.

Тести reCAPTCHA від Google досить часто використовують цей метод — що має сенс, враховуючи їх велике джерело фотографій з Google Street View.

Аудіо-базовані CAPTCHA

З аудіо-базованими CAPTCHA, звук є носієм. Цей метод часто поєднується з іншими, як текстові та візуальні CAPTCHA.

Аудіо CAPTCHA не тільки більш доступні для людей із порушеннями зору – вони також є потужним блокувальником ботів, оскільки покладаються на те, наскільки складно відрізнити справжні слова від фонового шуму.

CAPTCHA на основі прапорців

Хоча ці CAPTCHA можуть здаватися простими на перший погляд, насправді вони оцінюють, як користувачі вебсайту взаємодіють із прапорцем.

Боти заповнюють форми та миттєво відмічають пункти у списку, тоді як люди роблять це повільніше.

Цей метод можна комбінувати з іншими CAPTCHA, якщо ви хочете мати ще більшу впевненість, що користувач насправді не є програмним забезпеченням, вміло замаскованим під людину в спортивних штанах і з кавою Starbucks.

CAPTCHA, заснована на поведінці

Справа в тому, що програмне забезпечення стало настільки розумним, що багато з вищезгаданих CAPTCHAs можна обійти сьогодні.

Саме тому нова версія reCAPTCHA — Google’s reCAPTCHA v3 — змінила правила гри за допомогою методу CAPTCHA, який працює на задньому плані.

reCAPTCHA v3 є майже невидимою reCAPTCHA, яка використовує JavaScript API та двигун адаптивного аналізу ризиків на основі машинного навчання для оцінювання користувачів на основі їхньої поведінки під час взаємодії з вашими веб-сторінками.

За лаштунками, reCAPTCHA v3 надає кожному користувачеві оцінку, яка намагається визначити, чи є вони людиною чи ботом. Звичайно, в деяких випадках, це спостереження може бути недостатнім для зупинки дійсно розумних ботів.

Крім того, в епоху, коли маятник знову нахиляється до приватності в інтернеті, цей метод може бути суперечливим, оскільки він стежить за вашою активністю на сайті, часто єдиним попередженням є мала значка reCAPTCHA.

Те, про що ми говорили тут, – це лише найпоширеніші CAPTCHA. Інші типи програм просять користувача сайту перетягувати об’єкти в певну точку на екрані, грати в “мікроігри” та інше. Дізнайтеся більше про приклади CAPTCHA тут.

Сценарії використання: Де застосовувати CAPTCHA для запобігання спаму

Програмне забезпечення з підтримкою штучного інтелекту має багато надзвичайних застосувань, таких як допомога компаніям у виконанні буденних, повторюваних завдань для економії часу працівників.

Проте, ворожі актори, безумовно, знайшли способи використовувати цю технологію для атак на вебсайти.

Ось деякі з найкращих прикладів використання, де застосування CAPTCHA може захистити ваш сайт від спаму та зловживань.

Опитування та анкети

Бізнес використовує опитування та анкети з різних причин.

Зовні вони можуть допомогти вам збирати зворотний зв’язок та нові ідеї для продуктів, послуг, маркетингу, брендингу, контенту та всього іншого, що стосується користувачів.

Внутрішньо, опитування та анкети можуть допомогти забезпечити щастя співробітників та зібрати відгуки щодо нових політик та пропозицій.

Ви ж не хотіли б спотворити ці результати великою кількістю автоматизованих, неправдивих відповідей, чи не так?

Ну, боти, безумовно, можуть.

Логіни користувачів

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

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

Чому вони хочуть отримати доступ до цих акаунтів? Іноді це тому, що вони можуть вкрасти інформацію з акаунтів і використовувати її для злому інших онлайн-властивостей. Злом часто відбувається послідовно.

Іноді це робиться для того, щоб використовувати обліковий запис для розміщення рекламних матеріалів або іншої інформації, за яку вони швидко отримають блокування.

Розділи коментарів

Ви, ймовірно, помічали чимало спаму, який з’являється у розділах коментарів на вебсайтах та в соціальних мережах.

Botи використовуються для масового залишення коментарів з метою розповсюдження реклами, конкретної точки зору (наприклад, політичної під час виборів) або посилань на шкідливі джерела, де хакери чекають, щоб вкрасти інформацію відвідувачів.

Форми

Так само, як і розділи коментарів, форми, які не захищені за допомогою CAPTCHA, можуть бути переповнені фальшивими заявками від ботів, запрограмованих, щоб намагатися продати вам щось, поширити певний наратив або навіть вкрасти конфіденційні дані.

Оформлення замовлень

Існує кілька причин, чому хакери можуть захотіти направити своїх ботів на сторінку оформлення замовлення на вебсайті.

Перше очевидне: купівля квитків чи іншого інвентарю зі швидкістю, за якою люди не можуть встигати. А потім, ймовірно, перепродаж їх деінде за вищими цінами. (Ми зовсім не ображені через пропущені квитки на концерт Тейлор Свіфт…)

По-друге, боти можуть використовувати незахищені процеси оформлення замовлення для проведення так званого тестування карток. Це коли вони запускають автоматизовані скрипти у вашій системі оформлення покупки, щоб перевірити, чи можна використовувати вкрадені номери кредитних карток.

Вимагаючи вирішення CAPTCHA перед завершенням вищезазначених дій — ваш сайт повинен вміти ідентифікувати та припиняти більшість автоматизованих зловживань, які проводяться ботами.

Можливі недоліки використання CAPTCHA

Хоча CAPTCHA мають свої переваги, є деякі недоліки, які слід враховувати, коли ви налаштовуєте цю систему на своєму вебсайті:

• CAPTCHAs можуть зробити ваш сайт менш доступним для людей з порушеннями слуху та/або зору або для тих, хто не знає мови, яка використовується у вашій CAPTCHA.
• CAPTCHAs можуть перервати користувацький досвід, і якщо вони занадто складні, можуть завадити залученню навіть людських користувачів.
• CAPTCHAs не є повністю безпомилковими, тому власникам сайтів не слід заспокоюватися хибним відчуттям безпеки — нам все ще потрібно залишатися пильними щодо ознак спаму та атак.

Крім того, є деякі елементи Google’s reCAPTCHA, про які особливо повинні знати власники веб-сайтів:

• reCAPTCHA v3 може здаватися нав’язливим для користувачів, оскільки він моніторить поведінку на всьому сайті для своєї роботи, що може змусити людей, які піклуються про приватність, уникати використання вашого сайту.
• Бізнес-модель Google полягає у використанні або продажі даних для реклами, що може відштовхувати власників сайтів (та користувачів), які не хочуть, щоб їхню поведінку чи дані монетизували.
• reCAPTCHA використовує працю користувачів, збираючи дані з взаємодій користувачів для навчання систем візуальної ідентифікації Google, що може бути некомфортно для деяких людей.
• Google іноді блокується у країнах, таких як Китай, тому інсталяція технологій Google може серйозно обмежити глобальний охоплення веб-сайту.

Як додати reCAPTCHA до WordPress через плагін (6 кроків)

Передмова: CAPTCHAs різних типів можуть бути додані на сайти різного роду.

Проте, оскільки WordPress є однією з найпопулярніших платформ для сайтів та reCAPTCHA від Google потужна, безкоштовна (до мільйона оцінок) і дуже популярна — сьогодні ми зосередимося на їх інтеграції.

Тепер давайте захистимо ваш сайт.

Крок 1: Реєстрація вашого сайту

По-перше, зареєструйте свій сайт WordPress у адміністративній панелі Google reCAPTCHA. Щоб завершити цей крок, вам потрібно увійти в акаунт Google або створити його.

Під час реєстрації ви заповните інформацію, як-от як ви хочете назвати свій вебсайт, який тип верифікації reCAPTCHA ви хочете використовувати, тощо.

Крок 2: Візьміть свої ключі

Після подання реєстрації, Google надасть як ключ сайту, так і секретний ключ. Ось як ви зможете налаштувати зв’язок Google reCAPTCHA з вашим сайтом WordPress.

Скопіюйте їх, адже ми скоро їх використаємо.

Крок 3: Встановлення WordPress Plugin

Тепер увійдіть в WordPress.

Якщо у вас ще не встановлено плагін reCAPTCHA, перейдіть до Панель керування > Plugins > Add New та пошукайте “reCAPTCHA.” reCaptcha by BestWebSoft, CAPTCHA 4WP та Contact Form 7 є популярними варіантами.

Після встановлення більшість цих плагінів допоможуть вам підключити ваш сайт до вашого Google reCAPTCHA. Ми продовжимо цей посібник, використовуючи Contact Form 7 як приклад того, наскільки це може бути доступно.

Крок 4: Увімкнути reCAPTCHA

З встановленим Contact Form 7 перейдіть у Contact > Integration у WordPress. Знайдіть блок інтеграції reCAPTCHA та розпочніть процес налаштування.

Вас попросять вставити ключі сайту та секретні ключі, які ви щойно отримали від Google. Після їх додавання та збереження змін, reCAPTCHA запрацює на вашому сайті.

Для інструкцій з налаштування Contact Form 7, перегляньте нашу статтю в Базі знань про Усунення проблем з контактними формами WordPress.

Крок 5: Додати reCAPTCHA до форми

Тепер, коли ваша функція reCAPTCHA ввімкнена, вам потрібно додати її до будь-яких форм, які ви хочете захистити від відправок ботами.

Щоб зробити це, перейдіть до Contact > Панель керування у WordPress та додайте нову форму.

Тут ви злегка зміните код шаблону форми, щоб додати reCAPTCHA.

Додайте “[recaptcha]” прямо перед рядком “[submit “Submit”]”. Після збереження ви повинні побачити шорткод під заголовком форми.

Крок 6: Опублікуйте форму reCAPTCHA на своєму сайті

Скопіюйте цей короткий код, який ви тільки що створили.

Тепер ідіть вперед і вставте цей код у записи, сторінки або текстові віджети, щоб встановити нову форму, повністю оснащену reCAPTCHA!

Як додати reCAPTCHA до WordPress вручну (4 кроки)

Як альтернативу використанню плагіну, ви можете вручну додати reCAPTCHA до будь-якої форми на вашому веб-сайті.

Це вимагатиме трохи маніпуляцій з кодом. Якщо ви не в захваті від роботи з такими речами, як теги head та фрагменти JavaScript, то вам може бути найбільш комфортно користуватися готовим рішенням з коробки.

Але якщо ви готові згорнути рукава, налаштування речей є досить простим на шкалі від дуже легкого (запуск нового веб-сайту з DreamHost) до дуже складного (вирішення проблеми трьох тіл).

Давайте розпочнемо.

Крок 1: Зареєструйте ваш сайт та отримайте ваші ключі

Як і у випадку з плагіном, вам потрібно почати з реєстрації в reCAPTCHA на вебсайті Google.

Ви можете зробити це у два швидких кроки:

1. Зареєструйте ваш сайт WordPress в адміністративній панелі reCAPTCHA Google та виберіть тип reCAPTCHA.
2. Скопіюйте ваш ключ сайту та секретний ключ для майбутнього використання.

Тепер давайте повернемося до вебсайту, який ми розглядаємо. Існують три основні елементи, які забезпечують роботу reCAPTCHA:

• Бібліотека JavaScript (API reCAPTCHA)
• HTML-форма елементу
• Код перевірки відповіді

Ми розпочнемо з бібліотеки JavaScript reCAPTCHA.

Крок 2: Додати бібліотеку JavaScript reCAPTCHA

Щоб розпочати, нам потрібно додати бібліотеку JavaScript на ваш сайт. Це невеликий фрагмент коду, який потрібно додати на кожну сторінку, яка використовуватиме reCAPTCHA:

“<script src="https://www.google.com/recaptcha/api.js" async defer></script>”

Найпростіший спосіб забезпечити доступність цього на всіх необхідних сторінках – додати це до вашого універсального заголовка перед закриваючим тегом “</head>”.

Ви можете зробити це одним із двох способів:

1. Вручну, зайшовши в header.php безпосередньо через адміністратора WordPress, або файловий менеджер у вашій панелі керування хостингом
2. Використовуючи плагін для додавання коду в ваш заголовок

Ручне додавання коду

Якщо ви оберете перший варіант, вам потрібно буде використати редактор файлів теми всередині WordPress або ваш файловий менеджер для доступу до header.php безпосередньо.

Важлива примітка: Редагування файлів вашої теми безпосередньо може зламати ваш сайт, і ваші зміни можуть бути втрачені під час оновлення теми. Якщо ви не маєте досвіду з безпосереднім редагуванням файлів теми, перейдіть до розділу “Використання плагіна для додавання коду” для менш ризикованого рішення.

Ваш файловий менеджер виглядатиме по-різному в залежності від вашого хоста, але якщо ви використовуєте DreamHost, перейдіть до WordPress > Managed WordPress у бічній панелі. Знайдіть домен, до якого ви хочете додати reCAPTCHA, і виберіть Управління.

Потім, клацніть на кнопку Управління файлами у розділі Деталі.

Відкрийте папку, що має назву вашого домену. Звідти ви перейдете до wp-content > themes і знайдете папку для вашої поточної теми WordPress.

Знайдіть файл під назвою header.php, відкрийте його та знайдіть закриваючий <code>“&lt;/head&gt;”</code> тег у коді.

Скопіюйте та вставте фрагмент JavaScript reCAPTCHA прямо перед цим рядком.

Використання плагіна для додавання коду

Якщо вищеописане здається надто складним, не хвилюйтеся. Ми все підготували для вас.

Замість цього, ви можете встановити WordPress plugin, який автоматично додасть код безпосередньо до вашого заголовка без необхідності зламу.

Використовуючи плагін, як WPCode, ви можете легко додавати відповідні фрагменти коду в ключові частини вашої теми WordPress.

З вашої панелі адміністратора WordPress перейдіть до Plugins > Add New і введіть у пошук WPCode.

Клік Встановити, потім Активувати.

Після активації WPCode ви повинні побачити новий розділ у лівому бічному меню під назвою Code Snippets.

Перейдіть до Code Snippets > Header & Footer.

У сторінці Header & Footer вставте JavaScript код у розділ Header та збережіть зміни.

Бум — код додано!

Крок 3: Додайте reCAPTCHA до вашої форми

Тепер ми налаштуємо код на формі, на якій ви хочете бачити вашу reCAPTCHA.

Знову ж таки, ви можете скористатися менеджером файлів, редактором WordPress або навіть FTP.  Він повинен бути розміщений у папці wp-content , яка містить усі ваші плагіни, теми та медіафайли.

У коді форми вставте наступний код перед рядком відправлення, щоб додати reCAPTCHA:

“<div class="g-recaptcha" data-sitekey="your_site_key"></div>”

Ось приклад того, як це може виглядати:

Замініть “your_site_key” на ключ сайту, який ви отримали від Google.

Крок 4: Обробка відповіді

Можливо, найскладнішою частиною процесу є додавання коду для обробки відповіді від reCAPTCHA. Це по суті вказує вашому сайту, чи обробляти форму, чи блокувати її.

Для налаштування цього вам потрібно додати ще один фрагмент коду до форми (функція зворотного виклику):

$secretKey = "your_secret_key";
$response = $_POST['g-recaptcha-response'];
$remoteIp = $_SERVER['REMOTE_ADDR'];

$url = "https://www.google.com/recaptcha/api/siteverify?secret=".$secretKey."&response=".$response."&remoteip=".$remoteIp;
$response = file_get_contents($url);
$responseKeys = json_decode($response,true);

if(intval($responseKeys["success"]) !== 1) {
    // Обробка невдачі перевірки reCAPTCHA
} else {
    // Обробка подання форми
}”

У цьому коді вам потрібно замінити “your_secret_key” на секретний ключ, наданий Google.

Це лише один приклад реалізації, яка дозволить вам налаштувати обробку відправлення. Існує багато інших методів для обробки серверної валідації та функцій зворотного виклику.

Для отримання додаткової інформації про те, як обробляти цю частину процесу, зверніться до офіційної документації від Google.

Прощавай Spam, Вітаємо Безпеку

Хоча ми повинні повторити, що reCAPTCHA та CAPTCHA не є єдиним рішенням у питанні безпеки веб-сайтів, вони є важливим кроком у допомозі вам захиститися від автоматизованих ботів та хакерів з поганими намірами.

Для більшої кількості порад щодо захисту вашого вебсайту WordPress та більше, слідкуйте за DreamHost блогом. Ми завжди публікуємо ресурси, щоб допомогти вам тримати ваш сайт безпечним, швидким та в мережі, щоб вразити відвідувачів сайту та пошукові системи.

Ви мрієте, ми кодуємо

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

Дізнатися більше

Alex Brown