Ionic e Back4App: Registro de Email com Verificação Completa

registro de usuário com verificação de email introdução esta seção explica como você pode criar um aplicativo com registro de usuário e verificação de email usando https //www back4app com/product/parse server através do back4app assim é como ficará a qualquer momento, você pode acessar o projeto ionic completo construído com este tutorial em nosso https //github com/back4app/ionic email verification pré requisitos para completar este início rápido, você precisa https //code visualstudio com/download (ou qualquer ide web que você preferir) https //ionicframework com/getting started/ um aplicativo criado no back4app siga o https //www back4app com/docs/get started/new parse app para aprender como criar um aplicativo parse no back4app seguiu o https //www back4app com/docs/js framework/ionic/ionic framework login para aprender como implementar cadastro, login e logout com back4app 1 configuração neste tutorial, começaremos de onde paramos no anterior https //www back4app com/docs/ionic/ionic framework login screen 2 ativar verificação de email vá para seu app em https //www back4app com/ e clique em configurações do servidor configurações do servidor encontre o bloco “emails de verificação” e clique em configurações configurações o bloco “emails de verificação” se parece com isso 3\ clique em verificar email do usuário verificar email do usuário está bem aqui 4\ preencha os campos vazios e modifique os que já foram preenchidos de acordo com suas preferências 5\ clique no botão salvar salvar 3 inscrever se os dois atributos fundamentais da parseuser parseuser classe são nome de usuário e senha há um terceiro atributo especial que você também deve definir, ou seja, o email para implementar o cadastro com verificação de email, você usará o mesmo método que o registro básico de usuário mas desta vez, em vez de enviar o usuário para a página inicial, você pedirá que ele/ela verifique seu email para fazer login uma vez que a criação do usuário é concluída, ele é automaticamente adicionado ao parse dashboard dashboard e seu atributo boolean emailverified é definido como falso neste ponto, o usuário não deve ser permitido fazer login em sua plataforma uma vez que ele/ela verifica seu e mail, clicando no link enviado para sua caixa de entrada, o booleano emailverified será automaticamente definido como verdadeiro , permitindo que ele/ela acesse sua plataforma completamente para fazer signupactivity signupactivity funcionar, siga estas etapas adicione as issigningup issigningup e email email variáveis para login ts login ts para alternar e manter a entrada de e mail login ts 1 // parse dependencies 2 email string; 3 issigningup boolean; faça o signup() signup() método enviar o endereço de e mail para a função user signup() user signup() login ts 1 signup() { 2 parse user signup(this username, this password, {email this email}) then((resp) => { 3 console log('signed up successfully', resp); 4 5 // clears up the form 6 this username = ''; 7 this password = ''; 8 this email = ''; 9 10 this toastctrl create({ 11 message 'account created successfully', 12 duration 2000 13 }) present(); 14 15 this issigningup = false; 16 }, err => { 17 console log('error signing in', err); 18 19 this toastctrl create({ 20 message err message, 21 duration 2000 22 }) present(); 23 }); 24 } agora, vamos refletir essas mudanças na visualização login html login html adicionando ngif ngif para mostrar/ocultar elementos html sempre que o usuário estiver se inscrevendo ( issigningup é igual a true ) ou fazendo login ( issigningup é igual a false ) login html 1 2 e mail 3 4 5 6 7 8 sign up 9 10 11 12 sign in 13 14 15 16 17 18 sign up 19 20 4 fazer login agora, vamos adicionar a emailverified verificação booleana antes de enviar o usuário para a página inicial página inicial nota embora o usuário faça login quando a função parse user login() parse user login() é chamada, ele/ela não pode acessar o aplicativo até que a verificação de e mail seja concluída além disso, como um objeto de sessão é criado no banco de dados ao chamar login(), é importante chamar parse user logout() parse user logout() toda vez que um usuário que não verificou seu e mail tenta acessar a aplicação, a fim de não deixar sessões sessões abertas agora, vamos implementar a emailverified verificação para decidir se o usuário faz login ou recebe um alerta dizendo que o e mail deve ser verificado login ts 1 // parse dependencies 2 signin() { 3 parse user login(this username, this password) then((user) => { 4 console log('logged in successfully', user); 5 6 if(user get('emailverified')) { 7 // if you app has tabs, set root to tabspage 8 this navctrl setroot('homepage') 9 } else { 10 parse user logout() then((resp) => { 11 console log('logged out successfully', resp); 12 }, err => { 13 console log('error logging out', err); 14 }); 15 16 this alertctrl create({ 17 title 'e mail verification needed', 18 message 'your e mail address must be verified before logging in ', 19 buttons \['ok'] 20 }) present(); 21 } 22 }, err => { 23 console log('error logging in', err); 24 25 this toastctrl create({ 26 message err message, 27 duration 2000 28 }) present(); 29 }); 30 } 5 teste seu aplicativo teste seu aplicativo executando ionic serve ionic serve e criando alguns usuários, também tente fazer login após se registrar sem verificar o e mail para ver se o erro é realmente exibido faça login em https //www back4app com/ encontre seu aplicativo e clique em painel painel > núcleo núcleo > navegador navegador > usuário usuário para ver os usuários que você criou! está feito! nesta fase, você pode fazer login, registrar ou sair do seu aplicativo usando verificação de e mail com os recursos principais do parse server através do back4app!