recaptcha com javascript

satanson · 07/06/2022

Hola amigos, alguien sabe o tiene la forma de colocar la recaptcha con javascript que no sea con el boton enviar solo darle click al check box.

PHP:

        <form action="" method="post" class="row g-3 my-2">
        <div class="col-auto">
            <label class="col-form-label"><font color="red">*</font>Comprueba que eres Humano:</label>
        </div>       
        <div class="col-auto">
        <div class="input-group mb-3">
        <div class="g-recaptcha" data-sitekey="<?=$publickey?>"></div>
            <script type="text/javascript"
                    src="https://www.google.com/recaptcha/api.js?hl=es-419">
            </script>           
        </div>
        <button type="submit" class="btn btn-primary mb-3" value="Continuar">Continuar</button>
        </div>
        </form>

kj2 · 07/06/2022

Solo hay que configurar el callback a una función JS y que ese javascript haga el submit del form.

reCAPTCHA v2 | Google for Developers

Aprende a mostrar y personalizar el widget de reCAPTCHA v2 en tu página web.

developers.google.com

Por si no se entiende sería algo así:

HTML:

<div class="g-recaptcha" data-callback="estaEsTuFuncionCallback" data-sitekey="<?=$publickey?>"></div>

Luego en el javascript:

JavaScript:

funcion estaEsTuFunciónCallback() {
    document.querySelector('form').submit()
}

Ojo que todo el código lo he escrito directo en el post sin probarlo, basándome en la documentación, por lo que si puse un error de typo no va funcionar (además que es solo un ejemplo, por favor no solo lo copies y pegues).

kj

satanson · 07/06/2022

kj2 disse:
Solo hay que configurar el callback a una función JS y que ese javascript haga el submit del form.

reCAPTCHA v2 | Google for Developers

Aprende a mostrar y personalizar el widget de reCAPTCHA v2 en tu página web.

developers.google.com

Por si no se entiende sería algo así:

HTML:

<div class="g-recaptcha" data-callback="estaEsTuFuncionCallback" data-sitekey="<?=$publickey?>"></div>

Luego en el javascript:

JavaScript:

funcion estaEsTuFunciónCallback() { document.querySelector('form').submit() }

Ojo que todo el código lo he escrito directo en el post sin probarlo, basándome en la documentación, por lo que si puse un error de typo no va funcionar (además que es solo un ejemplo, por favor no solo lo copies y pegues).

kj

Muchas gracias lo voy a probar, no soy un experto claro que voy a intentar copiar y pegar 😂😂😂

satanson · 08/06/2022

kj2 disse:
Solo hay que configurar el callback a una función JS y que ese javascript haga el submit del form.

reCAPTCHA v2 | Google for Developers

Aprende a mostrar y personalizar el widget de reCAPTCHA v2 en tu página web.

developers.google.com

Por si no se entiende sería algo así:

HTML:

<div class="g-recaptcha" data-callback="estaEsTuFuncionCallback" data-sitekey="<?=$publickey?>"></div>

Luego en el javascript:

JavaScript:

funcion estaEsTuFunciónCallback() { document.querySelector('form').submit() }

Ojo que todo el código lo he escrito directo en el post sin probarlo, basándome en la documentación, por lo que si puse un error de typo no va funcionar (además que es solo un ejemplo, por favor no solo lo copies y pegues).

kj

Gracias hermano, funciona muy bien. Solo agregle algunos ajustes.

recaptcha com javascript

satanson

kj2

reCAPTCHA v2 | Google for Developers

satanson

reCAPTCHA v2 | Google for Developers

satanson

reCAPTCHA v2 | Google for Developers

Tópicos similares