1
00:00:00,330 --> 00:00:06,050
Bentornato in questo, sai che ci stiamo concentrando sull'autenticazione degli utenti in cui inizi per brevità.

2
00:00:06,120 --> 00:00:10,890
Nella mia esperienza di autori qualcosa di cui gli studenti sono davvero entusiasti di conoscere perché pensano

3
00:00:10,890 --> 00:00:14,710
che renda le sue app legittime e le faccia sentire reali e utilizzabili.

4
00:00:14,760 --> 00:00:18,210
Se riesci a registrarti, puoi accedere e puoi uscire.

5
00:00:18,690 --> 00:00:21,030
Quindi è una cosa divertente ed eccitante da insegnare.

6
00:00:21,270 --> 00:00:26,580
Ma la verità è che è anche una cosa molto difficile da insegnare perché l'autenticazione è piuttosto complicata.

7
00:00:27,180 --> 00:00:31,130
Ci sono molti pezzi mobili che devono adattarsi perfettamente nel modo giusto per farlo funzionare.

8
00:00:31,140 --> 00:00:32,490
Un sacco di grandi concetti.

9
00:00:32,670 --> 00:00:34,850
E onestamente è un sacco di codice per farlo funzionare.

10
00:00:35,130 --> 00:00:40,170
Fortunatamente per noi ci sono molti ottimi strumenti che ci aiutano a implementare l'autenticazione in modo

11
00:00:40,440 --> 00:00:41,530
rapido e sicuro.

12
00:00:41,550 --> 00:00:45,060
Ora spiega cosa intendo in modo sicuro più avanti in questo video.

13
00:00:45,060 --> 00:00:49,860
Prima di immergermi nello spiegare gli strumenti e il flusso di lavoro dell'autenticazione, voglio passare un po

14
00:00:49,860 --> 00:00:53,540
'di tempo a darti un'idea del mio processo di pensiero dietro l'insegnamento dell'arte.

15
00:00:53,640 --> 00:00:57,990
È uno di quegli argomenti che ho trascorso molto tempo ad insegnarlo ma anche a insegnarlo

16
00:00:57,990 --> 00:00:59,120
in molti modi diversi.

17
00:00:59,520 --> 00:01:02,960
Quando insegni all'autenticazione utente, c'è una scelta che devi fare.

18
00:01:03,210 --> 00:01:09,090
E per me quella scelta sarebbe stata quella di insegnare l'autenticazione da zero senza usare alcuno strumento e

19
00:01:09,090 --> 00:01:14,580
facendo in modo che gli studenti si concentrassero sui dettagli di ogni concetto importante e ci sarebbero

20
00:01:14,580 --> 00:01:15,660
volute cinque ore.

21
00:01:15,660 --> 00:01:17,790
Potrebbe essere un sacco di lezioni un sacco di video.

22
00:01:17,910 --> 00:01:23,010
Potremmo finire per perdere alcuni studenti, ma faremo in modo che tutti capiscano

23
00:01:23,010 --> 00:01:23,960
come funziona l'autenticazione.

24
00:01:24,120 --> 00:01:30,000
a questo problema di è più importante per gli studenti avere una profonda comprensione di come le cose lavoro.

25
00:01:30,120 --> 00:01:35,850
O usiamo alcuni degli strumenti esistenti là fuori strumenti che ci aiutano ad aggiungere l'autenticazione dell'utente più velocemente e

26
00:01:35,850 --> 00:01:38,650
con meno linee di codice e tutto si riduce

27
00:01:38,760 --> 00:01:43,650
È questa la priorità o è una priorità avere gli studenti a fare le cose velocemente.

28
00:01:43,650 --> 00:01:49,350
Quindi riguarda la comprensione concettuale e la profondità della conoscenza o si tratta di fare cose.

29
00:01:49,350 --> 00:01:52,230
Ovviamente in un mondo ideale vorremmo entrambi.

30
00:01:52,230 --> 00:01:56,910
Vogliamo che tutti capiscano i dettagli di tutto ciò che insegniamo e vogliamo che gli studenti abbiano

31
00:01:56,910 --> 00:02:00,830
un sacco di conoscenze pratiche e siano in grado di fare le cose rapidamente.

