G|Translate: English EN Français FR Deutsch DE Italiano IT Русский RU Español ES

Защищаем форму обратной связи от ботов

Есть форма обратной связи для клиентов

Защищаем форму обратной связи от ботов

Читаем статью

Форма обратной связи

Проблема в том, что если просто разместить код html формы на странице – рекламные боты замучают.  И fail2ban особо не поможет, т.к. IP-адресов много и они динамически меняются. 

И будет что-то типа такого безобразия

Защищаем форму обратной связи от ботов

Да, добавление разных фильтров (у нас же есть PHP под рукой) помогает – но сервер PHP будет заниматься этой чепухой, вместо того, что бы работать с реальными посетителями сайта.

Что делать?

Создаем форму обратной связи через PHP

Будем прятать форму от глупых ботов. Да, умные боты её все равно найдут, но их будет менее 5% от общего числа ботнетов.

Спрячем форму в файл form.php, который будет вызываться по клику и создавать форму на экране.

Стоп, а какая разница? Ведь всё равно у скрита будет прямой URL, по которому его можно вызвать? И все эти названия в любом случае видны в коде сайта.

Но разница есть.

mysite/form.html

mysite/form.php

В первом случае вызывается готовый файл html, в котором бот может точно также на автомате заполнять поля.

Во втором случае скрипт PHP создает форму. 

echo 'Имя: <input type= "text" name= "name" value="" placeholder="optional"> <br/>';
echo 'E-mail*: <input type= "text" size = "17" name= "email" value="" placeholder="optional"><br/>';

и так далее.

И мы можем запретить прямой вызов скрипта.

Как-то так

if (рефер не принадлежит сайту) {
   // вызов файла-заглушки
}

А в файле-заглушке устанавливаем 404 ошибку

<?PHP
header($_SERVER['SERVER_PROTOCOL']." 404 Not Found");
echo '<html>'; 
echo <head>'; 
echo </head>'; 
echo <body>'; 
echo </body>'; 
echo </html>';
?>

Вот здесь подробнее

Защищаем скрипт PHP от прямого вызова

В результате бот будет получать ошибку 404 вместо формы:) Вот, например, проверка ответа сервера через Яндекс

Защищаем форму обратной связи от ботов

Красота!

Что бы форма создалась – нужно скрипт вызвать со страницы сайта, т.е. с правильным рефером. Да, есть мощные боты, которые умеют полностью моделировать работу браузера (библиотека Curl PHP), но их меньшинство.

Создаем красивую картинку для вызова формы обратной связи

Для привлечения внимания можно сделать бегущую строку в gif-файле

Защищаем форму обратной связи от ботов

Вот онлайн сервис для создания такой надписи http://rooltime.com/animacija-teksta.html

Но если нам еще нужна подложка (фон) – то ситуация будет сложнее.

Защищаем форму обратной связи от ботов

Как совместить две картинки (наложить одну картинку на другую)? Можно сделать простое решение, просто вклеить gif на jpg – но тогда размер файла получится порядка 150 Кб, что не есть хорошо на каждой странице сайта.

Вот сервис https://gfto.ru/index/obedinit_png_jpeg_s_gif_animaciej/0-77

В таком случае картина фона будет добавлена в каждый кадр gif, что и приводит к сильному росту размера итогового файла.

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

Но эта схема работает только в данном конкретном месте. Если мы хотим показывать слоенную картинку на разных сайтах с разным разрешением – то картинки будут съезжать относительно друг друга.

Т.е. нам надо так собрать две картинки в одну, что итоговая картинка могла масштабироваться в зависимости от место расположения.

Выход есть – SVG.

SVG (от англ. Scalable Vector Graphics — масштабируемая векторная графика) — язык разметки масштабируемой векторной графики.

Но SVG-формат не только позволяет создавать векторную графику с помощью текста, но и позволяет выводить несколько картинок, как единое целое.

Вот так

<svg width="100%" viewBox="0 0 200 85"
xmlns="https://www.w3.org/2000/svg" 
xmlns:xlink="https://www.w3.org/1999/xlink">
<image xlink:href="fon.jpg" x="0" y="0" width="100%" />
<image xlink:href="gif.gif" x="5" y="35" width="95%" /> 
</svg>

 

