1
00:00:00,420 --> 00:00:07,740
Bienvenue dans cette leçon, nous allons reprendre là où nous l'avons laissé avec le code d'authentification, pas le code seul.

2
00:00:07,960 --> 00:00:09,000
Vous ne codez jamais seul.

3
00:00:09,060 --> 00:00:10,000
Vous m'avez ici.

4
00:00:10,230 --> 00:00:12,520
Donc codez le long de la partie 3.

5
00:00:12,690 --> 00:00:15,040
Maintenant, nous arrivons à la viande d'authentification.

6
00:00:15,090 --> 00:00:24,440
Nous allons commencer par ajouter ces itinéraires d'inscription, enregistrer les itinéraires et le formulaire d'inscription et s'assurer qu'à la fin de cette vidéo nous devrions être en mesure de vous inscrire à notre application.

7
00:00:24,480 --> 00:00:25,740
Nous ne serons pas en mesure de vous déconnecter.

8
00:00:25,890 --> 00:00:28,400
Nous ne serons pas en mesure de vous connecter mais nous pourrons vous inscrire.

9
00:00:28,740 --> 00:00:29,490
D'ACCORD.

10
00:00:30,000 --> 00:00:31,160
Alors, commençons.

11
00:00:31,170 --> 00:00:34,480
La première chose que nous devons discuter sont les itinéraires que nous devons ajouter.

12
00:00:34,530 --> 00:00:46,250
Et avant que je le fasse je vais juste ajouter un petit diviseur ici parce que nous avons beaucoup de contenu vers le haut de dessus qui dit simplement des itinéraires que je ferai ceci avec des signes un peu égaux.

13
00:00:46,500 --> 00:00:49,790
Juste pour préciser que toutes les routes vont au-dessous de cette ligne.

14
00:00:49,800 --> 00:00:50,560
D'ACCORD.

15
00:00:50,910 --> 00:00:54,620
Donc, nous avons notre slash obtenir et nous avons l'itinéraire secret.

16
00:00:55,050 --> 00:01:00,630
Maintenant ici, nous allons ajouter dans notre Auth. Itinéraires pour revoir les itinéraires dont nous avons besoin.

17
00:01:00,780 --> 00:01:11,700
Je vais vraiment aller à la version de travail de cette page d'accueil étonnante et puis lorsque vous cliquez sur l'avis de registre que l'URL est slash de registre et nous voyons un formulaire.

18
00:01:11,820 --> 00:01:25,890
Donc, nous avons un registre de slash d'itinéraire qui nous montrera le formulaire pour réellement s'inscrire et puis si nous inspectons ce formulaire, vous verrez qu'il est en train d'envoyer une demande de post pour slash register post slash register.

19
00:01:25,980 --> 00:01:28,100
Nous n'avons pas à l'appeler registre slash.

20
00:01:28,110 --> 00:01:31,330
Vous verrez des choses comme inscription ou enregistrement.

21
00:01:31,380 --> 00:01:35,530
Il peut être ce que vous voulez, mais l'enregistrement est bon pour nous.

22
00:01:35,670 --> 00:01:36,830
Donc, nous allons revenir à notre apt.

23
00:01:36,850 --> 00:01:37,390
Oui.

24
00:01:37,500 --> 00:01:43,570
Et nous devons ajouter ces deux routes et je vais commencer par une application ne reçoivent pas de registre slash.

25
00:01:43,650 --> 00:01:47,550
Et encore le point de ceci est juste pour montrer la forme.

26
00:01:47,550 --> 00:01:50,530
Donc, montrer formulaire d'inscription.

27
00:01:51,040 --> 00:01:51,590
D'ACCORD.

28
00:01:51,720 --> 00:02:09,400
Donc apt get slash register et puis notre callback dans ici la demande et la réponse exactement comme ça et nous ferons redstart rendre et nous allons appeler son modèle de registre et la prochaine chose logique à faire serait de créer le formulaire de registre.

29
00:02:09,540 --> 00:02:13,480
Donc, nous allons faire une vue tactile slash registre.

30
00:02:13,620 --> 00:02:28,010
E.J. Oui, puis nous allons ouvrir le même fichier et à l'intérieur d'ici, nous allons commencer par un simple disons simplement signer formulaire et enregistrer et nous allons nous assurer que nous pouvons voir que.

31
00:02:28,260 --> 00:02:32,660
Alors commencez le serveur, alors nous allons aller à notre application ici.

32
00:02:33,180 --> 00:02:35,330
Revenez au chemin racine pour commencer.

