‫Instructeur : Nous devons donc
‫maintenant envoyer le jeton de réinitialisation du mot de passe par e-mail à l'utilisateur.
‫Et donc dans cette conférence, nous allons
‫apprendre à envoyer des e-mails en utilisant une solution très
‫populaire appelée Nodemailer.
‫Mais avant de faire cela, je voulais
‫en fait vous montrer l'effet de ne pas avoir cette option
‫ici, car je ne vous l'ai jamais montré auparavant.
‫Alors coupons-le ici, essayez-le maintenant, encore une fois, et maintenant
‫vous voyez toutes ces erreurs arriver comme s'il vous
‫plaît confirmer votre mot de passe.
‫Et, en fait, il devrait y en
‫avoir plus, mais bon, c'est maintenant le premier que vous obtenez.
‫Fondamentalement, parce que nous n'avons aucune valeur
‫dans le champ de confirmation du mot de passe.
‫D'accord?
‫Et encore une fois, c'est à cause de
‫la validation et donc encore une fois, nous pouvons, bien sûr,
‫la désactiver facilement avec cette option.
‫Mais de toute façon, créons maintenant une fonction de gestionnaire de
‫courrier électronique que nous pouvons ensuite utiliser dans notre application.
‫Je vais donc le
‫faire ici dans le dossier Utilitaires,
‫encore une fois, et l'appeler simplement par e-mail. js.
‫D'accord?
‫Et avant de faire quoi
‫que ce soit d'autre, installons en fait le package Nodemailer.
‫C'est donc le package que j'ai mentionné dès le
‫début, que nous allons utiliser
‫pour envoyer des e-mails à l'aide de Node. js.
‫Donc, comme toujours, npm installe nodemailer.
‫Et ici.
‫Très bien, et maintenant créons cette fonction ici.
‫Donc des e-mails
‫constants, d'accord,
‫et ici, nous allons essentiellement passer quelques options.
‫Donc, l'adresse e-mail à laquelle nous voulons envoyer un
‫e-mail, la ligne d'objet, le contenu de
‫l'e-mail et peut-être d'autres éléments.
‫D'accord.
‫Et maintenant, nous devons suivre trois
‫étapes pour envoyer des e-mails avec Nodemailer.
‫Donc tout d'abord, nous devons créer un transporteur.
‫Deuxièmement,
‫nous devons définir les options de courrier électronique, en
‫gros, puis à
‫la fin, envoyer le courrier électronique avec Nodemailer.
‫D'accord?
‫Ainsi, le transporteur que nous avons créé dans la première
‫étape ici est essentiellement un service qui enverra réellement l'e-mail, car ce n'est
‫pas un nœud. js qui
‫enverra réellement l'e-mail lui-même.
‫C'est juste un service que nous définissons ici.
‫Quelque chose comme Gmail, par exemple.
‫Maintenant, Gmail n'est pas réellement le
‫service que
‫nous allons utiliser, mais permettez-moi de vous montrer
‫rapidement comment cela fonctionne avec Gmail, car je sais
‫que cela intéressera de nombreuses personnes, d'accord ?
‫Donc, de toute façon, nous devons toujours créer un transporteur, et c'est toujours le
‫même, quel que
‫soit le service que nous allons utiliser.
‫Le transporteur sera donc
‫nodemailer. createTransport et puis,
‫bien sûr, nous avons besoin de quelques options là-dedans.
‫D'accord?
‫Nous pouvons donc spécifier le service et nous
‫pouvons dire que nous voulons utiliser Gmail.
‫Alors, juste comme ça.
‫Et il existe quelques services
‫bien connus que Nodemailer sait gérer, et nous
‫n'avons donc pas à les configurer manuellement.
‫Et donc Gmail n'est que l'un d'entre eux.
‫Mais il y a aussi Yahoo, ou Hotmail, ou bien d'autres, d'accord ?
‫C'est donc
‫le service, et nous devons également spécifier la propriété auth,
‫donc essentiellement pour l'authentification.
‫Nous avons donc besoin d'un utilisateur et d'un mot de passe.
‫Et donc comme avant, nous
‫enregistrons ce genre de choses dans notre config. n fichier.
‫D'accord.
‫Donc, l'e-mail,
‫c'est un nom
‫d'utilisateur, et maintenant je ne vais pas utiliser une
‫vraie adresse Gmail ici parce que, encore
‫une fois, nous n'utilisons pas Gmail, mais juste à titre d'exemple ici, d'accord.
‫Votre mot de passe.
‫D'accord.
‫Donc, nous avons terminé, disons, traitez
‫le point
‫de fin de point EMAIL_USERNAME
‫le processus de
‫mot de passe point de fin de
‫point EMAIL_PASSWORD et j'espère
‫que je les ai correctement orthographiés.
‫D'accord?
‫Et c'est donc
‫la configuration pour le transport dans Nodemailer.
‫Ensuite, dans votre compte Gmail,
‫vous devrez en
‫fait activer quelque chose appelé l'option d'application moins sécurisée.
‫Alors laissez-moi l'écrire ici.
‫Et encore une fois, je ne vais pas
‫le faire ici, mais
‫je sais que beaucoup de gens voudront réellement l'utiliser.
‫Et la raison pour laquelle nous n'utilisons pas Gmail
‫dans cette application est que
‫Gmail n'est pas du tout une bonne idée pour une
‫application de production.
‫Et c'est donc essentiellement ce que nous essayons de construire ici.
‫D'accord?
‫Donc, en utilisant Gmail pour ce genre
‫de choses, vous ne pouvez envoyer que 500 e-mails par
‫jour, et aussi, vous serez probablement très rapidement marqué
‫comme spammeur, et à partir de là, cela ne fera que dégringoler.
‫D'accord?
‫Donc, à moins que ce ne soit comme une
‫application privée, et que vous vous envoyiez simplement
‫des e-mails à vous-même ou à
‫10 amis, eh bien, vous devriez utiliser un autre service.
‫Et certains bien connus sont SendGrid et Mailgun.
‫Et, en fait, nous utiliserons SendGrid un peu plus
‫tard dans ce cours.
‫Maintenant, ce que nous allons faire
‫maintenant, c'est utiliser un service de développement
‫spécial, qui fait semblant d'envoyer des e-mails à de vraies adresses.
‫Mais, en réalité, ces e-mails se retrouvent piégés dans une boîte
‫de réception de développement, de sorte que nous pouvons ensuite voir à
‫quoi ils ressembleront plus tard dans la production.
‫D'accord?
‫Ce service s'appelle donc Mailtrap, alors
‫inscrivons-nous maintenant pour cela.
‫Donc.
‫Piège à courrier. io, d'accord
‫?
‫Donc, et comme je l'ai dit, des tests de messagerie sécurisés
‫pour la mise en scène et le développement.
‫Donc, fondamentalement, avec
‫ce service, vous pouvez faire semblant d'envoyer des e-mails aux
‫clients, mais ces e-mails n'atteindront alors jamais ces
‫clients et seront plutôt piégés dans votre Mailtrap, d'accord ?
‫Et de cette façon,
‫vous ne pouvez pas envoyer accidentellement des e-mails de développement
‫à tous vos clients ou utilisateurs, d'accord.
‫Alors allez-y et inscrivez-vous maintenant.
‫J'ai, bien sûr, déjà mon compte, et je
‫vais donc simplement me connecter maintenant.
‫Alors rendez-vous dans une seconde, après
‫avoir créé votre compte gratuit.
‫Très bien, donc après avoir créé votre
‫compte, il ressemblera probablement un peu à ceci.
‫Maintenant, vous n'aurez pas de boîte de réception pour
‫le moment, alors créons-en une nouvelle, avec le
‫nom de natours.
‫Donc, j'en ai déjà un, mais créez-en un nouveau ici, avec le
‫nom natours, puis appuyez sur Créer une boîte de réception.
‫D'accord?
‫Ensuite, nous pouvons l'ouvrir,
‫et vous voyez que nous n'avons pas d'e-mail à ce
‫stade, mais ce qui compte pour
‫le moment, ce sont ces informations d'identification ici.
‫Vous voyez donc que nous avons notre hôte ici,
‫nous avons le port, le nom d'utilisateur et le mot de passe.
‫Et c'est donc ce que
‫nous allons spécifier dans notre transport dans Nodemailer maintenant.
‫D'accord?
‫Commençons donc par l'hôte, eh bien, en
‫fait, avec le
‫nom d'utilisateur, donc ces deux-là, j'ai
‫juste besoin de copier, alors copions-le dans notre fichier de
‫configuration, c'est donc le nom d'utilisateur,
‫puis c'est le mot
‫de passe, et maintenant nous devons également spécifier l'hôte.
‫D'accord, et c'est parce que Mailtrap n'est
‫pas l'un de ces services prédéfinis fournis avec Nodemailer.
‫D'accord.
‫Le port est 25.
‫Alors, sauvez-le, puis ici,
‫débarrassons-nous de cela, et ce que je dois
‫spécifier à la place, c'est l'hôte, donc
‫l'e-mail,
‫l'hôte et,
‫bien sûr, le port.
‫Donc tout ce que nous venons de sauver avant.
‫Très bien, alors l'authentification ici est
‫exactement la même.
‫Débarrassons-nous également de cela
‫et passons à l'étape numéro deux.
‫Donc, en gros, définir quelques options pour notre e-mail.
‫Très bien, et nous pourrions, bien sûr,
‫faire les étapes deux et trois en même temps,
‫mais j'aime simplement préférer ces options ici en premier.
‫D'accord, et donc ici, nous
‫spécifions d'où vient l'e-mail,
‫donc
‫le nom, puis l'adresse e-mail comme celle-ci.
‫Ensuite, nous avons besoin de l'adresse du
‫destinataire, et donc celle-là, je vais la spécifier en option,
‫d'accord ?
‫Donc, fondamentalement, venant comme argument de cette fonction.
‫Donc cet objet options ici,
‫c'est celui-ci que nous passons dans la fonction.
‫D'accord.
‫Alors en fait la même chose pour le sujet et pour le texte.
‫Dupliquons-les simplement ici,
‫donc le sujet, puis nous
‫spécifions simplement la propriété text, et
‫celle-là, dans les options, je l'appelle simplement message.
‫Très bien, donc celui-ci est essentiellement la
‫version texte de l'e-mail.
‫Mais on peut alors aussi spécifier la propriété HTML.
‫D'accord, et nous pouvons maintenant convertir ce message en HTML.
‫Et plus tard, nous allons le faire,
‫mais pour l'instant, restons simple et ne spécifions pas du tout le code HTML ici.
‫D'accord?
‫Donc, laissez-le simplement au texte.
‫D'accord!
‫Et puis enfin,
‫à la fin, transporter, c'est donc l'objet transporteur que
‫nous avons créé ici au début, et
‫là-dessus, nous pouvons ensuite appeler sendMail
‫et nous devons y transmettre nos options de messagerie, d'accord ?
‫Et maintenant, cela renvoie en fait une promesse.
‫Bon, encore une fois, il s'agit d'une fonction
‫asynchrone, et puisque nous ne voulons pas travailler directement avec
‫Promises, utilisons async/await.
‫D'accord.
‫Donc, déclarer cela comme une fonction asynchrone
‫et c'est parti.
‫D'accord.
‫Nous ne voulons pas stocker de résultat
‫ici, ce que nous pourrions, mais cela ne m'intéresse pas vraiment.
‫D'accord, et maintenant exportons-le simplement par défaut à
‫partir de ce module.
‫D'accord, ça a l'air bon !
‫Maintenant, allons de l'avant et essayons réellement ceci.
‫Et donc pour commencer, nous devons l'importer ici, bien sûr.
‫Alors dupliquons simplement ceci
‫ici, il
‫s'agit donc d'un e-mail, et la fonction s'appelle sendEmail, je pense.
‫D'accord.
‫Revenons donc à notre fonction middleware ici, et commençons
‫par définir l'URL de réinitialisation.
‫Ainsi, idéalement, l'utilisateur cliquera alors sur cet email et pourra
‫alors faire la demande à partir de là.
‫Et cela fonctionnera
‫plus tard lorsque nous implémenterons notre site
‫Web dynamique, mais nous souhaitons néanmoins maintenant créer cette URL ici, afin
‫que l'utilisateur puisse simplement la copier, afin
‫de faciliter la réalisation de cette demande.
‫D'accord, donc en gros, nous
‫devons recréer cette structure d'URL que nous avons ici.
‫Donc, celui-ci est pour le mot de
‫passe oublié et enregistrons-le ici.
‫Donc, mot de passe oublié, et maintenant l'URL que nous créons est
‫en fait pour réinitialiser le mot de passe.
‫Alors, rappelez-vous, nous avons déjà mis en œuvre celui-ci auparavant.
‫D'accord.
‫Allons de l'avant et
‫copiez-le ici, alors réinitialisez le mot de passe, d'accord ?
‫Et cela prendra alors le
‫jeton comme paramètre.
‫D'accord, mettons donc n'importe quel jeton aléatoire ici pour le moment.
‫Donc ça n'a pas d'importance du tout.
‫Permettez-moi de
‫l'enregistrer ici, en tant que mot de passe de réinitialisation.
‫D'accord.
‫Et aussi, ce n'est pas GET, ce n'est pas
‫non plus POST, mais c'est PATCH, car
‫le résultat de cela sera la modification de la propriété
‫password dans le document utilisateur.
‫Et donc PATCH est le meilleur en fait, d'accord ?
‫Modifions donc rapidement notre implémentation de route pour cela.
‫Donc, c'est ici dans userRoute, donc ce n'est
‫pas POST, c'est PATCH, et
‫nous voulons également spécifier un paramètre.
‫Alors, rappelez-vous comment nous faisons cela.
‫Alors c'est comme ici.
‫Donc, une autre barre oblique puis deux points, puis
‫le nom du paramètre, qui sera un jeton.
‫D'accord, et construisons cela
‫maintenant, en commençant par le protocole.
‫Alors, HTTP ou HTTPS, d'accord ?
‫Et nous allons essentiellement obtenir ces données à partir de notre demande.
‫Donc, c'est stocké sur le protocole
‫de point de demande, puis deux-points, barre oblique, puis l'hôte, d'accord ?
‫Donc, nous préparons essentiellement celui-ci ici pour travailler à
‫la fois en développement et en production.
‫Alors, demandez dot get, puis
‫hébergez.
‫D'accord, c'est ainsi que nous obtenons l'hôte,
‫puis slash api slash version un, et je suppose que ce n'est pas idéal
‫de définir un niveau codé en dur comme celui-ci,
‫mais encore une
‫fois, c'est quelque chose que nous allons
‫corriger un peu plus tard, d'accord?
‫Et je vois que ce n'est en fait pas correct.
‫Ces accolades devraient être là.
‫Alors, maintenant, utilisateurs,
‫resetPassword, puis
‫encore une autre barre oblique, et enfin le jeton.
‫Bon, alors, resetToken.
‫D'accord?
‫Et comme nous en avons discuté précédemment, dans
‫la dernière conférence,
‫ici, nous devons en fait envoyer le resetToken d'origine simple, et non le jeton crypté.
‫D'accord?
‫Nous comparerons ensuite,
‫à l'étape suivante, le jeton d'origine avec celui crypté.
‫Donc, encore une fois, comme nous en avons discuté dans la dernière vidéo.
‫Sauvegardez-le ici maintenant, et c'est donc notre URL de réinitialisation.
‫Et maintenant, sur la base de cette URL, créons rapidement
‫le message ici également.
‫Alors, vous avez oublié votre mot de passe ?
‫Soumettez une demande de PATCH avec votre nouveau mot de passe
‫et mot de passeConfirmez bien sûr,
‫à l'URL de
‫réinitialisation que nous venons de créer, d'accord ?
‫Donc, fondamentalement, en donnant à l'utilisateur quelques instructions ici.
‫Ensuite, sur une nouvelle ligne, nous
‫disons également, si vous n'avez pas oublié votre mot de passe,
‫veuillez ignorer cet e-mail.
‫C'est donc un message courant, et encore
‫une fois, je suis sûr que vous l'avez vu d'une
‫manière ou d'une autre, d'accord.
‫Alors maintenant, enfin, envoyons l'e-mail, et
‫rappelons-nous que sendEmail est
‫une fonction asynchrone.
‫Et donc, par conséquent, nous devons l'attendre ici.
‫D'accord?
‫Parce que, bien sûr, ça va retourner une promesse.
‫Et rappelez-vous maintenant que la fonction sendEmail prend
‫ici un objet avec quelques options.
‫L'e-mail est donc utilisateur. e-mail, non?
‫Ou nous pourrions aussi dire, req. corps. e-mail.
‫C'est donc exactement la même chose, en fait, non ?
‫Ensuite, le sujet que nous voulons
‫dire est, votre jeton de réinitialisation de mot de passe.
‫Disons tout de suite qu'elle n'est valable que
‫10 minutes, pour que l'utilisateur sache qu'il doit se dépêcher.
‫D'accord, et enfin, le message aussi.
‫D'accord.
‫Donc, nous attendons cela,
‫et après cela, envoyons également, bien sûr, une réponse.
‫D'accord, il doit toujours y avoir une réponse,
‫sinon, comme vous le
‫savez déjà, le cycle demande/réponse ne se terminera jamais.
‫Nous envoyons donc simplement un
‫code 200, puis un message bien formaté
‫avec un statut
‫de réussite, puis juste un
‫message rapide disant, Token envoyé à l'e-mail.
‫D'accord.
‫Et, bien sûr, nous ne pouvons pas envoyer le jeton de réinitialisation ici, par
‫adjacent, à droite, car tout le monde pourrait alors réinitialiser le mot
‫de passe de n'importe qui et
‫prendre en charge le compte de son choix.
‫Et c'est donc toute la raison pour laquelle
‫nous l'envoyons à une adresse e-mail, car
‫nous supposons que l'e-mail est
‫un endroit sûr, auquel seul l'utilisateur a accès.
‫D'accord.
‫Whoo, donc, cette vidéo, encore une fois, est assez longue, mais
‫nous n'avons toujours pas terminé.
‫Nous avons presque terminé, mais pas tout à
‫fait, car il pourrait se produire
‫une erreur, en utilisant ce sendEmail, d'accord, et donc dans ce cas,
‫nous voulons bien sûr envoyer un message d'erreur au client.
‫Mais dans ce cas, nous devons en fait faire
‫plus que simplement envoyer un message d'erreur.
‫En gros, nous devons réinitialiser le jeton de réinitialisation du mot de passe
‫et la réinitialisation du mot de passe a expiré que nous avons définie, d'accord ?
‫Et donc pour le moment, il ne suffit
‫pas de simplement détecter l'erreur et de
‫l'envoyer ensuite à notre middleware global de gestion des erreurs.
‫Mais à la place, nous devons simplement
‫ajouter un bloc try-catch ici.
‫Encore une fois, parce que nous
‫voulons en fait faire plus que simplement envoyer une
‫erreur au client, nous essayons donc essentiellement
‫de le faire, d'accord, mais en cas d'erreur,
‫alors, bien sûr, ce bloc ici est exécuté.
‫D'accord?
‫Donc, ce que nous voulons faire dans ce cas,
‫eh bien, nous voulons essentiellement, comme je
‫l'ai dit, réinitialiser à la fois le jeton et la propriété expires.
‫D'accord.
‫Donc, passwordResetToken, et
‫définissez-le sur non défini, d'accord.
‫Et la même chose pour passwordResetExpires.
‫D'accord.
‫Et puis, bien sûr, comme avant,
‫cela ne fait que modifier les données, mais ne les enregistre pas vraiment.
‫Et alors allons ajouter, récupérons celui-ci,
‫et donc pour sauvegarder les données dans ce cas.
‫D'accord, et puis juste pour
‫finir, nous, bien sûr, retournons ensuite avec une erreur
‫au middleware suivant.
‫Donc newAppError, Il
‫y a eu une erreur lors de l'envoi de l'e-mail.
‫Réessayez plus tard.
‫Et dans ce cas, le code d'erreur peut en fait être un 500.
‫Donc c'est vraiment alors, comme une erreur qui s'est produite sur
‫le serveur, et donc ça doit être un
‫code cinq, et 500 est juste, comme, le code standard.
‫D'accord.
‫Alors, allons-y maintenant et réessayez, très bien.
‫C'est donc encore une fois assez long, mais bon, nous devons
‫le faire, n'est-ce pas ?
‫Alors, mot de passe oublié, avec cet e-mail, vérifions-le.
‫Cela peut donc ne pas prendre
‫beaucoup de temps, à cause de l'envoi
‫de l'e-mail, mais en fait, cela a fonctionné maintenant, cela a pris environ cinq
‫secondes, mais nous voyons Token envoyé à l'e-mail.
‫et donc, comme nous le savons, depuis que nous avons utilisé Mailtrap, il n'a
‫en fait pas envoyé cet e-mail à hello@jones. io mais à
‫la place, l'e-mail devrait maintenant être
‫piégé à l'intérieur de Mailtrap.
‫Et, en effet, ici sur le côté gauche, il est maintenant apparu.
‫D'accord.
‫C'est donc l'e-mail que nous avons spécifié et nous
‫obtenons ici notre belle URL.
‫D'accord, donc celui que nous avons créé avec le protocole,
‫l'hôte, et puis aussi avec le token.
‫Jetons donc un coup d'œil
‫s'il s'agit vraiment
‫de notre jeton simple, se
‫terminant donc par 88df, et, en effet, nous avons ici resetToken, 88df.
‫Et maintenant dans la base de données,
‫nous devrions avoir le jeton se terminant par 1111.
‫Alors, confirmons que, ici dans
‫Compass, rechargez-le et, en effet, c'est parti, d'accord ?
‫Et encore une fois, c'est ici dans 10 minutes.
‫Super, alors nous avons terminé cette partie.
‫Ensuite, dans la vidéo suivante, nous réinitialiserons réellement
‫le mot de passe, en fonction,
‫bien sûr, du nouveau mot de passe
‫que l'utilisateur envoie avec la demande de réinitialisation du mot de passe.
‫Alors, à bientôt.