alexts

3.Капча на странице "Свяжитесь с нами"

Recommended Posts

alexts

Repost


В данной статье я просто покажу пример, как добавить каптчу на любую страницу интернет-магазина, основанного на VaM Shop.
Рассмотрим добавление каптчи на страницу обратной связи (Свяжитесь с нами) и на страницу регистрации клиента (create_account.php), но Вы не пугайтесь, принцип везде один и тот же, поняв принцип, Вы легко сможете добавить каптчу на любую страницу.
Для начала, что такое captcha - это случайно генерируемая картинка, на которой изображён набор цифр и/или символов в случайном порядке. Пользователь должен ввести указанные на картинки символы в форме, иначе он не может, к примеру, зарегистрироваться в магазине.
Каптча - это эффективный инструмент против спамеров, спам-ботов и прочей нечисти в интернете, также служит для предотвращения автоматических регистраций роботами, "бомбинга" и т.д. Полезная вещь и даже необходимая в некоторых ситуациях.
Человек видит такую случайную картинку и различает символы и цифры, а вот робот такие картинки понять не может, да, существуют и особо продвинутые роботы, которые умеют различать простенькие каптчи, но не более, т.е. каптча является достаточно надёжным средством, я имею в виду каптчу, которая используемая в VaM Shop, на картинке используются различные эффекты: "прыгающие буквы", фон. Надеюсь, что этого вполне достаточно для защиты страниц от роботов.
Так вот, в VaM Shop каптча применяется по умолчанию, к примеру, при подписке на рассылку, при напоминании пароля.
Я покажу, как добавлять каптчу и к другим страницам, в данном примере будет показано как добавить каптчу на страницу Свяжитесь с нами, т.к. очень часто через данную форму может приходить множество спама, могут просто "бомбить" Ваш почтовый ящик тысячами и десятками тысяч сообщений через форму обратной связи, вобщем, проблем может быть много от роботов, гуляющих по интернету, либо просто если кто-то решит максимально осложнить работу Вашего интернет-магазина.
Итак, начнём.
Файл свяжитесь с нами - /shop_content.php
Открываем его.
Добавляем в нашу форму обратной связи вывод случайно картинки и поле для ввода.
Находим:
$vamTemplate->assign('INPUT_TEXT', vam_draw_textarea_field('message_body', 'soft', 50, 15, $_POST[''],''));