33
00:02:35,580 --> 00:02:40,800
Et maintenant, allons à la barre oblique de registre et obtenir l'inscription pour lui.

34
00:02:40,800 --> 00:02:41,610
Génial.

35
00:02:41,610 --> 00:02:47,930
Maintenant, ajoutons dans un forum et notre formulaire doit avoir deux entrées, une pour le nom d'utilisateur un pour le mot de passe.

36
00:02:48,090 --> 00:02:53,070
Nous allons donc commencer par définir un formulaire et nous reviendrons et ajouterons la méthode en action.

37
00:02:53,100 --> 00:02:54,760
Nous commencerons par une contribution.

38
00:02:55,140 --> 00:03:02,310
Les deux sont dactylographiés texte, bien que nous pouvons faire le mot de passe type d'entrée est égale mot de passe qui est en fait une meilleure idée.

39
00:03:02,310 --> 00:03:21,040
Donc, le type d'entrée va texte placeholder équivaut à nom d'utilisateur juste comme ça et puis je vais juste dupliquer cela et je vais faire le type d'entrée parce que mot de passe et espace réservé sera mot de passe et enregistrer.

40
00:03:21,360 --> 00:03:28,380
Et puis nous allons ajouter dans un soumettre et nous pouvons soit faire type d'entrée est égal à soumettre ou.

41
00:03:28,840 --> 00:03:29,280
Ou.

42
00:03:29,340 --> 00:03:31,200
Je préfère un bouton.

43
00:03:31,710 --> 00:03:34,820
L'un ou l'autre fonctionnera tant que le bouton se trouve à la fin du formulaire.

44
00:03:34,860 --> 00:03:36,580
Il soumettra automatiquement le formulaire.

45
00:03:36,870 --> 00:03:37,140
D'ACCORD.

46
00:03:37,140 --> 00:03:48,300
Alors soumettez et puis nous avons notre type d'entrée parce que le type de saisie de texte passe mot de passe et nous pouvons commencer par juste jeter un coup d'oeil à ceci et nous voyons notre forme mais nous manquons deux choses cruciales.

47
00:03:48,300 --> 00:03:57,360
Tout d'abord, le formulaire ne va nulle part et même s'il a envoyé quelque part, il n'enverrait aucun de ces éléments, car nous n'avons pas les attributs de nom.

48
00:03:57,450 --> 00:04:09,000
Donc, nous avons besoin d'ajouter un nom égal au nom d'utilisateur et le nom est égal à mot de passe juste comme ça et nous allons enregistrer.

49
00:04:09,000 --> 00:04:14,590
Maintenant, si nous jetons un coup d'oeil à la forme rien ne devrait sembler différent, mais il est maintenant presque mis en place.

50
00:04:14,760 --> 00:04:17,410
Maintenant nous devons ajouter les informations pour l'étiquette de formulaire.

51
00:04:17,540 --> 00:04:20,380
Ou nous avons action et méthode.

52
00:04:20,400 --> 00:04:24,720
Donc, l'action, il va être caisse enregistreuse aussi.

53
00:04:24,900 --> 00:04:29,430
Mais nous allons l'envoyer comme une demande de poste et nous n'avons pas encore cette route.

54
00:04:29,640 --> 00:04:46,710
Donc, si je suis allé et rempli le formulaire dès maintenant si je rafraîchir et rempli le formulaire, il serait juste accrocher et puis éventuellement temps parce que nous n'avons pas un registre post-road slash et cela peut être appelé tout bien sûr, mais c'est Conventionnelle pour le nommer la même chose que le registre de la barre oblique de l'itinéraire.

55
00:04:46,770 --> 00:05:02,820
Donc, faisons la même chose et cette route serait effectivement responsable de la manipulation des utilisateurs s'inscrire et nous allons faire une application post slash fonction de registre réponse à la demande.

56
00:05:02,820 --> 00:05:06,000
Et ici nous allons ajouter toute la logique pour commencer.

57
00:05:06,000 --> 00:05:14,930
Nous allons juste faire un bon repos et enregistrer post-Trib juste pour s'assurer qu'il est connecté OK.

58
00:05:15,120 --> 00:05:23,000
Et si nous redémarrer le serveur et revenir actualiser la page de remplir des données aléatoires et cliquez sur soumettre.

59
00:05:23,060 --> 00:05:25,500
Nous devrions voir post-draft enregistré.

60
00:05:25,660 --> 00:05:26,380
Voilà.

61
00:05:26,510 --> 00:05:29,120
Donc, cela signifie que notre formulaire se soumet au bon endroit.

