Biblioteca de formularios: agregar CAPTCHA a un formulario HTML personalizado

¿Sabías que CAPTCHA es el acrónimo de Completely Automated Public Turing test to tell Computer an Humans Apart? Por lo general, "CAPTCHA" muestra una imagen con una frase, y el encuestado debe escribir con precisión esta frase en un campo para enviar correctamente el formulario. Esto se usa para evitar que "robots" envíen formularios SPAM.

Puedes utilizar el producto reCAPTCA gratuito de Google para agregar la funcionalidad CAPTCHA a tus publicaciones en ion. Para incluir una herramienta CAPTCHA en tu(s) formulario(s), aprovecharás la función de formulario HTML personalizado de ion. Ten en cuenta que CAPTCHA no está disponible para formularios generados por tablas. ¡Ahora, comencemos!

Primero, deberás obtener una clave secreta y una clave del sitio visitando el enlace a continuación para iniciar sesión en Google reCAPTCHA. Puede iniciar sesión con una cuenta de Google existente o creando una nueva:

https://www.google.com/recaptcha/admin/create

Se adjunta a esta publicación un "scriptlet" de servidor y una muestra de formulario HTML personalizado que puedes conectar a su ion console.

Utilizarás estos archivos adjuntos y deberás seguir los pasos que se enumeran a continuación, para agregar un formulario con CAPTCHA a tus  páginas en ion. Ahora, agreguemos el scriptlet a tu consola, haciendo las siguientes actualizaciones:

 

1. Abre el archivo adjunto de scriptlet y copia el código.

2. Navega hasta el menú global “Libraries” y selecciona "server scriptlets".

3. Agrega una categoría de scriptlet o navega hacia una existente. Pega tu código en el editor.

4. Busca la línea de código que incluye "URL + =" secretkey = xxxSecretKey ";" y reemplaza "xxxSecretKey" con el que obtuviste de Google, luego guarda.

5. Navega de regreso al scriptlet y visualiza el URL en la ventana de tu navegador. Anota el valor sscID en la URL.

 

A continuación, agrega el formulario personalizado a tu ion console.

Adjunta a esta publicación de soporte, encontrarás un formulario HTML personalizado de muestra que incluye el JavaScript reCATCHA fuera de las etiquetas del formulario.

 

1. Abre el archivo adjunto del formulario personalizado y copia el código.

2. En tu ion console, navega hasta el menú global “Libraries” y seleccione "forms".

3. Agrega una categoría de formulario, o navega hacia una existente, luego agrega un nuevo formulario. Etiqueta el formulario, selecciona “custom HTML” como "form type" y guarda.

4. Pega tu código de formulario de muestra en el editor.

5. Busca la línea que contiene "Recaptcha.create (" xxxCAPTCHAkey ", element, {" y reemplaza "xxxCAPTCHAkey" con la clave del sitio que has generado en Google.

6. Busca la línea que contiene "result = liveballScriptlet (1," rct = json ", reqStr);" y reemplaza 1 con el valor "sscID" que anotaste anteriormente.

7. Guarda.

 

Este ejemplo usa el tema "white" para el CAPTCHA. Consulte el soporte de reCaptcha de Google si deseas cambiar el tema.

Un desarrollador puede codificar campos de datos adicionales en este formulario de muestra o simplemente usarlo como punto de referencia. Si deseas guardar los valores del campo de datos en tu ion console, haz clic en el ícono de lápiz con la etiqueta "save as is" al lado de cada campo, y en los menús desplegables selecciona el campo de recolección de datos de ion correspondiente.

Por último, pero no menos importante, agrega el formulario a una publicación de prueba:

 

1. Ve a tu portafolio y seleccione Campaign, agrega una publicación con un editor de formularios.

2. Haz clic sobre el editor de formularios y selecciona el formulario con CAPTCHA que acabas de agregar a tu ion console.

3. Enlaza el formulario a una página de seguimiento.

 

¡Ahora estás listo para probar su formulario con CAPTCHA!

El equipo de ion está disponible para implementar esto para ti como un proyecto, si prefieres que hagamos el trabajo preliminar.

No dudes en ponerse en contacto con su Account Manager si tienes alguna pregunta.