1
00:00:01,000 --> 00:00:03,340
‫Instrutor: Então, aprendemos na última aula

2
00:00:03,340 --> 00:00:06,030
‫que o token JSON da web deve

3
00:00:06,030 --> 00:00:08,930
‫ser armazenado em um cookie seguro somente HTTP.

4
00:00:08,930 --> 00:00:11,470
‫Mas, no momento, estamos apenas enviando

5
00:00:11,470 --> 00:00:14,790
‫o token como uma string simples em nossa resposta JSON.

6
00:00:14,790 --> 00:00:18,690
‫Então, neste vídeo, vamos também enviar o token como um cookie,

7
00:00:18,690 --> 00:00:20,960
‫para que o navegador possa salvá-lo de

8
00:00:20,960 --> 00:00:22,473
‫forma mais segura.

9
00:00:23,920 --> 00:00:25,550
‫Então, estamos em nosso código.

10
00:00:25,550 --> 00:00:28,193
‫Nós realmente enviamos o token para o cliente?

11
00:00:29,170 --> 00:00:32,610
‫Bem, lembre-se, isso está no authController e

12
00:00:32,610 --> 00:00:35,920
‫bem aqui na função createSendToken.

13
00:00:35,920 --> 00:00:39,040
‫Então, antes, tínhamos basicamente todo

14
00:00:39,040 --> 00:00:43,180
‫esse código em muitos lugares diferentes, mas depois

15
00:00:43,180 --> 00:00:46,400
‫refatoramos tudo isso apenas nesta função createSendToken.

16
00:00:46,400 --> 00:00:49,090
‫Tudo bem, então é aqui que vamos trabalhar agora.

17
00:00:49,090 --> 00:00:50,980
‫Agora, tenho certeza de que você

18
00:00:50,980 --> 00:00:53,320
‫está familiarizado com a maneira como os cookies funcionam

19
00:00:53,320 --> 00:00:56,680
‫em geral, mas apenas para ter certeza de que estamos todos na mesma

20
00:00:56,680 --> 00:00:58,960
‫página aqui, vamos falar um pouco sobre cookies.

21
00:00:58,960 --> 00:01:02,330
‫Em primeiro lugar, um cookie é basicamente apenas

22
00:01:02,330 --> 00:01:06,240
‫um pequeno texto que um servidor pode enviar aos clientes.

23
00:01:06,240 --> 00:01:08,960
‫Então, quando o cliente receber um cookie,

24
00:01:08,960 --> 00:01:10,650
‫ele o armazenará automaticamente

25
00:01:10,650 --> 00:01:12,860
‫e o enviará de volta automaticamente

26
00:01:12,860 --> 00:01:16,360
‫junto com todas as solicitações futuras para o mesmo servidor.

27
00:01:16,360 --> 00:01:20,130
‫Tudo bem, então, novamente, um navegador armazena automaticamente um cookie

28
00:01:20,130 --> 00:01:23,010
‫que recebe e o envia de

29
00:01:23,010 --> 00:01:27,320
‫volta em todas as solicitações futuras ao servidor de onde veio.

30
00:01:27,320 --> 00:01:29,500
‫Ok, agora, por enquanto, isso não vai

31
00:01:29,500 --> 00:01:31,090
‫ser muito importante para

32
00:01:31,090 --> 00:01:34,020
‫nós, pois estamos apenas testando a API usando o Postman.

33
00:01:34,020 --> 00:01:37,110
‫Mas um pouco mais tarde, quando vamos renderizar páginas

34
00:01:37,110 --> 00:01:39,510
‫da Web dinâmicas e realmente interagir com

35
00:01:39,510 --> 00:01:41,450
‫o navegador, será muito importante

36
00:01:41,450 --> 00:01:44,220
‫que o navegador envie o token de volta basicamente

37
00:01:44,220 --> 00:01:46,410
‫de forma automática em cada solicitação.