32
00:02:01,350 --> 00:02:06,930
comprensione di ogni concetto e di come tutto funzionasse e si integrasse prima ancora di implementare qualsiasi cosa.

33
00:02:06,960 --> 00:02:12,060
In passato ho provato entrambi gli approcci per insegnare dove ho iniziato cercando di dare agli

34
00:02:12,060 --> 00:02:12,900
studenti una profonda

35
00:02:13,290 --> 00:02:17,400
E poi ho anche fatto il contrario, dove proviamo e facciamo funzionare alcune cose per

36
00:02:17,400 --> 00:02:19,350
poi tornare e parlare di come funziona.

37
00:02:19,530 --> 00:02:24,240
E ho passato ancora più tempo a pensare a come vogliamo avvicinarci in questo video corso.

38
00:02:24,240 --> 00:02:28,260
Ho registrato questa lezione troppe volte in cui ho rielaborato tutto il codice riscritto.

39
00:02:28,260 --> 00:02:32,190
È uno che voglio ottenere giusto perché è davvero importante e uno che molti studenti non

40
00:02:32,190 --> 00:02:33,120
vedono l'ora di fare.

41
00:02:33,480 --> 00:02:38,850
Quindi, quello che ho deciso di fare è di avere due unità in questa prima unità sull'autenticazione che

42
00:02:38,850 --> 00:02:39,660
stai attualmente guardando.

43
00:02:39,660 --> 00:02:43,040
Inizierò offrendoti una panoramica molto rapida.

44
00:02:43,260 --> 00:02:46,740
Non del tutto approfondito, ma solo una rapida panoramica di come funziona l'autenticazione.

45
00:02:46,860 --> 00:02:51,450
E poi useremo questi strumenti di cui ho parlato per semplificare le nostre vite e rendere il

46
00:02:51,450 --> 00:02:52,300
codice più breve.

47
00:02:52,320 --> 00:02:53,730
Li useremo subito.

48
00:02:53,970 --> 00:02:59,400
E l'obiettivo è solo creare qualcosa che abbia sia un'occasione che una delle unità opzionali.

49
00:02:59,460 --> 00:03:05,610
Alla fine di questo corso ci sarà un vero e proprio tuffo nell'autenticazione in cui implementeremo realmente la nostra

50
00:03:05,610 --> 00:03:09,900
autenticazione utente da zero dove non useremo nessuno degli strumenti e ora vi

51
00:03:09,900 --> 00:03:15,390
mostrerò l'obiettivo è fare in modo che il meglio dei due mondi inizi a creare qualcosa.

52
00:03:15,750 --> 00:03:20,460
E non mi dilungherò su tutti i concetti, ma non ho intenzione di spenderti per un'ora, oltre a

53
00:03:20,520 --> 00:03:21,970
parlare di come funzionano le cose.

54
00:03:22,170 --> 00:03:27,030
Bene, ora che abbiamo tolto di mezzo questa grande discussione ideologica qui

55
00:03:27,030 --> 00:03:31,350
voglio introdurre gli strumenti che useremo, quindi useremo qualcosa chiamato passaporto.

56
00:03:31,500 --> 00:03:32,320
Sì.

57
00:03:32,610 --> 00:03:37,470
E non lo usiamo solo perché è qualcosa che renderà la nostra vita più semplice rendendo più breve il

58
00:03:37,710 --> 00:03:39,430
nostro codice rendendo più veloce questa implementazione.

59
00:03:39,720 --> 00:03:42,620
Ma è anche qualcosa che viene usato molto nel mondo reale.

60
00:03:42,750 --> 00:03:47,410
Molte e molte applicazioni usano il passaporto J. S. per implementare la loro autenticazione.

61
00:03:47,700 --> 00:03:49,320
Quindi lascia che ti mostri la home page qui.

62
00:03:49,560 --> 00:03:55,230
Questo è Passport Chaiya balbettato e vedere la piccola tagline dice che l'autenticazione semplice e discreta per

63
00:03:55,230 --> 00:04:01,350
nessun passaporto J è il middleware di autenticazione per il nodo estremamente flessibile e il passaporto modulare può

