Mehrere Google Recaptcha auf derselben Seite

In diesem Tutorial erfahren Sie, wie mehrere Google Recaptcha auf einer Seite verwendet werden können.

Tatsächlich verwende ich Mailster für WordPress, um Abonnements für Chatcloud zu sammeln.Um gegen Spam-Bots vorzugehen, verwende ich Double-Opt-In für die E-Mail-Bestätigung und Google Recaptcha Version 3.

Aber es gab ein Problem. Das Problem, warum Sie das jetzt lesen! Nur ein Recaptcha-Feld hat den Rückruf von Google erhalten, und alle anderen Formulare wurden angezeigt und der Fehler „Bitte beweisen Sie, dass Sie ein Mensch sind“.

Mehrere Google Captchas auf einer Site sind nicht ganz einfach und dieser Stackoverflow-Thread hat mir nicht viel geholfen.

Alter Code

Füllt den callback token in einem Formularfeld mit einer bestimmten ID aus.

grecaptcha.ready(function() {
	grecaptcha.execute('YOUR ID', {
		action : 'mailster_form_3_submit'
	}).then(function(token) {
		document.getElementById('mailster-_recaptcha-3-5d1b9cc5dcf84').value = token;
	});
}); 

Neuer Code für mehrere Felder

Füllt den callback token in allen Formularfeldern mit einem bestimmten Namen aus.

jQuery(document).ready(function() {

	grecaptcha.ready(function() {
		grecaptcha.execute('YOUR ID', {
			action : 'mailster_form_submit'
		}).then(function(token) {
			responseInputs = document.getElementsByName('g-recaptcha-response');
			
			for (var x = 0; x < responseInputs.length; x++) {
				responseInputs[x].value = token;
			}
		});
	});
}); 

Stellen Sie sicher, dass Sie diesen Code unter dem generischen Code von mailster rendern. Vorzugsweise vor dem schließenden </body>-Tag.Bereits in Mailster integriert

Die angeführte Lösung wurde bereits von Mailster in den Core integriert.