38
00:01:46,410 --> 00:01:49,640
‫Ok, e então, é claro, falaremos mais sobre isso.

39
00:01:49,640 --> 00:01:52,220
‫De qualquer forma, vamos aprender como realmente criar

40
00:01:52,220 --> 00:01:53,950
‫e enviar um cookie.

41
00:01:53,950 --> 00:01:57,720
‫Então, para enviar um cookie, é realmente muito fácil.

42
00:01:57,720 --> 00:02:00,380
‫Tudo o que temos a fazer é basicamente anexá-lo

43
00:02:00,380 --> 00:02:02,023
‫ao objeto de resposta.

44
00:02:03,010 --> 00:02:06,910
‫Portanto, dizemos res. cookie e tudo o

45
00:02:06,910 --> 00:02:09,550
‫que temos que fazer é especificar o

46
00:02:09,550 --> 00:02:11,630
‫nome do cookie, e estou chamando-o

47
00:02:11,630 --> 00:02:14,860
‫de token da web JSON, os dados que realmente queremos

48
00:02:14,860 --> 00:02:17,830
‫enviar no cookie e, portanto, é claro que será

49
00:02:17,830 --> 00:02:22,020
‫a variável de token e depois disso, algumas opções para o cookie.

50
00:02:22,020 --> 00:02:24,119
‫E a primeira opção

51
00:02:24,119 --> 00:02:26,810
‫que vamos especificar é a propriedade expires.

52
00:02:26,810 --> 00:02:29,620
‫Ok, então basicamente, essa propriedade expires

53
00:02:29,620 --> 00:02:33,200
‫fará com que o navegador ou o cliente em

54
00:02:33,200 --> 00:02:36,360
‫geral excluam o cookie depois que ele expirar.

55
00:02:36,360 --> 00:02:38,780
‫Ok, então definimos a data

56
00:02:38,780 --> 00:02:43,360
‫de expiração semelhante àquela que definimos no token da web JSON, ok.

57
00:02:43,360 --> 00:02:45,810
‫Então, vamos criar uma nova variável

58
00:02:46,760 --> 00:02:49,390
‫para isso, ok, porque o pacote de tokens

59
00:02:49,390 --> 00:02:51,870
‫da Web JSON pode funcionar com esse formato.

60
00:02:51,870 --> 00:02:55,450
‫Ok, mas em JavaScript, isso não faz sentido e, em vez

61
00:02:55,450 --> 00:02:58,923
‫disso, vamos criar uma variável com um número real.

62
00:02:59,850 --> 00:03:02,053
‫Então vamos chamá-lo de JWT, então

63
00:03:03,090 --> 00:03:03,963
‫cookie,

64
00:03:06,210 --> 00:03:10,740
‫expira em, e ainda o definimos para 90, então 90 dias,

65
00:03:10,740 --> 00:03:12,810
‫mas novamente, sem o D.

66
00:03:12,810 --> 00:03:16,210
‫Ok, agora podemos fazer operações de

67
00:03:16,210 --> 00:03:21,080
‫verdade com ele porque precisaremos convertê-lo para milissegundos, ok.

68
00:03:21,080 --> 00:03:23,540
‫Então, quando esse cookie deve expirar?

69
00:03:23,540 --> 00:03:26,610
‫Deve expirar em uma nova data.

70
00:03:26,610 --> 00:03:28,890
‫Portanto, em JavaScript, ao especificar

71
00:03:28,890 --> 00:03:30,800
‫datas, sempre precisamos dizer

72
00:03:30,800 --> 00:03:35,403
‫nova data e ela deve expirar agora, mais esses 90 dias.

73
00:03:36,820 --> 00:03:39,483
‫Ok, então agora, assim, é claro.

74
00:03:41,470 --> 00:03:43,633
‫E então processe. env,

75
00:03:44,894 --> 00:03:48,280
‫e agora, vamos usar este e simplesmente