64
00:04:01,350 --> 00:04:05,200
essere nascosto in modo discreto in qualsiasi applicazione web basata su espresso.

65
00:04:05,280 --> 00:04:10,950
Una serie completa di strategie supporta l'autenticazione utilizzando un nome utente e una password Facebook Twitter

66
00:04:11,070 --> 00:04:12,210
e altro ancora.

67
00:04:12,210 --> 00:04:16,280
E poi puoi vedere quaggiù in realtà più di 300 diverse strategie.

68
00:04:16,440 --> 00:04:21,510
Quindi la strategia è riferita a diversi tipi di autenticazione diversi modi di autenticare le persone sia

69
00:04:21,930 --> 00:04:27,240
che si tratti di avere l'utente di digitare un'e-mail e una password di autenticazione tradizionale o se attraverso

70
00:04:27,240 --> 00:04:32,520
un servizio come Facebook o Twitter che probabilmente avete visto prima su un sito o su un applicazione

71
00:04:32,880 --> 00:04:36,300
in cui ti chiede di accedere tramite Google o Twitter o Facebook.

72
00:04:36,390 --> 00:04:41,690
e possiamo cercare tra di loro in modo che ci siano cose come Fitbit che puoi accedere tramite Fitbit.

73
00:04:41,690 --> 00:04:45,220
E ce ne sono molte di più che possiamo effettivamente visualizzare tutti

74
00:04:45,440 --> 00:04:49,450
Abbiamo Spotify Reddit tumblr Google plus.

75
00:04:49,700 --> 00:04:53,630
Ma di gran lunga i più popolari saranno Facebook Twitter e Google.

76
00:04:53,620 --> 00:04:58,220
E poi anche ciò che è noto come autenticazione locale, che è ciò che inizieremo qui, che

77
00:04:58,490 --> 00:05:00,620
è solo nome utente o email e password.

78
00:05:00,620 --> 00:05:01,170
OK.

79
00:05:01,370 --> 00:05:03,900
Questo è lo strumento di base che utilizzeremo il passaporto.

80
00:05:03,940 --> 00:05:07,660
Sì, sarà di grande aiuto nella nostra implementazione dell'utente.

81
00:05:08,060 --> 00:05:12,960
Ma useremo anche un altro pacchetto chiamato Passport local che ho qui.

82
00:05:13,190 --> 00:05:17,280
E questo è uno di quegli schemi o strategie per l'autenticazione.

83
00:05:17,360 --> 00:05:25,160
Quindi c'è un passaporto Facebook un passaporto Twitter passaporto Google e passaporto locale e oltre 300 strategie diverse passaporto

84
00:05:25,160 --> 00:05:30,700
locale è per username e password che è quello che faremo per iniziare.

85
00:05:30,890 --> 00:05:36,610
Ma il bello del passaporto è che più avanti in questo corso possiamo andare e aggiungere Facebook o

86
00:05:36,800 --> 00:05:42,290
Twitter e possiamo mantenere locale e possiamo avere tre 5 10 modi diversi di accedere alla nostra app.

87
00:05:42,320 --> 00:05:47,420
Di solito vuoi mantenerlo abbastanza limitato ma possiamo averne quante ne vuoi usando Passport e

88
00:05:47,420 --> 00:05:48,500
nominare il passaporto.

89
00:05:48,530 --> 00:05:52,490
Si tratta di fornire questo punto di ingresso in tutti i tipi di destinazioni.

90
00:05:52,870 --> 00:05:58,240
OK e c'è un altro pacchetto che useremo che si chiama mangusta locale Passport.

91
00:05:58,520 --> 00:06:04,460
Quindi ho l'hub get aperto per quello e il passaporto locale Mongoose è un altro pacchetto che ci

92
00:06:04,460 --> 00:06:09,660
aiuterà solo ad implementare l'autenticazione con il passaporto ed è fatto apposta per funzionare con mangusta.

93
00:06:09,830 --> 00:06:11,450
Quindi non dobbiamo usarlo.

94
00:06:11,540 --> 00:06:16,310
Potremmo farla franca solo usando Passport localmente il passaporto locale Mongoose ci aiuterà a renderlo

