У меня 2 формы на одной странице. В одной из форм постоянно отображается рекапча. Другой должен отображать recaptcha только после определенного события, такого как максимальное количество попыток входа в систему. Так что бывают случаи, когда мне нужно, чтобы на одной странице отображалось 2 рекапчи. Это возможно? Я знаю, что мог бы, вероятно, использовать один для обоих, но, учитывая мой макет, я бы предпочел иметь 2. Спасибо.
Обновление: ну, я думаю, это может быть невозможно. Может ли кто-нибудь порекомендовать другую библиотеку захвата для использования вместе с reCaptcha? Я действительно хочу, чтобы на одной странице было 2 капчи.
Обновление 2. Что, если поместить каждую форму в iframe? Было бы это приемлемым решением?
Hüseyin Yağlı
ответе . Большинство браузеров должны поддерживать JavaScript, и reCAPTCHA по умолчанию в любом случае использует JavaScript. Однако я не знаю, что нужно сделать для решения проблемы без поддержки JavaScript.Ответы:
Аналогичный вопрос был задан об этом на странице ASP ( ссылка ), и все согласились, что это невозможно сделать с recaptcha. Кажется, что несколько форм на одной странице должны использовать кодировку, если вы не хотите использовать другую капчу. Если вы не привязаны к recaptcha, хорошей библиотекой для изучения является компонент Zend Frameworks Zend_Captcha ( ссылка ). Он содержит несколько
источник
Hüseyin Yağlı
Ответ объясняет решение. Документация по reCAPTCHA для этого решения находится на сайте developers.google.com/recaptcha/docs/display#explicit_render . Однако я не знаю, что нужно сделать для решения проблемы без поддержки JavaScript.С текущей версией Recaptcha ( reCAPTCHA API версии 2.0 ) вы можете иметь несколько рекапч на одной странице.
Нет необходимости ни клонировать recaptcha, ни пытаться решить проблему. Вам просто нужно поместить несколько элементов div для рекапч и явно отобразить внутри них рекапчи.
Это легко сделать с помощью API-интерфейса google recaptcha:
https://developers.google.com/recaptcha/docs/display#explicit_render
Вот пример html-кода:
В вашем коде javascript вы должны определить функцию обратного вызова для recaptcha:
После этого URL-адрес вашего скрипта recaptcha должен выглядеть так:
Или вместо того, чтобы указывать идентификаторы для полей рекапчи, вы можете указать имя класса и зациклить эти элементы с помощью селектора классов и вызвать .render ()
источник
grecaptcha.getResponse(0)
иgrecaptcha.getResponse(1)
для проверки нескольких экземпляров, я бы добавил, что индексация действительно должна соответствоватьgrecaptcha.render
порядку. В этом примереgrecaptcha.render('RecaptchaField1'...
будет проверятьсяgrecaptcha.getResponse(0)
иgrecaptcha.render('RecaptchaField2'...
проверяться с помощьюgrecaptcha.getResponse(1)
и т. Д.Просто и понятно:
1) Создайте поля рекапчи, как правило, следующим образом:
2) Загрузите скрипт следующим образом:
3) Теперь вызовите это, чтобы перебирать поля и создавать рекапчи:
источник
data-sitekey="YOUR_KEY_HERE"
бесполезен и может быть удален из div (если вам нужно изменить ключ, меньше мест для редактирования)grecaptcha.render(el, {'sitekey' : $(el).attr('data-sitekey') });
Это легко сделать с помощью
clone()
функции jQuery .Таким образом, вы должны создать два блока-оболочки для рекапчи. Моя первая форма recaptcha div:
Div второй формы пуст (другой идентификатор). Так что мой просто:
Тогда javascript довольно прост:
Наверное, не нужен второй параметр со
true
значением внутриclone()
, но это не повредит ... Единственная проблема с этим методом заключается в том, что если вы отправляете свою форму через ajax, проблема в том, что у вас есть два элемента, которые имеют с тем же именем, и вы должны мне немного поумнее фиксировать правильные значения элементов (два идентификатора для элементов#recaptcha_response_field
reCaptcha и #recaptcha_challenge_field на случай, если они кому-то понадобятся)источник
Я знаю, что это старый вопрос, но на тот случай, если кто-то будет его искать в будущем. На одной странице можно разместить две капчи. Розовая документация находится здесь: https://developers.google.com/recaptcha/docs/display. Пример ниже - это просто копия документа формы, и вам не нужно указывать разные макеты.
источник
Этот ответ является расширением @raphadko ответа «s .
Если вам нужно вручную извлечь код капчи (как в запросах ajax), вам необходимо вызвать:
Но как получить параметр идентификатора виджета?
Я использую это определение CaptchaCallback для хранения идентификатора виджета каждого блока g-recaptcha (как атрибут данных HTML):
Тогда я могу позвонить:
для извлечения кода.
источник
#your_recaptcha_box_id
?У меня есть контактная форма в нижнем колонтитуле, которая всегда отображается, а также на некоторых страницах, таких как Create Account, тоже может быть captcha, поэтому он динамически, и я использую следующий способ с jQuery:
html:
javascript
источник
Это версия без JQuery ответа, предоставленного raphadko и существительным .
1) Создайте поля рекапчи, как правило, следующим образом:
2) Загрузите скрипт следующим образом:
3) Теперь вызовите это, чтобы перебирать поля и создавать рекапчи:
источник
Посмотрев на исходный код страницы, я взял часть reCaptcha и немного изменил код. Вот код:
HTML:
jQuery:
Я использую здесь простую функциональность вкладки javascript. Итак, не включил этот код.
Когда пользователь нажимает «Запросить информацию»,
(#product_tabs_what)
JS проверяет,recapExist
имеетfalse
ли оно какое-то значение. Если у него есть значение, это вызоветRecaptcha.destroy();
уничтожение старой загруженной reCaptcha и воссоздает ее для этой вкладки. В противном случае это просто создаст reCaptcha и поместит в#more_info_recaptcha_box
div. То же, что и для#product_tabs_wha
вкладки «Сделать предложение» .источник
источник
<div class="g-recaptcha" data-sitekey="your_site_key"></div>
там, где вам нужно, в формах /Хороший вариант - генерировать ввод рекапчи для каждой формы на лету (я сделал это с двумя, но вы, вероятно, могли бы создать три или более форм). Я использую jQuery, jQuery validation и jQuery form plugin для публикации формы через AJAX вместе с Recaptcha AJAX API -
https://developers.google.com/recaptcha/docs/display#recaptcha_methods
Когда пользователь отправляет одну из форм:
Затем они могут заполнить recaptcha и повторно отправить форму. Если вместо этого они решат отправить другую форму, то ваш код проверяет существующие рекапчи, так что у вас будет только одна рекапча на странице за раз.
источник
Для того, чтобы добавить немного к raphadko ответ «s : так как у вас есть несколько каптч (на одной странице), Вы не можете использовать (универсальный)
g-recaptcha-response
параметр POST (потому что он содержит только один ответ Captcha в). Вместо этого вы должны использоватьgrecaptcha.getResponse(opt_widget_id)
вызов для каждой капчи. Вот мой код (при условии, что каждая капча находится внутри своей формы):HTML:
и
JavaScript:
Обратите внимание, что я применяю делегирование событий (см. « Обновление DOM после добавления элемента» ) ко всем динамически изменяемым элементам. Это связывает ответ каждой отдельной капты с ее
submit
событием формы .источник
Вот решение, основанное на многих отличных ответах. Этот вариант является динамическим и свободным от jQuery, и не требует от вас целевого задания элементов по идентификатору.
1) Добавьте разметку reCAPTCHA, как обычно:
2) Добавьте в документ следующее. Он будет работать в любом браузере, поддерживающем API querySelectorAll.
источник
grecaptcha.getResponse()
Метод принимает необязательный «WIDGET_ID» параметр и значение по умолчанию для первого виджета , созданного , если не определены. Widget_id возвращается изgrecaptcha.render()
метода для каждого созданного виджета, он не связан с атрибутомid
контейнера reCAPTCHA !!У каждой reCAPTCHA свои данные ответа. Вы должны указать идентификатор div reCAPTCHA и передать его
getResponse
методу:например
Ответ доступа:
или
источник
Возможно, просто перезапишите обратные вызовы Recaptcha Ajax. Рабочий jsfiddle: http://jsfiddle.net/Vanit/Qu6kn/
Вам даже не нужен прокси-div, потому что при перезаписи код DOM не будет выполняться. Вызывайте Recaptcha.reload () всякий раз, когда хотите снова запустить обратные вызовы.
источник
Вот хорошее руководство для этого:
http://mycodde.blogspot.com.ar/2014/12/multiple-recaptcha-demo-same-page.html
Обычно вы добавляете некоторые параметры к вызову API и вручную визуализируете каждую рекапчу:
PS: Метод "grecaptcha.render" получает идентификатор
источник
Я бы использовал невидимую рекапчу. Затем на вашей кнопке используйте тег типа «formname = 'yourformname'», чтобы указать, какая форма должна быть отправлена, и скрыть ввод формы отправки.
Преимущество этого заключается в том, что он позволяет вам сохранить целостность проверки формы html5, одну recaptcha, но несколько интерфейсов кнопок. Просто зафиксируйте входное значение «captcha» для ключа токена, сгенерированного recaptcha.
Я считаю, что это НАМНОГО проще и легче в управлении.
источник