Em poucos passos é possível incluir a redefinição de senha por e-mail em seu projeto. Neste tutorial será ensinado como configurar o sistema de reset de senha utilizando o servidor de e-mail do google (Gmail), todos os servidores de e-mail possuem passos semelhantes para se obter as configurações necessárias para a redefinir a senha por e-mail.

No servidor de e-mail será necessário concluir os passos abaixo para a configuração, são eles:

1. Habilitar o Imap.
2. Ativar autenticação por 2 etapas.
3. Gerar senha do App (precisaremos incluir na IDE).
4. Inserir os dados obtidos no projeto Cronapp.

Pré-requisitos

Antes de começar a seguir os passos do tutorial é preciso ter certeza de que se tem um ambiente minimamente preparado para reproduzir o exemplo. Abaixo estão os requisitos principais.

1. Projeto do tipo web ou mobile criado. Caso haja dúvidas de como criar esse tipo de projeto acesse o link Criar projeto;

2. Acessar e logar no e-mail que será utilizado para enviar a senha de redefinição, no nosso exemplo é utilizado o Gmail.

Passos

Ativar o IMAP

Precisaremos ativar a opção IMAP (Internet Message Access Protocol) que é um protocolo de gerenciamento de correio eletrônico para que seja possível utilizar o servidor de e-mail, com isso, acesse o endereço https://mail.google.com/ para iniciarmos a configuração.

Ao acessar o endereço descrito acima, clique na engrenagem de configuração (1 da figura 1) e em seguida em Ver todas as configurações (2 da figura 1).

Figura 1 - Acessando configurações

Acesse a aba Encaminhamento e POP/IMAP (1 da figura 1.1), após isso, um pouco abaixo, clique em Ativar IMAP (2 da figura 1.1) e clique no botão para salvar as configurações (3 da figura 1.1).

Figura 1.1 - Ativando IMAP

Gerar senha do App

Com o IMAP ativo, o próximo passo será obter a senha do App, onde mais a frente iremos inserir no nosso projeto, mas antes disso, precisaremos ativar a autenticação de 2 fatores, para isso, volte ao endereço principal e clique na sua imagem de perfil (1 da figura 2), e em seguida em Gerenciar sua Conta do Google (2 da figura 2).

Figura 2 - Acessando o gerenciamento de conta do Google

Após abrir a área de gerenciamento, clique em Segurança (1 da figura 2.1), ative a opção de Verificação em duas etapas (2 da figura 2.1) e siga todos os passos solicitados pelo Google. Após ativado, retorne a mesma tela (figura 2.1) e clique no campo de Senhas de app (3 da figura 2.1) que estava oculto antes da configuração em duas etapas.

Figura 2.1 - Gerando Senha para o app

No campo Selecionar app (1 da figura 2.2), selecione a opção Outro (2 da figura 2.2). 

Figura 2.2 - Selecionando o tipo de app

Em seguida insira um nome para o app (1 da figura 2.3) e clique em Gerar (2 da figura 2.3).

Figura 2.3 - Gerando senha para o app

A senha será exibida dentro do campo em amarelo (1 da figura 2.4), copie e salve a senha em algum lugar para inserirmos posteriormente no projeto, em seguida, clique em Concluído (2 da figura 2.4).

Figura 2.4 - Obtendo a senha e concluindo configuração

Configurando no Cronapp

Agora precisamos configurar a IDE para os envios de e-mail de redefinição, para isso, acesse Projeto > Configurações para abrir a janela de Configurações do Projeto e acesse a aba Configurações de E-mail, as configurações do e-mail irá diferenciar de acordo com o servidor de e-mail utilizado, mas no exemplo, vamos inserir as configurações de acordo com o Gmail (Figura 3).

Figura 3 - Configurando IDE para envios de e-mail

1. O tópico Configurações para Enviar E-mails irá receber os dados de acordo com o servidor utilizado, mas aqui serão inseridas as configurações SMTP de acordo com o Gmail.
2. Insira o e-mail que você configurou para enviar os e-mails de redefinição;
3. Insira a senha de app que foi gerada anteriormente.
4. Insira um nome de perfil para o e-mail utilizado e escreva novamente o e-mail que será utilizado para o envio.
5. Por fim, clique em Salvar.

Testando o projeto web

Execute o projeto e vá para a tela de login, em seguida clique em Redefinir senha (1 da figura 4), escreva o e-mail do usuário que deseja redefinir (2 da figura 4) e clique em Salvar.

Figura 4 - Solicitação de redefinição da senha

Aguarde até chegar o e-mail de redefinição de senha (Figura 4.1).

Figura 4.1 - E-mail de redefinição de senha

Ao clicar no link de redefinição de senha (figura 4.1), você será redirecionado à tela com os campos para inserir a nova senha e confirmar a nova senha (Figura 4.2)

Figura 4.2 - Tela de redefinição de senha

Testando o projeto mobile

Execute o projeto e em seguida clique em Redefinir senha (1 da figura 5), 

Figura 5 - Solicitação de redefinição da senha

Uma segunda tela será exibida, nela o usuário deverá informar o e-mail para o qual será enviado o token de recuperação de senha (destaque 1 da figura 5.1), este e-mail deve ser de algum usuário que esteja cadastrado na aplicação, não pode ser e-mail de terceiros. Clique em "Enviar" e espere o e-mail com o token de autenticação.

Figura 5.1 - Tela para informar o e-mail de recuperação

Confira na figura abaixo o modelo do e-mail que será enviado ao usuário.

Figura 5.2 - E-mail de redefinição de senha

Com o token de autenticação em mãos, clique no botão "Já possuo um código de autenticação", destaque 2 da figura 5,1. Essa tela apresenta três campos, no primeiro deve-se informar o token recebido por e-mail e nos dois seguintes nova senha e a confirmação da nova senha.

Figura 5.3 - Tela de redefinição de senha

Alterar imagens e texto do e-mail

Para que a imagem do topo e do rodapé do e-mail de redefinição seja alterada, é preciso abrir o bloco servidor UserControl (Localização: Blocos de programação/Servidor ), acessar a função resetPassword e no bloco  Resetar Senha, alterar o endereço dos parâmetros Imagem Topo do E-mail e Imagem Rodapé do E-mail. Para mais detalhes acesse a documentação do bloco Resetar Senha, para aplicações web, e Redefinir Senha com OTP para aplicações mobile  (Localização: Blocos de programação/Mobile/UserControl ), 

Figura 6 - Bloco Resetar Senha

Já o texto do e-mail, pode ser alterado de forma high-code a partir dos templates FTL no diretório resources, acessível apenas com o Modo Avançado habilitado. Confira na figura 6.1.

• Template em português: src/main/resources/templates/reset-password_pt_BR.ftlh
• Template em inglês: src/main/resources/templates/reset-password.ftlh

Figura 6.1 - Alterando a mensagem de recuperação de senha

Na figura 6.2 podemos observar que a mensagem do e-mail foi alterada.

Figura 6.2 - E-mail de redefinição de senha alterado