Бесплатный вебинар
«как найти любимую работу»
Подарки на 150 000 ₽ за участие
Живой эфир
Записи не будет!
00:00:00:00
дн.ч.мин.сек.

Борьба со спамом в формах: без капчи и Javascript

Быстрый ответ

Метод «honeypot» предусматривает использование невидимого для пользователей дополнительного поля в форме, которое, как предполагается, заполнит бот:

HTML
Скопировать код
<form id="myForm" action="submit">
  <!-- Honeypot: боты заполняют, пользователи не видят -->
  <input id="honeypot" type="text" name="_hidden" style="opacity:0; position:absolute; top:0; left:-5000px;"/>
  <!-- Реальные поля -->
  <input type="text" name="user" />
  <input type="submit" />
</form>
<script>
  // Это словно расставление мышеловок 
  document.getElementById('myForm').addEventListener('submit', function(e) {
    if(document.getElementById('honeypot').value !== '') {
      e.preventDefault(); // Воткнулся, бот!
    }
  });
</script>

Если при отправке формы поле _hidden заполнено, это интерпретируется как активность бота.

Кинга Идем в IT: пошаговый план для смены профессии

Усовершенствованная борьба с ботами

Анализ времени

Оцените промежуток времени между моментом открытия формы и моментом её отправки. Если этот процесс происходит чрезвычайно быстро, это вероятно означает, что перед вами бот.

php
Скопировать код
session_start();
// Начинаем отсчёт времени...
$_SESSION['form_started'] = time();

// Позже, когда форма отправлена:
$duration = time() – $_SESSION['form_started'];
if ($duration < 5) { // Меньше 5 секунд? Полагаем, это бот!
  // Слишком быстро, это точно бот.
}
Подробнее об этом расскажет наш спикер на видео
skypro youtube speaker

Пользователи с отключённым JavaScript

С помощью тега noscript вы можете информировать пользователей без включённого JavaScript о том, что им не следует заполнять поле-ловушку.

HTML
Скопировать код
<noscript>Не заполняйте это поле, оно как раз наоборот, не для вас создано</noscript>
<input type="text" name="_hidden" />

Мастерство в применении CSS

Используйте CSS так, чтобы сделать поле-ловушку невидимым, при этом не применяя display:none.

CSS
Скопировать код
._hidden { 
  // Настоящий мастер игры в прятки
  position: absolute;
  left: -9999px;
}

Динамическая загрузка формы

В качестве дополнительной меры защиты можно загрузить форму посредством AJAX. Однако, если JavaScript отключён, этот подход не будет эффективным.

JS
Скопировать код
function loadForm() {
  // Загружаем и отображаем форму
}
// Очередь – не для ботов
if (window.addEventListener) window.addEventListener("load", loadForm, false);
else if(window.attachEvent) window.attachEvent("onload", loadForm);

Не забывайте о вариантах для пользователей без JavaScript.

Адаптивность защиты

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

Визуализация

Борьба с ботами ассоциируется с крепостью, которая усилена различными методами обеспечения безопасности:

Markdown
Скопировать код
    | Непроходимая комната   | Здесь...                  |
    | ----------------------- | ------------------------- |
    | Зал CAPTCHA (🧩)        | 🛡️ Боты провалили задание |
    | Зал с невидимым полем (🕳️)| 🕵️ Боты заблудились       |
    | Зал временного анализа (⏱️)| 🧭 Боты торопятся и совершают ошибки |
    | Зал с полем-ловушкой (🍯)| 🪤 Боты попали в ловушку   |

Каждый «зал защиты» укрепляет вашу крепость.

Погружение в метод «поле-ловушка»

Противостояние продвинутым ботам

Когда боты начинают адаптироваться к CSS и JavaScript, следует пересмотреть способы отправки форм и усилить протоколы безопасности.

Приоритет доступности

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

Недоверие к собственному серверу

Не следует полностью полагаться на метод «honeypot». Дополнительная проверка на серверной стороне увеличивает надёжность системы защиты.

Важность конфиденциальности

Если вы собираете данные пользователей, включая временные метки или иные сведения, убедитесь, что вы соблюдаете GDPR и другие нормы конфиденциальности.

Полезные материалы

  1. reCAPTCHA — основной инструмент защиты от автоматизированной отправки форм от Google.
  2. HTML Standard — документация об атрибуте автозаполнения и его влиянии на поведение форм.
  3. Атрибут pattern в HTML – HTML: HyperText Markup Language | MDN — руководство по реализации валидационных техник с использованием pattern.
  4. Лучшая реализация Honeypot (Форма анти-спам) – Stack Overflow — дискуссия о методах «honeypot» среди сообщества разработчиков.
  5. Перекрестные запросы на сторонние ресурсы (CSRF) | OWASP Foundation — информация о токенах CSRF и их значении для защиты от спама.
  6. Метод addEventListener() объекта EventTarget – Веб API | MDN — как использовать слушатели событий JavaScript для улучшения управления формами.
  7. PHP: Защита настроек сессии INI – Руководство — руководство по PHP с советами по обеспечению безопасности сессий.
Проверь как ты усвоил материалы статьи
Пройди тест и узнай насколько ты лучше других читателей
Какой метод используется для борьбы со спамом в формах без капчи и JavaScript?
1 / 5