62
00:05:29,120 --> 00:05:38,320
Nous frappons ceci maintenant que nous arrivons à la partie amusante qui est où nous réellement manipulez l'utilisateur s'inscrivent environ 10 nouvelles lignes que vous n'avez pas vues la plupart de.

63
00:05:38,880 --> 00:05:43,550
Je vais commencer par écrire la syntaxe, puis je vais faire une pause et aller sur chaque ligne et ce qu'il fait.

64
00:05:43,620 --> 00:05:51,210
Et la première chose que nous avons réellement besoin de faire qui est une revue est que nous devons ajouter l'analyseur dans le corps et le configurer parce que nous prenons des données à partir d'un formulaire.

65
00:05:51,200 --> 00:05:55,990
Ce formulaire est d'envoyer des données dans le corps et nous voulons être en mesure de dire demande de corps.

66
00:05:56,020 --> 00:05:59,090
Utilisez votre nom pour le mot de passe Quest up Vadi.

67
00:05:59,250 --> 00:06:01,170
En ce moment, ceux-ci seront vides.

68
00:06:01,520 --> 00:06:15,240
Donc up top, nous avons juste besoin de faire une application qui utilisent l'économe du corps dot URL codé et puis nous ajoutons dans ce vrai étendu.

69
00:06:15,770 --> 00:06:18,970
Et c'est un autre ces lignes que vous venez de s'habituer à taper.

70
00:06:19,190 --> 00:06:23,660
Nous avons besoin à tout moment que nous allons utiliser un formulaire et d'afficher des données à une demande.

71
00:06:24,020 --> 00:06:25,890
OK, c'est fait maintenant.

72
00:06:26,250 --> 00:06:35,750
Donc, nous devrions être en mesure d'obtenir la demande de corps à ce nom d'utilisateur et mot de passe qui contiendra le nom d'utilisateur et le mot de passe à partir du formulaire que l'utilisateur tente de s'inscrire avec.

73
00:06:35,750 --> 00:06:40,630
Donc, maintenant, nous sommes de retour à la logique et je vais taper quelques lignes que j'ai mentionné et ensuite les expliquer par la suite.

74
00:06:40,940 --> 00:06:48,810
Donc, l'utilisateur ne s'inscrivent pas et ensuite au lieu de l'enregistrement de point d'utilisateur, nous allons passer dans Nouvel utilisateur et dans Nouvel utilisateur.

75
00:06:48,900 --> 00:06:57,560
Nous allons passer en nom d'utilisateur est égal à demander jusqu'à Oddy ce nom d'utilisateur, mais nous n'ajoutons pas de mot de passe dans ce nouvel utilisateur.

76
00:06:57,620 --> 00:07:11,440
Nous allons réellement l'ajouter après que nous ayons créé la nouvelle requête d'utilisateur jusqu'à la virgule de mot de passe de corps et puis nous allons ajouter une fonction de rappel jamais et alors l'utilisateur et alors nous ouvrirons cela.

77
00:07:12,160 --> 00:07:12,850
D'ACCORD.

78
00:07:13,230 --> 00:07:15,140
Alors parlons de ce que nous avons fait jusqu'à présent.

79
00:07:15,140 --> 00:07:21,860
Nous créons un nouvel objet utilisateur qui n'est pas réellement sécurisé pour la base de données mais c'est un nouvel utilisateur et nous ne transmettons que le nom d'utilisateur.

80
00:07:22,310 --> 00:07:26,170
Et la raison pour laquelle nous faisons cela, c'est que nous ne sauvegardons pas le mot de passe dans la base de données.

81
00:07:26,190 --> 00:07:27,570
Ce n'est pas vraiment une bonne idée.

82
00:07:27,920 --> 00:07:29,990
Et je vais vous montrer ce que nous avons réellement économiser à la place.

83
00:07:30,000 --> 00:07:33,510
Une fois que nous obtenons quelque chose dans une base de données, mais ce n'est pas le mot de passe.

84
00:07:33,500 --> 00:07:40,010
Donc, ce que nous faisons, c'est que nous passons le mot de passe comme un deuxième argument à l'utilisateur dot register et utiliser votre point de registre.

85
00:07:40,010 --> 00:07:50,290
Nous allons prendre ce nouvel utilisateur qui a un nom d'utilisateur et nous allons hachage ce mot de passe qui signifie essentiellement qu'il le transforme en cette énorme chaîne de chiffres et de lettres et il stocke dans la base de données.

86
00:07:50,510 --> 00:07:55,730
Donc il passe l'objet utilisateur que nous voulons créer et ensuite nous passons le mot de passe séparément.