95
00:06:16,310 --> 00:06:19,430
ancora più veloce e renderlo più semplice per noi.

96
00:06:19,520 --> 00:06:24,620
nella sezione opzionale da zero, creeremo arte da zero senza nessuno di questi strumenti.

97
00:06:24,650 --> 00:06:25,760
E poi, naturalmente,

98
00:06:25,980 --> 00:06:26,470
OK.

99
00:06:26,570 --> 00:06:28,290
Quindi quelli sono i tre strumenti principali.

100
00:06:28,340 --> 00:06:32,810
Ora ti darò una breve demo di ciò che faremo in anticipo e ti avvertirò

101
00:06:32,810 --> 00:06:34,420
che non è molto eccitante visivamente.

102
00:06:34,520 --> 00:06:36,020
Non l'ho affatto stile.

103
00:06:36,020 --> 00:06:39,840
Ma ti aggiungeremo Seraph al tuo campo e lo modificheremo.

104
00:06:40,000 --> 00:06:42,940
Ma per ora questa è l'implementazione di barebone che voglio mostrarti.

105
00:06:43,220 --> 00:06:45,870
Quindi abbiamo iniziato su questa home page e abbiamo tre pulsanti.

106
00:06:46,120 --> 00:06:53,420
Accedi al registro e fai il logout e troverai una segreta barra segreta che puoi vedere solo se sei

107
00:06:53,420 --> 00:06:53,930
loggato.

108
00:06:53,960 --> 00:07:00,770
Quindi se provo ad andare lì adesso non sono loggato e mi riporta indietro a tagliare un log in e mi

109
00:07:00,760 --> 00:07:06,510
mostra il log in form quindi mi registrerò e ti mostrerò che possiamo andare a la pagina segreta.

110
00:07:06,830 --> 00:07:15,680
Quindi userò il nome arrugginito quattro o cinque sei e la password sarà solo la password e poi mi iscriverò.

111
00:07:18,350 --> 00:07:21,030
E mi serve per tagliare il segreto che ora posso visitare.

112
00:07:21,290 --> 00:07:26,090
foto terribilmente imbarazzante dalla mia cella dal mio settimo o ottavo anno quando ho avuto il mio primo laptop.

113
00:07:26,380 --> 00:07:28,040
E sulla pagina segreta ho una

114
00:07:28,040 --> 00:07:28,900
Semplicemente terribile.

115
00:07:29,090 --> 00:07:33,180
Quindi questo è il segreto segreto della barra per una ragione, ovviamente.

116
00:07:33,200 --> 00:07:41,530
E ora se vado a disconnettermi non riesco più a fare lo slash segreto, mi reindirizza per tagliare l'accesso e posso

117
00:07:41,540 --> 00:07:42,670
anche accedere qui.

118
00:07:42,710 --> 00:07:49,920
Quindi userò Rusti quattro cinque sei con la password corretta, che è solo una password e mi

119
00:07:49,920 --> 00:07:58,370
iscrivo o effettuo l'accesso e mi riporta indietro a tale segreto e posso andare alla home page e tornare alla

120
00:07:58,370 --> 00:08:00,620
barra segreta perché rimango connesso.

121
00:08:00,620 --> 00:08:06,180
Quindi il modo in cui funziona il concetto chiave che tutto gira intorno è qualcosa chiamato sessioni.

122
00:08:07,030 --> 00:08:09,680
Darò un breve riassunto di quali sessioni sono.

123
00:08:09,830 --> 00:08:16,360
Fondamentalmente si suppone che il GTP sia un protocollo stateless, il che significa che quando si inviano

124
00:08:16,370 --> 00:08:21,920
richieste tali richieste sono una tantum e non contengono informazioni sulla cronologia o sulle richieste

125
00:08:21,920 --> 00:08:22,660
precedenti effettuate.

126
00:08:22,730 --> 00:08:24,020
Non sono collegati tra loro.

127
00:08:24,050 --> 00:08:29,420
Una richiesta non ha uno stato è solo una transazione unica che renderebbe davvero difficile implementare