Ниже добавляем:
$vamTemplate->assign('CAPTCHA_IMG', '<img src="'.vam_href_link(FILENAME_DISPLAY_CAPTCHA).'" alt="captcha" />');
$vamTemplate->assign('CAPTCHA_INPUT', vam_draw_input_field('captcha', '', 'size="6"', 'text', false));
Мы добавими две смарти-метки VVIMG и INPUT_CODE, который мы затем вставим в шаблон страницы обратной связи.
Теперь добавим проверку, правильно ли посетитель указал символы, указанные на картинке.
Ищем код:
if (vam_validate_email(trim($_POST['email']))) {

Меняем на:
if ((vam_validate_email(trim($_POST['email']))) && ($_POST['captcha'] == $_SESSION['vvcode'])) {
Теперь открываем шаблон страницы обратной связи. Это файл /templates/шаблон/module/contact_us.html.
Находим следующий код:

{#text_email#} {$INPUT_EMAIL}

Ниже добавляем:
{#text_sec_code#} {$CAPTCHA_IMG}
{#text_sec_code_text#} {$CAPTCHA_INPUT}

Как Вы видите, мы просто вставили метки, которые ранее определили в файле shop_content.php. а именно {$CAPTCHA_IMG} и {$INPUT_CODE}.
Также мы добавили в шаблон текстовые метки {#text_sec_code#} и {#text_sec_code_text#}.
Теперь нам нужно определить их в языковом файле.
Открываем файл /lang/lang_russian.conf.
Ищем блок констант для страницы contact_us, находим:
[contact_us]
text_name = 'Ваше имя:'
text_email = 'Ваш E-Mail:'
text_message = 'Ваше сообщение:'
text_success = 'Ваше сообщение было успешно отправлено.'

Добавляем новые константы, т.е. меняем данный код на:
[contact_us]
text_name = 'Ваше имя:'
text_email = 'Ваш E-Mail:'
text_message = 'Ваше сообщение:'
text_success = 'Ваше сообщение было успешно отправлено.'
text_sec_code = 'Картинка:'
text_sec_code_text = 'Укажите код на картинке:'
В принципе, на этом всё, разве что можно ещё добавить небольшое пояснение по поводу каптчи в текст ошибки.
Для этого в откройте файл /lang/russian/russian.php
Ищите:
define('ERROR_MAIL','Пожалуйста, проверьте указанные в форме данные');

Замените на:
define('ERROR_MAIL','Пожалуйста, проверьте указанные в форме данные.
Код, указанный на картинке нужно вводить с учётом регистра.
Если на картинке буква заглавная, Вы тоже должны вводить заглавную букву.');
Вот и всё, мы защитили страницу обратной связи от "интернет-нечисти"
Ещё один пример, добавим каптчу на страницу регистрации клиента create_account.php.
Я в этом примере подробно расписывать не буду, т.к. уже достаточно подробно было рассказано в первом примере, просто покажу где и что менять.
Принцип абсолютно тот же самый, добавляем проверку в скрипт, правильно ли указал посетитель код с картинки и добавляем вывод картинки в шаблон, ничего нового.
Итак, открываем файл /create_account.php
Добавляем проверку, правильно ли посетитель ввёл код, указанный на картинке.
Ищем:
if (ACCOUNT_TELE == 'true') {
if (strlen($telephone) < ENTRY_TELEPHONE_MIN_LENGTH) {
$error = true;
$messageStack->add('create_account', ENTRY_TELEPHONE_NUMBER_ERROR);
}
}

Добавляем после:
if ($_POST['captcha'] != $_SESSION['vvcode']) {
$error = true;
$messageStack->add('create_account', ENTRY_CAPTCHA_ERROR);
}
Теперь добавлем метки для шаблона.
Ищем:
$vamTemplate->assign('INPUT_PASSWORD', vam_draw_password_fieldNote(array ('name' => 'password', 'text' => ' '. (vam_not_null(ENTRY_PASSWORD_TEXT) ? ''.ENTRY_PASSWORD_TEXT.'' : '')), '', 'id="password"'));

Добавляем после:
$vamTemplate->assign('CAPTCHA_IMG', '<img src="'.vam_href_link(FILENAME_DISPLAY_CAPTCHA).'" alt="captcha" />');
$vamTemplate->assign('CAPTCHA_INPUT', vam_draw_input_field('captcha', '', 'size="6"', 'text', false));
Теперь добавим эти метки в шаблон, т.е. добавим вывод картинки на страницу регистрации.
Открываем файл /templates/vamshop/module/create_account.html
Ищем:
{#text_confirmation#} {$INPUT_CONFIRMATION}

Добавляем после:
{#text_sec_code#} {$CAPTCHA_IMG}
{#text_sec_code_text#} {$CAPTCHA_INPUT}
Последний шаг, добавим текстовые константы в языковые файлы.
Открываем файл /lang/russian/lang_russian.conf
Ищем:
# Creat account
[create_account]
heading_create_account = 'Регистрация'

Добавляем после:
text_sec_code = 'Картинка:'
text_sec_code_text = 'Укажите код на картинке (учитывая регистр):'
Добавим текстовую константу для ошибки, в случае, если посетитель неправильно указал код на картинке.
Открываем файл /lang/russian/russian.php
Ищем:
define('ENTRY_PASSWORD_NEW_ERROR_NOT_MATCHING', 'Поля Подтвердите пароль и Новый пароль должны совпадать.');

Добавляем после:
define('ENTRY_CAPTCHA_ERROR','Вы указали неправильный код картинки. Код, указанный на картинке нужно вводить с учётом регистра.
Если на картинке буква заглавная, Вы тоже должны вводить заглавную букву.');
Вот и всё, мы добавили каптчу на страницу регистрации клиента.
Ответить
Цитата
Изменить
Скрыть
[/CODE]

Edited by KoVaLsKy

Share this post


Link to post
Share on other sites
geval

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

Share this post


Link to post
Share on other sites
KoVaLsKy

это почему же?

Share this post


Link to post
Share on other sites
Leon

Спасибо большое, всё получилось и работает. Капча - это нужное дело.

Но есть один нюанс, было бы хорошо, если бы Вы помогли его реализовать:

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

Share this post


Link to post
Share on other sites
support

Посмотрите как сделано на странице задать вопрос о товаре, там кнопка обновить как раз есть, сделайте по аналогии и на странице карточки товара.

 

А вообще ставить каптчу нет смысла если у Вас нет кучи спама, зачем жизнь усложнять посетителям.

 

Вот когда будет проблема со спамом, тогда и можно будет думать.

Share this post


Link to post
Share on other sites
alexts

Я на 1.67 "обновить"не сам делал, а заказывал, а потом обновление капчи  появилось штатно в движке.

Думается, что будет капча - не будет спама. А юзеры к капче везде и всюду уже привыкли как к данности.

Share this post


Link to post
Share on other sites
YuraS

Думается, что будет капча - не будет спама.

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

Share this post


Link to post
Share on other sites
support

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

Share this post


Link to post
Share on other sites
alexts

Ну не знаю. Чахлый крючочек все же лучше двери на распашку. Может лучше довести капчу до уровня, как в джумловских модулях. Там по очереди выскакивает картинка разного типа: и запрос суммы цифр, и разные типы рисунков. Может я никому и не нужен, но на джумловсом сайте нет проблем уж года полтора -два. Тьфу тьфу, тьфу :)

Share this post


Link to post
Share on other sites
shaklov

А я просто давно переименовываю поля в форме обратной связи и боты понятия не имеют, что это за форма.

Реальный пример: стали спамить в отзывы о товаре - по нескольку отзывов в минуту. Заказчик в шоке, просит капчу - я говорю "спокойно, сядем все".

Переименовал поля, и как рукой сняло... Моей рукой получается и сняло...

Share this post


Link to post
Share on other sites
support

Так там вроде написано как пристраивать.

Share this post


Link to post
Share on other sites
rmn

Ну код не совсем такой.

По ссылке код под html, а править  php файл.

Share this post


Link to post
Share on other sites
support

А кто сказал, что править php файл?!

Если только html-код, то он вставляется в .html шаблон нужного файла.

Share this post


Link to post
Share on other sites
rmn

В файл "свяжитесь с нами"  надо поставить чекбокс.

Править надо  /shop_content.php или какой-то html файл?

Share this post


Link to post
Share on other sites
support

Шаблон страницы обратной связи - /templates/шаблон/module/contact_us.html

Share this post


Link to post
Share on other sites
rmn

Спасибо, все работает!

Share this post


Link to post
Share on other sites
support

Не за что

Share this post


Link to post
Share on other sites
anort

Здравствуйте.

После добавления капчи на страницу "Свяжитесь с нами" при отправлении сообщения возникают следующие ошибки:

Deprecated: Function split() is deprecated in /includes/external/phpmailer/class.phpmailer.php on line 470

Warning: Cannot modify header information - headers already sent by (output started at /includes/external/phpmailer/class.phpmailer.php:470) in /inc/vam_redirect.inc.php on line 47

При этом сообщение отсылается. Как устранить эти ошибки?

Share this post


Link to post
Share on other sites
support

Здравствуйте!

 

Видимо, у Вас старая версия VamShop.

 

Скачайте http://vamshop.ru/download.html и перепишите к себе папку /includes/external/phpmailer/

Share this post


Link to post
Share on other sites
anort

Здравствуйте!

 

Видимо, у Вас старая версия VamShop.

 

Скачайте http://vamshop.ru/download.html и перепишите к себе папку /includes/external/phpmailer/

Переписал. Помогло. Спасибо!

Share this post


Link to post
Share on other sites
support

Не за что

Share this post


Link to post
Share on other sites
LordBelial

из ask_a_question.html взял скрипт для обновление картинки капчи и поставил на contact_us.html

{config_load file="$language/lang_$language.conf" section="contact_us"}
<!-- Заголовок страницы -->
<h1>{$CONTACT_HEADING}</h1>
<!-- /Заголовок страницы -->
{if $error_message!=''}
<div class="contacterror">{$error_message}</div>
{/if}
{if $success!='1'}
{$FORM_ACTION}
<div class="page-questions">
	<script type="text/javascript">
{literal}
src="captcha.php";
function reload(){
        document.captcha.src='loading.gif';
        document.captcha.src=src+'?rand='+Math.random();
}
{/literal}
</script>
<!-- Содержимое страницы -->
	<div class="form-questions">
	<h4>{#text_yourquestion#}</h4>
	<!-- форма -->

		<fieldset class="form">
			<p><input type="text" name="name" placeholder="{#text_name#}" size="43"/></p>
			<p><input type="text" name="email" placeholder="{#text_email#}" size="43"/></p>
			<p><textarea name="message_body" placeholder="{#text_questions#}" id="message_body" cols="43" rows="15"></textarea></p>
			<p>{#text_sec_code#} {$CAPTCHA_IMG} <a href="javascript:void(0)" title="{#text_update#}" onclick="reload()">{#text_update#}</a></p>
			<p>{#text_inp_code#} {$CAPTCHA_INPUT}</p>
		</fieldset>

	<!-- /форма -->
	{$BUTTON_SUBMIT}
	</div>
	<div class="text-questions">
		{$CONTACT_CONTENT}
	</div>
	<div class="clear"></div>
</div>
{$FORM_END}
{/if}
<script src="http://yapro.ru/uploads/Files/jquery.placeholder/placeholder.js" type="text/javascript"></script>
{literal}
<script type="text/javascript">
$("FORM").placeholderLebnik();
</script>
{/literal}

но почему-то "обновить" не срабатывает =(

 

Страница где это реализовано http://polimedel.spb.ru/voprosy-i-otvety.html

Share this post


Link to post
Share on other sites
support

Посмотрите на странице где работает, как выглядит картинка каптчи, в смысле html-код img src ....

 

и сравните со своим, наверное есть отличия, не указан атрибут id , class или ещё что.

Share this post


Link to post
Share on other sites
support

А может и какие скрипты мешают, например вот внизу placholder какой-то подключается, теоретически он может мешать.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now