Превышен тайм-аут запроса Recaptcha в модальном всплывающем окне - PullRequest
0 голосов
/ 28 августа 2018

У меня 2 сайта на моем сайте, но на 2 разных страницах. Первый не имеет проблем, второй находится в модальном всплывающем окне, которое отображается после нажатия кнопки.

Консоль браузера показывает эту ошибку: enter image description here

и капча заканчивается в бесконечном цикле: enter image description here

Кнопка, отображающая всплывающее окно:

<div class="col-md-12 col-lg-6" style="text-align:center">
    <button id="showModal" type="button" class="btn btn-block btn-gray show_form" data-periodnumber="$idp"><span class="glyphicon glyphicon-envelope" style="margin-right:10px;"></span>__CONTATTI__</button>
</div>

Мое всплывающее окно в этом:

<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div id="request_titolo" class="modal-header">
				<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Chiudi</span></button>
				<h4 class="modal-title" id="request_titolo">__TITOLO_RICHIESTA__</h4>
				<small>__MESSAGGIO_RICHIESTA__</small>
				
			</div>
			<div class="modal-body frontend_request">
				<div class="col-xs-12 col-sm-12 col-md-12 pan-info"></div>
				<div class="row">
					<form id="form_disponibilita" name="myForm" role="form">
						<input type="hidden" id="idp" value="" />
						<input type="hidden" id="langPW" name="lang" value="<?php echo $lang; ?>" />
						<div class="form-group col-md-12">
							<label for="prop_nome">__NOME__</label>
							<div class="input-group">
								<div class="input-group-addon"><span class="glyphicon glyphicon-user"></span></div>						
								<input type="text" class="form-control" id="prop_nome" placeholder="__NOME__" value="">
							</div>
						</div>
						
						<div class="form-group col-md-12">
							<label for="prop_email">__EMAIL__</label>
							<div class="input-group">
								<div class="input-group-addon"><span class="glyphicon glyphicon-envelope"></span></div>						
								<input type="email" class="form-control" id="prop_email" placeholder="__EMAIL__">
							</div>
						</div>
								
						<div class="form-group col-md-12">
							<label for="prop_tel">__TELEFONO__</label>
							<div class="input-group">
								<div class="input-group-addon"><span class="glyphicon glyphicon-phone-alt"></span></div>						
								<input type="text" class="form-control" id="prop_telefono" placeholder="__TELEFONO__">
							</div>
						</div>
	
						<div class="form-group col-md-12">
							<label for="prop_msg_ita">__NOTE__</label>
							<textarea id="prop_note" class="form-control" rows="5"></textarea>
						</div>

						<!-- GOOGLE CAPTCHA -->
						 <div class="form-group col-md-12" style="text-align: center;">
							<p style="color: black;"> Completa la verifica: </p>
							<div style="display: inline-block;" class="g-recaptcha" data-sitekey="6Lf02WwUAAAAAHc2LtidX_HxU1C2iWn_e00-HAML" data-callback="callback"></div>
						</div> 
					
						<!-- END GOOGLE CAPTCHA -->

						<div class="form-group col-md-12">
							<label for="prop_msg_eng">__PRIVACY__</label>
							<input type="checkbox" class="form-control" id="prop_privacy" placeholder="Accetto la privacy" value="yes">
						</div>

						<div class="clear"></div>

						<div class="modal-footer">
							<button type="button" class="btn btn-lg btn-default" data-dismiss="modal">__ANNULLA__</button>
							<button id="btnInvia" type="button" class="btn btn-lg btn-info btn-send" style="background-color: #cccccc !important;" disabled="true">__INVIA__</button>
						</div>
					</form>
				</div>
			</div>

		</div>
	</div>

</div><!-- Fine Modal -->

JS:

function callback(){
    console.log("captcha ok");
	document.getElementById("btnInvia").style.background = '#1bb1d1';
	document.getElementById("btnInvia").disabled = false;
}

window.onload = function() {
    var recaptcha = document.forms["myForm"]["g-recaptcha-response"];
	recaptcha.required = true;
	recaptcha.oninvalid = function(e) {
	    alert("CONVALIDARE IL CAPTCHA!");
	}
}

Вы можете мне помочь?

САЙТ: http://www.residencecasacanazei.com/affittasi-vendesi Для просмотра модальных нажмите на кнопку «Contatti»

Ответы [ 2 ]

0 голосов
/ 20 сентября 2018

В моем случае проблема была с куки. Поэтому я очистил куки домена и после этого проблема была решена.

0 голосов
/ 28 августа 2018

Попробуйте этот код

window.onload = function() {
    var recaptcha = document.forms["myForm"]["g-recaptcha-response"];
    recaptcha.required = true;
    recaptcha.oninvalid = function(e) {
        alert("CONVALIDARE IL CAPTCHA!");
    }
    recaptcha.reset();
}

После того, как вы проверите recaptcah, он автоматически покажет сообщение об истечении времени ожидания через пару секунд. Итак, я поставил recaptcha.reset(); в конце, он сбросит его после отправки

...