87
00:07:56,220 --> 00:08:01,330
Et puis, si tout va bien, il renverra un nouvel utilisateur qui a tout à l'intérieur de celui-ci.

88
00:08:01,400 --> 00:08:05,120
Il a le nom d'utilisateur et puis il a le mot de passe haché aussi bien.

89
00:08:05,120 --> 00:08:06,220
Alors voyons si cela fonctionne.

90
00:08:06,320 --> 00:08:22,340
Et au lieu d'ici, nous allons ajouter notre simple si l'erreur et nous allons faire une erreur de log de la console et puis nous allons aussi faire un point rouge rendre le formulaire à nouveau comme ça.

91
00:08:22,560 --> 00:08:31,350
Et s'il n'y a pas d'erreur alors nous avons une autre ligne à faire qui est Passport dot authentifier local.

92
00:08:31,470 --> 00:08:33,730
Et encore une fois, je vais vous expliquer cela plus tard.

93
00:08:34,150 --> 00:08:42,360
Demande réponse fonction et au lieu d'ici nous allons rediriger vers la page secrète.

94
00:08:42,360 --> 00:08:47,720
Cela se produit une fois que l'utilisateur a été créé et qu'il n'y a pas d'erreur en cas d'erreur.

95
00:08:47,730 --> 00:08:51,280
Nous allons rendre cette page de registre et c'est là que nous avons un retour ici.

96
00:08:51,290 --> 00:08:52,950
Il court tout simplement tout.

97
00:08:53,220 --> 00:08:57,780
Et s'il n'y a pas d'erreur, nous allons exécuter authentification passeport.

98
00:08:57,890 --> 00:09:04,410
Donc, cette ligne ici passeport authentifier va réellement vog l'utilisateur qui prendra soin de tout dans la session.

99
00:09:04,470 --> 00:09:06,140
Il stockera les informations correctes.

100
00:09:06,140 --> 00:09:10,510
Il exécutera la méthode utilisateur sérialisée que nous avons spécifiée ici.

101
00:09:11,000 --> 00:09:14,600
Et puis nous indiquons que nous voulons utiliser la stratégie locale.

102
00:09:15,090 --> 00:09:22,050
Et à l'avenir, si nous voulions utiliser une autre stratégie et nous l'avions installé, nous pourrions changer cela pour être Twitter ou Facebook.

103
00:09:22,080 --> 00:09:23,570
Et il ya d'autres choses que vous devez faire.

104
00:09:23,580 --> 00:09:27,860
Nous devons nous inscrire et obtenir des informations d'identification sur Twitter et Facebook et nous devons enregistrer nos applications.

105
00:09:27,950 --> 00:09:29,170
C'est donc plus compliqué.

106
00:09:29,370 --> 00:09:36,120
Mais en ce qui concerne la logique et le passeport, nous pouvons juste échanger des choses et sortir et il ya quelques petits ajustements que nous devons faire.

107
00:09:36,200 --> 00:09:40,970
Mais généralement le passeport rend vraiment facile pour nous d'échanger des stratégies différentes.

108
00:09:41,150 --> 00:09:42,730
Donc, nous allons utiliser local.

109
00:09:43,160 --> 00:09:46,380
Et ce nouveau est juste va effectivement enregistrer l'utilisateur en.

110
00:09:46,830 --> 00:09:54,920
Et une fois que l'utilisateur a été connecté, nous allons rediriger vers le secret secrets stash et c'est juste un choix personnel.

111
00:09:54,920 --> 00:10:00,390
Nous pourrions revenir à la page d'accueil de l'itinéraire, mais le secret slash est ce que nous sommes tous ici pour.

112
00:10:00,500 --> 00:10:10,950
Donc, une fois que nous nous inscrivons une fois que nous nous inscrivons, nous devrions être ensuite pris pour slash secret à moins qu'il y ait un problème et puis nous reviendrons au formulaire d'inscription.

113
00:10:11,000 --> 00:10:15,110
Donc testons-le, assurez-vous que nous n'avons pas d'erreurs de syntaxe.

114
00:10:15,120 --> 00:10:16,380
Cela semble bon.

115
00:10:16,400 --> 00:10:20,920
Maintenant, allons à notre application et actualisez la page et inscrivez-vous.

116
00:10:21,260 --> 00:10:35,220
Donc, je vais créer un compte en tant que Colt et mon mot de passe sera juste mot de passe et pas de soumettre le coup et nous arrivons à la page secrète qui est de bonnes nouvelles, mais pour vraiment s'assurer qu'il a fonctionné.

