Uso de CAPTCHA em formulários adaptáveis

CAPTCHA (Completely Automated Public Turing test to tell Computers and Humans Apart) é um programa comumente usado em transações on-line para distinguir entre humanos e programas ou bots automatizados. Ele representa um desafio e avalia a resposta do usuário para determinar se é um humano ou um bot interagindo com o site. Ele impede que o usuário continue se o teste falhar e ajuda a tornar as transações online seguras, impedindo que os bots publiquem spam ou fins mal-intencionados.

O AEM Forms oferece suporte a CAPTCHA em formulários adaptáveis. Você pode usar o serviço reCAPTCHA pelo Google para implementar o CAPTCHA.

Configurar o serviço ReCAPTCHA pelo Google

Os autores de formulários podem usar o serviço reCAPTCHA pelo Google para implementar CAPTCHA em formulários adaptáveis. Ele oferece recursos avançados de CAPTCHA para proteger o site. Para obter mais informações sobre como o reCAPTCHA funciona, consulte Google reCAPTCHA.

Para implementar o serviço reCAPTCHA no AEM Forms:

1. Obter Par de chaves da API do reCAPTCHA do Google. Inclui uma chave e um segredo do site.

2. Criar contêiner de configuração para serviços em nuvem.

   1. Ir para Ferramentas > Geral > Navegador de configuração.

      • Consulte a Navegador de configuração para obter mais informações.

   2. Faça o seguinte para habilitar a pasta global para configurações de nuvem ou ignore esta etapa para criar e configurar outra pasta para configurações de serviço de nuvem.

      1. No Navegador de configuração, selecione a variável global pasta e toque em Propriedades.

      2. Na caixa de diálogo Propriedades de configuração, ative Configurações da nuvem.

      3. Toque Salvar e fechar para salvar a configuração e sair do diálogo.

   3. No Navegador de configuração, toque em Criar.

   4. Na caixa de diálogo Criar configuração, especifique um título para a pasta e habilite Configurações da nuvem.

   5. Toque Criar para criar a pasta habilitada para configurações do cloud service.

3. Configure o serviço de nuvem para o reCAPTCHA.

   1. Na instância do autor do AEM, acesse > Cloud Services.
   2. Toque reCAPTCHA. A página Configurações é aberta. Selecione o container de configuração criado na etapa anterior e toque em Criar.
   3. Especifique Nome, Chave do site e Chave secreta para o serviço reCAPTCHA e toque em Criar para criar a configuração do cloud service.
   4. Na caixa de diálogo Editar componente, especifique o site e as chaves secretas obtidas na etapa 1. Toque Salvar configurações e toque em OK para concluir a configuração.

   Depois que o serviço reCAPTCHA é configurado, ele é disponibilizado para uso em formulários adaptáveis. Para obter mais informações, consulte Uso de CAPTCHA em formulários adaptáveis.

Usar CAPTCHA em formulários adaptáveis

Para usar CAPTCHA em formulários adaptáveis:

1. Abra um formulário adaptável no modo de edição.

   OBSERVAÇÃO

   Verifique se o contêiner de configuração selecionado ao criar o formulário adaptável contém o serviço de nuvem reCAPTCHA. Também é possível editar propriedades do formulário adaptável para alterar o contêiner de configuração associado ao formulário.

2. No navegador de componentes, arraste e solte a Captcha no formulário adaptável.

   OBSERVAÇÃO

   Não há suporte para o uso de mais de um componente Captcha em um formulário adaptável. Além disso, não é recomendável usar CAPTCHA em um painel marcado para carregamento lento ou em um fragmento.

   OBSERVAÇÃO

   O Captcha é sensível ao tempo e expira em cerca de um minuto. Portanto, é recomendável colocar o componente Captcha antes do botão Enviar no formulário adaptável.

3. Selecione o componente Captcha adicionado e toque em para editar suas propriedades.

4. Especifique um título para o widget CAPTCHA. O valor padrão é Captcha. Selecionar Ocultar título se não quiser que o título seja exibido.

5. No Serviço de captcha selecione reCaptcha para ativar o serviço reCAPTCHA se você o tiver configurado conforme descrito em Serviço ReCAPTCHA da Google. Selecione uma configuração na lista suspensa Configurações. Além disso, selecione o tamanho como Normal ou Compacto para o widget reCAPTCHA.

   OBSERVAÇÃO

   Não selecionar Padrão no menu suspenso do serviço Captcha, quando o serviço AEM CAPTCHA padrão é descontinuado.

6. Salve as propriedades.

O serviço reCAPTCHA é ativado no formulário adaptável. Você pode visualizar o formulário e ver o CAPTCHA funcionando.

Mostrar ou ocultar o componente CAPTCHA com base em regras

É possível optar por mostrar ou ocultar o componente CAPTCHA com base nas regras aplicadas em um componente de um Formulário adaptável. Toque no componente e selecione e toque em Criar para criar uma regra. Para obter mais informações sobre como criar regras, consulte Editor de regras.

Por exemplo, o componente CAPTCHA deve ser exibido em um formulário adaptável somente se o campo Valor da moeda no formulário tiver um valor maior que 25000.

Toque no Valor da moeda no formulário e crie as seguintes regras:

Validar CAPTCHA

É possível validar CAPTCHA em um Formulário adaptável ao enviar o formulário ou basear a validação CAPTCHA em ações e condições do usuário.