76
00:03:49,840 --> 00:03:52,320
‫colocar o cookie lá, ok.

77
00:03:52,320 --> 00:03:55,560
‫Mas agora, é claro, precisamos converter isso para milissegundos.

78
00:03:55,560 --> 00:03:57,410
‫Portanto, temos 90 dias agora.

79
00:03:57,410 --> 00:03:59,910
‫Então, duas horas, são 24 horas.

80
00:03:59,910 --> 00:04:01,770
‫Dois minutos, são 60.

81
00:04:01,770 --> 00:04:04,810
‫Dois segundos, é 60 vezes novamente.

82
00:04:04,810 --> 00:04:08,610
‫E então para milissegundos, vezes mil, certo.

83
00:04:08,610 --> 00:04:10,600
‫E, claro, eu poderia fazer tudo de

84
00:04:10,600 --> 00:04:14,090
‫uma vez, mas isso é apenas para especificar o que exatamente estamos fazendo.

85
00:04:14,090 --> 00:04:15,120
‫Então, para mostrar

86
00:04:15,120 --> 00:04:17,163
‫que estamos realmente convertendo para milissegundos.

87
00:04:18,040 --> 00:04:21,603
‫A próxima opção será a opção segura.

88
00:04:22,610 --> 00:04:24,560
‫E então vamos definir isso

89
00:04:24,560 --> 00:04:27,530
‫como verdadeiro e assim, o cookie será enviado apenas

90
00:04:27,530 --> 00:04:29,140
‫em uma conexão criptografada.

91
00:04:29,140 --> 00:04:32,830
‫Então, basicamente, estamos usando apenas HTTPS.

92
00:04:32,830 --> 00:04:37,030
‫E, finalmente, é aquela opção httpOnly sobre a qual

93
00:04:37,030 --> 00:04:38,593
‫falamos antes.

94
00:04:41,630 --> 00:04:43,740
‫Ok, então definimos este como verdadeiro

95
00:04:43,740 --> 00:04:45,820
‫e isso fará com que

96
00:04:45,820 --> 00:04:50,410
‫o cookie não possa ser acessado ou modificado de nenhuma forma pelo navegador.

97
00:04:50,410 --> 00:04:53,280
‫Ok, então isso é importante para evitar

98
00:04:53,280 --> 00:04:55,900
‫esses ataques de script entre sites.

99
00:04:55,900 --> 00:04:58,110
‫Tudo bem, então tudo o

100
00:04:58,110 --> 00:05:01,340
‫que o navegador fará quando definirmos httpOnly como

101
00:05:01,340 --> 00:05:03,390
‫true é basicamente receber

102
00:05:03,390 --> 00:05:07,180
‫o cookie, armazená-lo e enviá-lo automaticamente junto com cada solicitação.

103
00:05:07,180 --> 00:05:09,180
‫Ok, e é isso mesmo.

104
00:05:09,180 --> 00:05:12,770
‫É assim que basicamente definimos o cookie, digamos

105
00:05:12,770 --> 00:05:14,360
‫esta parte, e enviamos

106
00:05:14,360 --> 00:05:17,510
‫usando res. biscoito.

107
00:05:17,510 --> 00:05:20,850
‫Agora, se quiséssemos testar isso agora, não funcionaria

108
00:05:20,850 --> 00:05:23,990
‫porque, no momento, não estamos usando HTTPS.

109
00:05:23,990 --> 00:05:26,650
‫E assim, por causa deste seguro: verdadeiro,

110
00:05:26,650 --> 00:05:28,130
‫o cookie não

111
00:05:28,130 --> 00:05:30,590
‫seria criado e nem enviado ao cliente.

112
00:05:30,590 --> 00:05:31,920
‫Tudo bem,

113
00:05:31,920 --> 00:05:36,180
‫basicamente, queremos apenas ativar esta parte aqui na produção.

114
00:05:36,180 --> 00:05:38,820
‫Então, o que vou fazer é