Большинство браузеров поддерживают эту конструкцию

Защищаем форму обратной связи от ботов

Делаем форму обратной связи в всплывающем окне с паранджой

Последний штрих

Читаем статью

Делаем модальное окно iFrame для WordPress

Нам осталось только сделать ссылку на объекте SVG абсолютно стандартным способом

<a 'href="'https://mysite.ru/form.php" class="myModal" data-width="330" data-height="400"><svg>...</svg></a>

 

где class=”myModal” – привязка к модальному окну

 


Вы можете сохранить ссылку на эту страницу себе на компьютер в виде htm файла





Почитать в разделе: БЕЗОПАСНОСТЬ САЙТА

  • Всего статей в разделе: 8
  • Показано статей в списке: 5
  • Сортировка: название по алфавиту

HTTP заголовки безопасности

Что это за загадочные письмена? В процессе запроса сайта с сервера - браузер и сервер обмениваются информацией. Сервер может заранее сообщить браузеру, что можно и что нельзя делать с сайтом. Про взаимодействие браузера и сервера читаем здесь Security HTTP Headers для "чайников" Например сервер может указать браузеру: сразу переходить на HTTPS-версию запрещать открывать сайт во фрейме и так далее За это как раз отвечают HTTP заголовки безопасности. Проверить свой сайт можно на...
(Читать полностью...)

Как включить HTTPS на сайте?

Существуют два основных протокола передачи данных от сервера к пользователю http - трафик между ПК пользователя и хостингом не шифруется (враги могут добавить рекламу для показа на Вашем сайте) https - трафик между ПК пользователя и хостингом шифруется (т.е. например, Ваш провайдер не сможет увидеть, какая информация идет с сайта / на сайт) Более того, в последнее время поисковые машины начинают отдавать предпочтения сайтам с протоколом https (поднимая сайты в выдаче и считая их более безопасными для пользователя). HTTPS (англ. HyperText Transfer Protocol Secure) — расширение протокола HTTP, для поддержки шифрования в целях повышения безопасности. Данные в протоколе HTTPS передаются...
(Читать полностью...)

Как проверить сайт на вирусы?

Для чего это надо? Что быть уверенным, что это Ваш сайт :) Фактически векторы атаки разные и там могут быть не только вирусы: - добавлена переадресация на чужой сайт - воруют Ваш трафик - переадресация на сайт с троянами - используют Ваш сайт для создания ботнета - Ваш сайт уже является частью ботнета - с помощью Вашего сайта (точнее сервиса хостинга) рассылается спам Самая простая регулярная проверка сайта на вирусы - добавить сайт в Вебмастер mail.ru = там по умолчанию встроен бесплатный антивирус, точнее набор...
(Читать полностью...)

Настраиваем fail2ban под свои задачи

Крайне полезное серверное приложение Linux - настраиваем под себя Про установку и запуск читаем здесь Установка fail2ban на Linux Для самостоятельной настройки нужно: лог с данными настроить фильтр (получение IP из лога) действия (что делать с этими IP) и джайл - связать фильтр и действие :) Например, как это сделать для блокировки ботов-подборщиков логина и пароля в WordPress - читаем статью Блокируем ботов-подборщиков через fail2ban Или создаем свой вариант. Делаем свой лог Например в корневой папке web-server (в папках выше политика безопасности сервера не даст доступа нашему...
(Читать полностью...)

Установка fail2ban на Linux

Устанавливаем и запускаем fail2ban на Linux Сначала разберемся с названиями. Всё это - "детальки" сервера на Linux Название Описание netfilter Межсетевой экран (брандмауэр), встроен в ядро Linux с версии 2.4. iptables (IP4) ip6tables (IP6) Название пользовательской утилиты (запускаемой из командной строки), предназначенной для управления системой netfilter. ipset Позволяет использовать большие таблицы IP и MAC адресов, подсетей, номеров портов совместно...
(Читать полностью...)