Як самостійно додати Google reCAPTCHA на свій сайт?

Як самостійно додати Google reCAPTCHA на свій сайт?

27.07.2020
398
5 хв.
Оренда серверів DELTAHOST Блог Як зробити сайт Як самостійно додати Google reCAPTCHA на свій сайт?

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

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

Які переваги капчі на сайт?

Google reCAPTCHA

Всі переваги, пов’язані з установкою капчи на веб-ресурс, пов’язані з припиненням спроб спаму, який розповсюджується ботами. Ще на етапі, коли визначаєтесь, як створити сайт і вибираєте візуальні складові і начинку майбутнього онлайн-проекту, потрібно знайти варіанти боротьби зі спамом. Система капчі забезпечує безпеку і надає такі можливості:

  • на онлайн-ресурсах практично зникне спам — наприклад, якщо встановити додатково плагін Akismet для сайту на основі WordPress, доступ ботів наблизиться до нуля;
  • надається високий рівень надійності — система елементарна і ставить завдання, які просто вирішити людині, але майже неможливо боту;
  • характеризується невеликими розмірами — має високу ефективність, та невисоке навантаження на сервер;
  • не вимагає складної установки — досить закачати файли на сервер, щоб почати використовувати капчі;
  • є безкоштовним — більшість популярних сервісів, в числі яких і Google reCAPTCHA, не вимагає додаткових грошових вкладень.

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

Основні види капчи

reCAPTCHA

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

Math Comment Spam Protection

Елементарний протектор, дуже простий у використанні і установці. Щоб успішно пройти перевірку, користувачам достатньо вирішити просту задачку, наприклад, написати у відповідному віконці, скільки буде 7 + 9. Навіть для школярів проходження капчи не складе труднощів, а ось ботам в зв’язку з обмеженістю функціоналу подібні завдання не під силу.

CheckBot

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

Anti-Spam Image

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

Дуже стара капча, і цим пояснюється її недосконалість: багато фото виглядають неестетично чи є нечіткими, через що у користувачів іноді виникають складності з введенням. Проте, у зв’язку з високим рівнем ефективності інструмент досі залишається конкурентоспроможним.

yaCAPTCHA

Тест Тьюринга, який одним з перших почав використовуватися на інтернет-просторі. Для проходження користувачам необхідно здійснити введення комбінацій цифр і букв, написаних на розмитому фоні і кілька спотворених. Головні проблеми цієї капчи пов’язані з тим, що далеко не всі люди з першого разу успішно проходять тест, тому що не завжди зрозуміло, що саме написано. Однак така витонченість забезпечує високий рівень захисту від спаму.

reCAPTCHA

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

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

Реєстрація та отримання ключів для reCAPTCHA

Щоб почати роботу з Google reCAPTCHA, потрібно зареєструватися на веб-сайті https://www.google.com/recaptcha, після чого отримати два ключа. Загальний алгоритм дій такий:

  1. Відкрити сторінку у https://www.google.com/recaptcha.
  2. Натиснути на кнопку «Отримати reCAPTCHA» (актуально для користувачів з активними гугл-акаунтами, всім іншим доведеться додатково зареєструватися).
  3. Ввести назви домену та сайту в форму «Реєстрація сайта».
  4. Натиснути на кнопку «Реєстрація», після чого буде згенеровано два ключа.

Зверніть увагу: перший отриманий ключ є публічним, а другий — секретним. Публічний слід додати в HTML-код сайту, секретний ж потрібен для установки зв’язку скрипта сервера з сервісом reCAPTCHA.

Підключення reCAPTCHA до HTML-документу

Щоб встановити рекапчу на веб-сайт, необхідно провести маніпуляції на стороні клієнта (в HTML-документі), а також на сервері. Підключити віджет капчи на сторінку можна, виконавши всього дві нескладних дії:

  1. Включити в JavaScript-сторінку скрипт reCAPTCHA.
  2. Додати елемент div.

На другому пункті слід зупинитися більш докладно. В елементі div необхідно додати клас g-recaptcha і атрибут data-sitekey. При цьому значенням атрибута вказати отриманий раніше публічний ключ. Ще один важливий ідентифікатор, з яким повинен бути div, — id = «recaptchaError«. Завдання даного елемента полягає в тому, щоб відображати помилки, які можуть виникнути під час роботи капчі. Крім цього, треба внести зміни в файл script.js, щоб коректно працювала форма зворотного зв’язку.

Перевірка сторінок з підтримкою reCAPTCHA

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

  • контактні форми — для перевірки слід перейти на сторінку Contact Us;
  • форми відгуків — треба перейти на сторінку одного з товарів і вибрати вкладку Reviews;
  • форми повернення — перевірка на front end потрібно, щоб переконатися, що товари повертають реальні користувачі.

При правильному налаштуванні на сторінках внизу буде прямокутник з написом «I’m not a robot» і можливістю поставити галочку.

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

Щоб забезпечити всебічну безпеку інтернет-ресурсу, рекомендуємо також замовити послугу оренди віртуального VPS сервера від хостинг-провайдера Дельтахост. Наша компанія гарантує збереження особистих даних, безперебійну роботу і постійну технічну підтримку. Потужне обладнання, фізичне розташування серверів в США, Нідерландах і Україні.

Поділитися з друзями

Deltahost
Deltahost - Facebook