115
00:05:38,820 --> 00:05:42,510
‫basicamente exportar todo esse objeto aqui para uma variável separada.

116
00:05:42,510 --> 00:05:44,160
‫Ok, deixe-me mostrar isso para você.

117
00:05:45,550 --> 00:05:46,383
‫Portanto,

118
00:05:47,242 --> 00:05:49,710
‫const cookieOptions deve ser igual

119
00:05:50,780 --> 00:05:54,003
‫a isso e, aqui, passamos isso.

120
00:05:55,440 --> 00:05:56,273
‫Tudo bem.

121
00:05:57,480 --> 00:06:00,300
‫Agora, é claro, não queremos essa parte aqui,

122
00:06:00,300 --> 00:06:03,100
‫mas apenas quando estivermos em produção.

123
00:06:03,100 --> 00:06:04,050
‫Então, digamos

124
00:06:06,830 --> 00:06:11,670
‫que seja o processo. env. NODE_ENV, lembre-se de que é

125
00:06:11,670 --> 00:06:13,500
‫onde está armazenado, se estivermos em

126
00:06:13,500 --> 00:06:15,023
‫produção ou não.

127
00:06:16,130 --> 00:06:17,780
‫Portanto, se isso

128
00:06:20,210 --> 00:06:24,590
‫for igual à produção, defina cookieOptions. seguro igual a

129
00:06:26,490 --> 00:06:27,363
‫verdadeiro.

130
00:06:28,970 --> 00:06:31,533
‫Ok, e agora, podemos removê-lo daqui.

131
00:06:33,600 --> 00:06:36,430
‫Sim, agora, apenas quando estivermos em

132
00:06:36,430 --> 00:06:39,300
‫produção, teremos as opções seguras definidas como verdadeiras.

133
00:06:39,300 --> 00:06:42,150
‫E caso contrário, só será enviado assim,

134
00:06:42,150 --> 00:06:45,470
‫então apenas com a data de vencimento e httpOnly.

135
00:06:45,470 --> 00:06:48,263
‫Ok, vamos agora realmente testar isso.

136
00:06:50,200 --> 00:06:53,153
‫E vou testá-lo criando um novo usuário.

137
00:06:54,940 --> 00:06:56,970
‫Então, aqui no Sign Up, na verdade,

138
00:06:58,600 --> 00:06:59,750
‫vamos chamá-lo de

139
00:07:00,880 --> 00:07:03,180
‫usuário @ jonas. Io.

140
00:07:03,180 --> 00:07:04,733
‫Sempre com a mesma senha.

141
00:07:07,390 --> 00:07:09,100
‫Vou chamá-lo de usuário

142
00:07:09,100 --> 00:07:13,273
‫também e digamos que a função aqui é um guia, então

143
00:07:14,520 --> 00:07:17,823
‫apenas para que tenhamos algumas funções diferentes aqui também.

144
00:07:19,040 --> 00:07:20,360
‫Dê um pouco mais de espaço.

145
00:07:20,360 --> 00:07:22,670
‫E agora, vamos tentar na verdade.

146
00:07:22,670 --> 00:07:25,500
‫E a resposta é a que esperávamos, com

147
00:07:25,500 --> 00:07:26,810
‫a diferença de

148
00:07:26,810 --> 00:07:30,190
‫que agora temos um cookie aqui nesta guia Cookie.

149
00:07:30,190 --> 00:07:32,160
‫E, de fato, aqui

150
00:07:32,160 --> 00:07:35,450
‫temos o nome do cookie, o valor.

151
00:07:35,450 --> 00:07:37,220
‫Também temos a data de

152
00:07:37,220 --> 00:07:40,160
‫validade, que é exatamente 90 dias a partir de agora.

153
00:07:40,160 --> 00:07:44,913
‫Definimos httpOnly como true e, também, secure definido como false.

