Как создать безспамовую контактную форму без капч

1. Цель
2. Эта проблема
3. Решение
4. Часть 2: Адрес электронной почты с возможностью нажатия
5. Полные примеры
6. Версия WordPress
7. Нужна помощь?
8. об авторе

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

В этой статье рассказывается, как использовать некоторые простые HTML, CSS и Javascript для защиты вашей личной информации, не заставляя ваших гостей прыгать через обручи.

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

Цель

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

Эта проблема

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

Решение

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

Мы собираемся создать стандартную контактную форму с одной дополнительной функцией: ввод с именем «url» и примечание рядом с ним «Не вводите здесь ничего!»

HTML:

<form action = "/ submit.php" method = "post"> <p> Ваше имя: <input type = "text" name = "name" /> </ p> <p> Ваш электронный адрес: <input type = "text" name = "email" /> </ p> <p class = "antispam"> Оставьте это поле пустым: <input type = "text" name = "url" /> </ p> <p> <textarea name = "message"> </ textarea> </ p> <p> <input type = "submit" value = "Send" /> </ p> </ form>

Затем мы используем CSS, чтобы скрыть ввод и заметку.

CSS:

.antispam {display: none;}

Затем мы создаем правило на сервере, которое гласит: «Если пользователь напечатал что-либо в поле« url », то выбросьте его».

PHP:

if (isset ($ _POST ['url']) && $ _POST ['url'] == '' {mail ('[email protected]', 'Контактная форма', print_r ($ _ POST, true)); } <h1> Спасибо </ h1> Мы свяжемся с вами как можно скорее

Обычный человек даже не увидит коробку нормально, и поэтому оставит ее пустой, даже не думая об этом. Если CSS не загружается, они получают примечание, объясняющее, что делать.

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

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

Часть 2: Адрес электронной почты с возможностью нажатия

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

Javascript:

var first = "ваше имя"; var last = "yoursite.com";

HTML:

Мой адрес электронной почты: <script type = "text / javascript"> document .write ('<a href="mailto:' +first +'@' + last+'">' + first + '@' + last + ' <\ / a> '); </ script> <noscript> Пожалуйста, включите JavaScript или используйте мою <a href = "/ contact.php"> форму контакта </ a> </ noscript>

Обычный пользователь увидит обычный адрес электронной почты и все просто работает. Пользователь, у которого отключен JavaScript, увидит объяснение и альтернативное решение. И спамер ничего не увидит!

Этот метод может быть легко распространен на номера телефонов и другую личную информацию.

Это были наиболее часто запрашиваемые функции, поэтому я добавил расширенную версию, которая изменяет поле «От:» в сообщении электронной почты на то, что пользователь ввел в поле, и удаляет все скобки массива из тела сообщения:

if (isset ($ _POST ['url']) && $ _POST ['url'] == '' {$ youremail = '[email protected]'; $ body = "Это форма, которая была только что отправлена: Имя: $ _POST [имя] E-Mail: $ _POST [электронная почта] Сообщение: $ _POST [сообщение]"; if ($ _POST ['email'] &&! preg_match ("/ [\ r \ n] /", $ _POST ['email'])) {$ headers = "From: $ _POST [email]"; } else {$ headers = "From: $ youremail"; } mail ($ youremail, 'Contact Form', $ body, $ headers); }

Функция preg_match () предназначена для того, чтобы спамеры не могли злоупотреблять вашим сервером, вставляя в заголовок дополнительные поля (такие как CC и BCC). Взгляни на http://www.thesitewizard.com/php/protect-script-from-email-injection.shtml для получения дополнительной информации.

if (isset ($ _POST ['url']) && $ _POST ['url'] == '' {{($ _POST ["message"] == "" || $ _POST ["name"] == "") {echo "<p> Пожалуйста, нажмите кнопку" Назад "и заполните все поля </ p>"; } else {mail ('[email protected]', 'Контактная форма', print_r ($ _ POST, true)); }} <h1> Спасибо </ h1> <p> Мы свяжемся с вами как можно скорее </ p> if (isset ($ _POST ['url']) && $ _POST ['url'] == '') {mail ('[email protected]', 'Контактная форма', print_r ($ _ POST, true)); } заголовок ('Location: http://www.mysite.com/thankyou.html'); выход («Перенаправление на http://www.mysite.com/thankyou.html»);

Полные примеры

Полная рабочая копия кода доступна для просматривать на Github и вы также можете скачать .zip файл кода

Для живой демонстрации, см. http://spam-free-contact-example.herokuapp.com/simple/contact.htm

Версия WordPress

Я обнаружил, что есть плагин для защиты от спама для WordPress, который использует методы, аналогичные описанным здесь: http://wordpress.org/extend/plugins/nospamnx/ - Я установил его в этом блоге, и пока он остановил почти 30 000 спам-комментариев.

Нужна помощь?

Я могу помочь вам настроить и / или связать вас с другими компетентными разработчиками. Для меня типичная установка будет стоить около 500 долларов, но вы, вероятно, найдете более дешевый вариант, разместив работу на Еланке , (Ссылка на эту страницу в описании вакансии, а затем поиск разработчиков с навыками php и электронной почты и предложение их подать заявку.)

об авторе

Натан опытный веб-разработчик, который внимательно следит за безопасностью и усердно работает с пользователем. В настоящее время он работает в основном на JavaScript и Node.js.

Однако в центре внимания никогда не было технологии - речь идет о решении проблем и удовлетворении потребностей. «Компьютеры работают для нас, а не наоборот».

Похожие

Комментарии