Ionic: Benutzerregistrierung mit E-Mail-Verifizierung integrieren

benutzerregistrierung mit e mail verifizierung einführung in diesem abschnitt wird erklärt, wie sie eine app mit benutzerregistrierung und e mail verifizierung erstellen können, indem sie https //www back4app com/product/parse server über back4app so wird es aussehen zu jeder zeit können sie auf das vollständige ionic projekt zugreifen, das mit diesem tutorial erstellt wurde, in unserem https //github com/back4app/ionic email verification voraussetzungen um dieses schnellstart tutorial abzuschließen, benötigen sie https //code visualstudio com/download (oder eine beliebige web ide, die sie mögen) https //ionicframework com/getting started/ eine app, die bei back4app erstellt wurde befolgen sie das https //www back4app com/docs/get started/new parse app um zu lernen, wie man eine parse app bei back4app erstellt folgen sie dem https //www back4app com/docs/js framework/ionic/ionic framework login tutorial, um zu lernen, wie man sich registriert, einloggt und ausloggt mit back4app 1 einrichten in diesem tutorial beginnen wir dort, wo wir im vorherigen https //www back4app com/docs/ionic/ionic framework login screen 2 e mail verifizierung aktivieren gehe zu deiner app auf https //www back4app com/ und klicke auf servereinstellungen servereinstellungen finde den block „verifizierungs e mails“ und klicke auf einstellungen einstellungen der block „verifizierungs e mails“ sieht so aus 3\ klicke auf benutzer e mail verifizieren benutzer e mail verifizieren es ist genau hier 4\ fülle die leeren felder aus und ändere die bereits ausgefüllten nach deinen wünschen 5\ klicke auf den speichern speichern button 3 registrieren the two fundamental attributes of parseuser parseuser class are username and password there’s a third special attribute that you should also set, i e the email to implement sign up with email verification, you will use the same method as the basic user registration but this time, instead of sending the user to the home page, you will ask him/her to verify his/her email to login once the user creation is completed, it is automatically added to parse dashboard dashboard and its emailverified boolean attribute is set as false at this point, the user should not be allowed to log into your platform once he/she verifies his/her e mail, by clicking on the link sent to his/her mailbox, the emailverified boolean will be automatically set to true , enabling him/her to access your platform entirely to make signupactivity signupactivity work, follow these steps add the issigningup issigningup and email email variables to login ts login ts to toggle and hold the e mail input login ts 1 // parse dependencies 2 email string; 3 issigningup boolean; make the signup() signup() method send the e mail address to the parse user signup() user signup() function 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 } now, let’s reflect those changes to the view login html login html by adding ngif ngif to show/hide html elements whenever the user is signing up ( issigningup is equal to true ) or signing in ( issigningup is equal to 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 anmelden jetzt fügen wir die emailverified boolesche überprüfung hinzu, bevor wir den benutzer zur startseite startseite weiterleiten hinweis obwohl der benutzer sich anmeldet, wenn die funktion parse user login() parse user login() aufgerufen wird, kann er/sie nicht auf die app zugreifen, bis die e mail überprüfung abgeschlossen ist außerdem ist es wichtig, parse user logout() parse user logout() jedes mal aufzurufen, wenn ein benutzer, der seine/ihre e mail nicht verifiziert hat, versucht, auf die anwendung zuzugreifen, um nicht sitzungen sitzungen offen zu lassen jetzt implementieren wir die emailverified überprüfung, um zu entscheiden, ob der benutzer sich anmeldet oder eine warnung erhält, dass die e mail verifiziert werden muss 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 testen sie ihre app testen sie ihre app, indem sie ionic serve ionic serve ausführen und ein paar benutzer erstellen versuchen sie auch, sich nach der registrierung ohne e mail verifizierung anzumelden, um zu sehen, ob der fehler tatsächlich angezeigt wird melden sie sich an unter https //www back4app com/ finden sie ihre app und klicken sie auf dashboard dashboard > kern kern > browser browser > benutzer benutzer um die benutzer zu sehen, die sie erstellt haben! es ist erledigt! in diesem stadium können sie sich anmelden, registrieren oder sich von ihrer app abmelden, indem sie die e mail verifizierung mit den kernfunktionen von parse server über back4app verwenden!