154
00:07:45,970 --> 00:07:47,210
‫Tudo bem.

155
00:07:47,210 --> 00:07:49,970
‫Ótimo, também podemos ver todos os cookies que

156
00:07:49,970 --> 00:07:51,733
‫temos aqui nesta guia Cookie.

157
00:07:52,690 --> 00:07:55,480
‫E então, novamente, vemos aquele cookie que

158
00:07:55,480 --> 00:07:57,673
‫recebemos deste domínio, certo.

159
00:07:58,630 --> 00:08:01,540
‫Agora, apenas uma última coisa que eu

160
00:08:01,540 --> 00:08:04,130
‫realmente quero mudar nessa função na qual

161
00:08:04,130 --> 00:08:05,313
‫estamos trabalhando,

162
00:08:06,200 --> 00:08:10,660
‫então o createSendToken, é basicamente me livrar dessa senha aqui na saída.

163
00:08:10,660 --> 00:08:13,560
‫Ok, então em nosso esquema, nós o temos

164
00:08:13,560 --> 00:08:16,510
‫definido para selecionar falso, para que ele não apareça

165
00:08:16,510 --> 00:08:18,380
‫quando consultarmos todos os usuários.

166
00:08:18,380 --> 00:08:21,290
‫Mas, neste caso, vem da criação de um novo documento

167
00:08:21,290 --> 00:08:24,410
‫e isso é diferente e é por isso que o vemos aqui.

168
00:08:24,410 --> 00:08:27,373
‫Ok, mas podemos consertar isso muito facilmente.

169
00:08:28,650 --> 00:08:31,850
‫Ok, então tudo o que precisamos fazer é definir o

170
00:08:33,660 --> 00:08:35,010
‫usuário. senha

171
00:08:36,370 --> 00:08:37,563
‫para indefinido.

172
00:08:38,750 --> 00:08:40,590
‫Tudo bem, e

173
00:08:42,630 --> 00:08:43,920
‫isso deve

174
00:08:46,340 --> 00:08:48,490
‫remover as senhas da saída.

175
00:08:48,490 --> 00:08:49,630
‫OK.

176
00:08:49,630 --> 00:08:53,203
‫Então, vamos deletar este usuário que acabamos de criar.

177
00:08:57,890 --> 00:08:59,850
‫E tente novamente

178
00:08:59,850 --> 00:09:04,010
‫para ver se a senha não aparece mais.

179
00:09:04,010 --> 00:09:07,170
‫E sim, de fato agora, ele se foi.

180
00:09:07,170 --> 00:09:09,820
‫E ainda, nosso cookie, é claro, está aqui.

181
00:09:09,820 --> 00:09:12,450
‫E quando chegamos aqui à nossa guia Cookies, bem,

182
00:09:12,450 --> 00:09:14,710
‫então você ainda tem apenas um cookie

183
00:09:14,710 --> 00:09:17,430
‫porque o antigo agora foi basicamente substituído por este novo

184
00:09:17,430 --> 00:09:18,600
‫e isso é

185
00:09:18,600 --> 00:09:20,380
‫porque eles têm o mesmo nome.

186
00:09:20,380 --> 00:09:23,940
‫Portanto, o nome é como o identificador exclusivo de um cookie.

187
00:09:23,940 --> 00:09:26,160
‫E então, se recebermos um com o

188
00:09:26,160 --> 00:09:27,570
‫nome que já

189
00:09:27,570 --> 00:09:30,683
‫foi dado, bem, então o antigo é simplesmente substituído.

190
00:09:31,720 --> 00:09:33,800
‫Ok, e é isso mesmo.

191
00:09:33,800 --> 00:09:36,737
‫Então é assim que enviamos um cookie somente HTTP

192
00:09:36,737 --> 00:09:38,730
‫e, novamente, falaremos mais sobre

193
00:09:38,730 --> 00:09:40,813
‫isso quando construirmos nosso site dinâmico.