117
00:10:35,370 --> 00:10:46,130
Arrêtons le serveur et nous allons ouvrir Mongo et je vais me connecter à ma base de données, donc je ferai voir Digby et la base de données est Auth. Application de démonstration.

118
00:10:46,430 --> 00:11:05,810
Donc, je vais utiliser cela, puis je vais regarder les collections de collections et ensuite nous allons à D.B que les utilisateurs trouvent tous les utilisateurs DB et vous pouvez voir, je veux dire, nous faisons un peu plus grand.

119
00:11:05,900 --> 00:11:11,580
Nous avons un seul utilisateur à partir de quand je viens de signer et il ya beaucoup d'informations ici.

120
00:11:11,630 --> 00:11:15,690
Eh bien il ya vraiment pas beaucoup, il ya seulement quelques morceaux, mais il ressemble beaucoup.

121
00:11:15,710 --> 00:11:18,300
Plus important encore, nous avons un nom d'utilisateur ici.

122
00:11:18,360 --> 00:11:19,480
Votre nom Colts.

123
00:11:19,640 --> 00:11:23,410
C'est la pièce unique que nous avons précisée qui nous paraît normale.

124
00:11:23,750 --> 00:11:32,040
Et puis il ya ces choses sel et hachage et je parle beaucoup plus sur ces dans l'authentification à partir de l'unité de scratch.

125
00:11:32,250 --> 00:11:42,250
Donc nous n'allons pas aller dans beaucoup de détails tout ce que je vais mentionner à ce sujet pour l'instant est que l'avis de notre mot de passe crus le mot mot de passe dans mon cas n'est pas stocké dans la base de données à tous.

126
00:11:42,360 --> 00:11:44,790
Ce que nous stockons est cette version hachée fou.

127
00:11:44,960 --> 00:11:49,150
Et puis cette autre chose appelée sel qui va nous aider à hash cela.

128
00:11:49,320 --> 00:11:59,610
Et en nous aidant, je veux dire que tout est pris en charge par le paquet de passeport manglers local que nous avons installé et reconfiguré comme une prise dans laquelle nous avons fait ici.

129
00:11:59,660 --> 00:12:05,010
Donc, cela prend soin de tout, du hachage au salage à stocker des choses dans la base de données.

130
00:12:05,100 --> 00:12:14,570
Tout ce que nous avions à faire était cette ligne simple ou redimensionner ce nouveau compte utilisateur dot register et nous passons dans un nouvel utilisateur avec un nom d'utilisateur.

131
00:12:14,580 --> 00:12:16,030
Et puis il prend soin de tout le reste.

132
00:12:16,050 --> 00:12:20,250
Nous lui donnons le mot de passe du formulaire mais nous ne le sauvegardons jamais à l'utilisateur.

133
00:12:20,370 --> 00:12:24,540
Au lieu de cela, il gère tout et il ne sauve jamais un mot de passe du tout.

134
00:12:24,600 --> 00:12:26,790
C'est en fait enregistrer la version de hachage.

135
00:12:27,240 --> 00:12:27,890
D'ACCORD.

136
00:12:28,520 --> 00:12:30,590
Alors, sortons de Mongo maintenant.

137
00:12:31,320 --> 00:12:40,840
Et nous avons maintenant l'enregistrement de travail de la dernière chose que nous pourrions faire est d'ouvrir la page d'index ou la page d'accueil, je veux dire récit que rendre à la maison.

138
00:12:40,860 --> 00:12:51,060
Donc, faisons C9 vues sosh maison et nous allons simplement ajouter un lien afin que nous allons ajouter un allié ici et ce lien devrait aller à la page de registre.

139
00:12:51,060 --> 00:13:01,060
Ce sera donc un tag ancré avec un voyage égal à une caisse enregistreuse et nous allons simplement ajouter Sign-Up à l'intérieur du texte.

140
00:13:01,080 --> 00:13:06,160
Donc, maintenant, si nous démarrons le serveur, nous allons effacer tout ce noeud à distance.

141
00:13:06,250 --> 00:13:11,880
Oui et l'application visiteur et allez à la page d'accueil.

142
00:13:11,880 --> 00:13:15,970
Nous avons maintenant un lien d'inscription où nous pouvons aller vous inscrire.

143
00:13:16,110 --> 00:13:16,590
Génial.

144
00:13:16,670 --> 00:13:19,920
Donc, nous avons couvert tout ce que je veux couvrir dans cette vidéo dans la prochaine vidéo.

145
00:13:19,940 --> 00:13:21,700
Nous allons travailler sur les fonctionnalités de connexion.