128
00:08:29,420 --> 00:08:32,690
l'utente perché voglio essere in grado di rimanere connesso.

129
00:08:32,930 --> 00:08:38,680
Voglio che il server sappia che Rustie 4 o 5 6 è ancora loggato e il modo in cui lo

130
00:08:38,690 --> 00:08:41,280
facciamo è usando le sessioni e quali sessioni faranno.

131
00:08:41,360 --> 00:08:44,750
Sono solo un modo per rendere HTP non apolidi.

132
00:08:44,750 --> 00:08:49,880
C'è un modo per fornire lo stato, quindi quando ogni richiesta che faccio su questa app quando sono

133
00:08:49,880 --> 00:08:55,300
connesso quando qualcuno ha effettuato l'accesso c'è un po 'di informazioni su quell'utente che viene salvato in quella richiesta

134
00:08:55,550 --> 00:09:00,480
che viene inviata al server ed è non in realtà la password utente dell'intero nome utente.

135
00:09:00,620 --> 00:09:05,320
Ma è un po 'di informazioni ed è codificato ed è fondamentalmente fatto per essere un segreto.

136
00:09:05,450 --> 00:09:10,760
codice o non criptato e userà quell'informazione per dire se qualcuno è loggato o meno.

137
00:09:10,760 --> 00:09:16,870
E poi arriva al mio server e poi il passaporto lo vedrà e sarà tradotto in qualcosa che

138
00:09:16,880 --> 00:09:18,250
capisce fondamentalmente crack il

139
00:09:18,470 --> 00:09:21,350
Quindi questo avrà più senso una volta aggiunta l'implementazione.

140
00:09:21,350 --> 00:09:26,460
Ma il concetto chiave è che le sessioni ci permettono di avere uno stato nelle nostre richieste HTP.

141
00:09:26,620 --> 00:09:27,730
Quindi posso inviare dati.

142
00:09:27,770 --> 00:09:33,670
Posso tornare alla home page, ma sa ancora che ho effettuato l'accesso come Rustie 4 5 6

143
00:09:33,670 --> 00:09:36,260
e posso tornare al segreto senza problemi.

144
00:09:36,590 --> 00:09:41,410
inviando un piccolo frammento di informazione che dice che questo è Rustie quattro cinque sei che hanno effettuato l'accesso.

145
00:09:41,680 --> 00:09:44,210
E questo perché ogni volta che faccio una richiesta, sto

146
00:09:44,210 --> 00:09:48,620
E poi, appena esco, quella informazione è sparita.

147
00:09:49,120 --> 00:09:55,120
Così ora, quando vado al taglio segreto, ho una logica che dice che se non ci sono utenti nella sessione, allora

148
00:09:55,280 --> 00:09:57,540
non lasciare che quella persona vada in segreto.

149
00:09:57,620 --> 00:09:59,370
Reindirli per tagliare l'accesso.

150
00:09:59,670 --> 00:09:59,940
OK.

151
00:09:59,960 --> 00:10:04,400
Quindi esamineremo tutto ciò più in dettaglio nel prossimo video quando creeremo

152
00:10:04,390 --> 00:10:09,440
questa semplice applicazione e implementeremo le sessioni per ottenere aiuto con le nostre sessioni.

153
00:10:09,430 --> 00:10:14,220
Utilizzeremo un pacchetto chiamato Express session che vedremo anche nel prossimo video.

154
00:10:14,750 --> 00:10:16,870
OK, questo è tutto ciò che voglio presentare per ora.

155
00:10:16,880 --> 00:10:23,890
Quindi utilizzeremo Passport J come schema locale insieme al modulo o pacchetto di manguste locali del passaporto che ci

156
00:10:23,890 --> 00:10:29,510
aiuterà a implementare l'autenticazione dell'utente in modo abbastanza rapido e relativamente indolore e lo faremo

157
00:10:30,130 --> 00:10:32,970
nel prossimo video in un semplice app

158
00:10:33,080 --> 00:10:38,000
E poi, una volta che avremo funzionato, torneremo al campo e implementeremo l'autenticazione utente lì.

159
00:10:39,050 --> 00:10:40,100
Va bene, vedrò nel prossimo video