Adicionar o Google reCAPTCHA ao Forms no Editor universal
O Google reCAPTCHA ajuda a proteger formulários, diferenciando usuários humanos e bots automatizados. O Edge Delivery Services Forms oferece suporte somente ao reCAPTCHA Enterprise com chaves de site baseadas em pontuação. Este guia explica como configurar essa proteção para formulários no Universal Editor.
Objetivos:
- Configure o reCAPTCHA Enterprise com uma chave de site baseada em pontuação
- Adicionar reCAPTCHA aos seus formulários
- Validar e testar a implementação
- Monitorar e otimizar o desempenho
Pré-requisitos
Antes de iniciar, verifique se você tem o seguinte:
Requisitos de acesso
- Acesso de criação ao AEM as a Cloud Service
- Acesso ao Editor universal com permissões de edição de formulário
Requisitos técnicos
- Conta ativa do Google
- Projeto da Google Cloud Platform com faturamento ativado
- Propriedade de domínio verificada para seus formulários
Requisitos de conhecimento
- Noções básicas sobre o AEM Forms e o Universal Editor
- Familiaridade com configurações do Cloud Service
- Noções básicas sobre conceitos de segurança de formulário
Por que usar o reCAPTCHA no seu Forms?
O reCAPTCHA Enterprise avalia as interações do usuário para ajudar a proteger formulários contra spam e abuso automatizado. O Google documenta os seguintes recursos:
Preços, cotas e suporte: os custos dependem da camada de serviço e do volume de avaliação da Google. O uso está sujeito a cotas da Google, não ilimitadas. Para obter os preços atuais, os requisitos de assinatura e as opções de suporte, consulte detalhes da camada da Google. A Google lista o suporte ao cliente em todos os níveis e o gerenciamento de conta dedicado para o nível Enterprise.
Configurar o reCAPTCHA Enterprise
Requisitos:
- Projeto da Google Cloud com faturamento ativado
- ID do projeto (do painel GCP)
- Verificação de domínio para seus formulários
- Acesso de administrador ao GCP e ao AEM
Instalação:
-
Criar ou selecionar um projeto da Google Cloud
- Ir para o Google Cloud Console
- Criar um novo projeto ou selecionar um já existente
- Anote a ID do projeto
-
Habilitar a API corporativa do reCAPTCHA
- Acesse APIs e serviços > Biblioteca
- Procure por “reCAPTCHA Enterprise API”
- Clique em Ativar
-
Criar credenciais de API
- Acesse APIs e serviços > Credenciais
- Clique em Criar credenciais > Chave de API
- Copie e armazene sua chave de API
-
Criar chave do site
- Vá para Segurança > Defesa contra Fraude > Chaves
- Clique em Create key e selecione Web como o tipo de aplicativo
- Adicionar seu(s) domínio(s)
- Clique em Next step (opcional) para abrir as configurações adicionais
- Manter Você usará os desafios? desativado para criar uma chave do site baseada em pontuação
- Clique em Criar chave e copie a chave do site
Ponto de Verificação de Validação: Verifique se você tem:
- ID do projeto
- Chave da API
- Chave do site
- Domínio verificado na Google Cloud
Figura: Habilitando configurações de nuvem para o contêiner de formulário
Instalação:
-
Acessar navegador de configuração
- Faça logon na instância de autor do AEM
- Acesse Ferramentas > Geral > Navegador de configuração
-
Ativar configurações em nuvem
- Localize o contêiner de configuração do formulário
- Selecionar propriedades
- Verificar configurações de nuvem
- Clique em Salvar e fechar
-
Verificar configuração
- Confirmar “Configurações de nuvem” aparece nas propriedades do container
Ponto de Verificação de Validação:
- Configurações de nuvem habilitadas para o seu contêiner
- O contêiner é exibido no Navegador de configuração
- As propriedades mostram “Configurações de nuvem” como ativadas
Figura: interface de configuração do reCAPTCHA Enterprise no AEM
Configuração:
-
Acessar a configuração do reCAPTCHA
- Acesse Ferramentas > Serviços da nuvem > reCAPTCHA
- Selecione o contêiner de configuração do seu formulário
- Clique em Criar
-
Definir Configurações Corporativas
- Título: nome descritivo (por exemplo, “Production reCAPTCHA”)
- Nome: Nome do sistema (gerado automaticamente ou personalizado)
- Versão: Selecione ReCAPTCHA Enterprise
- ID do projeto: insira sua ID do projeto do Google Cloud
- Chave do site: insira a chave do site na Google Cloud
- Chave da API: insira sua chave da API da Google Cloud
- Tipo de chave: selecione Chave do site com base em pontuação
-
Definir Limite de Segurança
-
Pontuação limite: Definida entre 0,0 e 1,0
-
Valores recomendados:
- 0.7-0.9: Alta segurança (pode bloquear alguns usuários legítimos)
- 0.5-0.7: Segurança equilibrada (recomendado)
- 0.1-0.5: Segurança mais baixa (permite mais usuários)
-
-
Salvar e publicar
- Clique em Criar para salvar a configuração
- Clique em Publicar para disponibilizá-lo
Ponto de Verificação de Validação:
- Configuração salva com sucesso
- Todos os campos obrigatórios foram preenchidos
- Configuração publicada e visível
- Nenhuma mensagem de erro
Adicionar reCAPTCHA ao formulário
Após configurar o serviço reCAPTCHA, adicione proteção ao formulário da seguinte maneira:
Figura: Adicionando o componente Captcha Invisível ao formulário
Vá para o formulário no AEM Sites e clique em Editar para abri-lo no Universal Editor. Aguarde até que o editor seja carregado.
- Acesse seu formulário no AEM Sites
- Clique em Editar para abrir no Editor universal
- Aguardar o editor carregar
Na Árvore de conteúdo (painel esquerdo), encontre a seção Formulário adaptável e expanda a estrutura do formulário para ver os pontos de inserção.
- Na Árvore de conteúdo (painel esquerdo), encontre a seção Formulário adaptável
- Expanda a estrutura do formulário para ver pontos de inserção
Adicione o componente Captcha (Invisível) ao formulário.
- Clique no ícone Adicionar (+) na seção do formulário
- Na lista de componentes, selecione Captcha (Invisível)
- Como alternativa, arraste e solte o componente do painel Componentes
Selecione o componente captcha recém-adicionado e verifique se ele usa a configuração do reCAPTCHA.
- Selecione o componente captcha recém-adicionado
- No painel Propriedades, verifique se ele usa a configuração do reCAPTCHA
- Nenhuma configuração adicional é necessária para a configuração básica
Publique suas alterações e verifique se não há erros.
- Clique em Publicar no Universal Editor
- Aguardar confirmação
- Verifique se nenhum erro é exibido
Verificar implementação
Seu formulário protegido agora está disponível em:
https://<branch>--<repo>--<owner>.aem.live/content/forms/af/
<form-name>
Exemplo de URL:
https://main--my-forms--company.aem.live/content/forms/af/
contact-us-form