Validar CAPTCHA no envio do formulário

Para validar um CAPTCHA automaticamente ao enviar um Formulário adaptável:

1. Toque no componente CAPTCHA e selecione para visualizar as propriedades do componente.
2. No Validar CAPTCHA , selecione Validar CAPTCHA no envio do formulário.
3. Toque para salvar as propriedades do componente.

Validar CAPTCHA em ações e condições do usuário

Para validar um CAPTCHA com base nas condições e ações do usuário:

1. Toque no componente CAPTCHA e selecione para visualizar as propriedades do componente.
2. No Validar CAPTCHA , selecione Validar CAPTCHA em uma ação do usuário.
3. Toque para salvar as propriedades do componente.

Experience Manager Forms fornece ValidateCAPTCHA API para validar CAPTCHA usando condições predefinidas. Você pode chamar a API usando uma Ação enviar personalizada ou definindo regras em componentes em um Formulário adaptável.

Veja a seguir um exemplo de ValidateCAPTCHA API para validar CAPTCHA usando condições predefinidas:

if (slingRequest.getParameter("numericbox1614079614831").length() >= 5) {
    	GuideCaptchaValidatorProvider apiProvider = sling.getService(GuideCaptchaValidatorProvider.class);
        String formPath = slingRequest.getResource().getPath();
        String captchaData = slingRequest.getParameter(GuideConstants.GUIDE_CAPTCHA_DATA);
        if (!apiProvider.validateCAPTCHA(formPath, captchaData).isCaptchaValid()){
            response.setStatus(400);
            return;
        }
    }

O exemplo significa que a variável ValidateCAPTCHA A API valida o CAPTCHA no formulário somente se o número de dígitos na caixa numérica especificada pelo usuário durante o preenchimento do formulário for maior que 5.

Opção 1: uso Experience Manager Forms Validar a API CAPTCHA para validar CAPTCHA usando uma ação enviar personalizada

Execute as seguintes etapas para usar o ValidateCAPTCHA API para validar CAPTCHA usando uma Ação enviar personalizada:

1. Adicione o script que inclui a variável ValidateCAPTCHA API para ação enviar personalizada. Para obter mais informações sobre ações enviar personalizadas, consulte Criar uma ação enviar personalizada para o Forms adaptável.
2. Selecione o nome da Ação de envio personalizada na Ação de envio lista suspensa no Envio propriedades de um Formulário adaptável.
3. Toque Enviar. O CAPTCHA é validado com base nas condições definidas no ValidateCAPTCHA API da Ação de envio personalizada.

Opção 2: uso Experience Manager Forms Validar API CAPTCHA para validar CAPTCHA em uma ação do usuário antes de enviar o formulário

Você também pode invocar ValidateCAPTCHA ao aplicar regras em um componente em um Formulário adaptável.

Por exemplo, você adiciona um Validar CAPTCHA em um Formulário adaptável e crie uma regra para chamar um serviço com o clique de um botão.

A figura a seguir ilustra como você pode chamar um serviço com um clique de Validar CAPTCHA botão:

Você pode chamar o servlet personalizado que inclui ValidateCAPTCHA API usando o editor de regras e ativar ou desativar o botão enviar do Formulário adaptável com base no resultado da validação.

Da mesma forma, você pode usar o editor de regras para incluir um método personalizado para validar CAPTCHA em um Formulário adaptável.

Adicionar serviços personalizados de CAPTCHA

Experience Manager Forms O fornece o reCAPTCHA como o serviço CAPTCHA. No entanto, é possível adicionar um serviço personalizado para exibir na Serviço CAPTCHA lista suspensa.

Este é um exemplo de implementação da interface para adicionar outro serviço CAPTCHA ao formulário adaptável:

package com.adobe.aemds.guide.service;

import org.osgi.annotation.versioning.ConsumerType;

/**
 * An interface to provide captcha validation at server side in Adaptive Form
 * This interface can be used to provide custom implementation for different captcha services.
 */
@ConsumerType
public interface GuideCaptchaValidator {
    /**
     * This method should define the actual validation logic of the captcha
     * @param captchaPropertyNodePath path to the node with CAPTCHA configurations inside form container
     * @param userResponseToken  The user response token provided by the CAPTCHA from client-side
     *
     * @return  {@link GuideCaptchaValidationResult} validation result of the captcha
     */
     GuideCaptchaValidationResult validateCaptcha(String captchaPropertyNodePath, String userResponseToken);

    /**
     * Returns the name of the captcha validator. This should be unique among the different implementations
     * @return  name of the captcha validator
     */
     String getCaptchaValidatorName();
}

captchaPropertyNodePath refere-se ao caminho do recurso do componente CAPTCHA no repositório Sling. Use essa propriedade para incluir detalhes específicos do componente CAPTCHA. Por exemplo, captchaPropertyNodePath inclui informações para a configuração de nuvem do reCAPTCHA configurada no componente CAPTCHA. As informações de configuração da nuvem fornecem Chave do site e Chave secreta configurações para implementar o serviço reCAPTCHA.

userResponseToken refere-se à g_recaptcha_response que é gerado após resolver um CAPTCHA em um formulário.

Recursos do Business.Adobe.com

Multichannel Communication Ecommerce Integrations Targeted Content Responsive Forms Customer Experience Management Digital Rights Management