1
00:00:00,890 --> 00:00:02,400
‫Palestrante: Olá.

2
00:00:02,400 --> 00:00:06,663
‫Vamos agora renderizar algumas páginas de erro interessantes para nossos usuários.

3
00:00:08,210 --> 00:00:11,723
‫E então, para começar, vamos criar um erro primeiro.

4
00:00:13,100 --> 00:00:15,033
‫Então, vamos abrir este tour aqui.

5
00:00:16,350 --> 00:00:18,293
‫Não, eu não quero traduzir.

6
00:00:19,440 --> 00:00:23,640
‫E agora vamos simplesmente adicionar algo a este log aqui, e

7
00:00:23,640 --> 00:00:26,563
‫então, é claro, isso não será encontrado.

8
00:00:27,800 --> 00:00:31,140
‫Certo, então é assim que um erro se parece

9
00:00:31,140 --> 00:00:32,330
‫neste ponto.

10
00:00:32,330 --> 00:00:34,510
‫Então, simplesmente, tudo isso

11
00:00:34,510 --> 00:00:37,440
‫JSON aqui, assim como seria no Postman.

12
00:00:37,440 --> 00:00:40,110
‫Portanto, já vimos esse tipo de erro aqui antes.

13
00:00:40,110 --> 00:00:42,740
‫E então, vamos corrigir isso agora.

14
00:00:42,740 --> 00:00:46,230
‫Mas primeiro precisamos corrigir esse erro específico.

15
00:00:46,230 --> 00:00:48,150
‫Portanto, agora chegamos,

16
00:00:48,150 --> 00:00:53,150
‫não é possível ler o nome da propriedade null em getTour.

17
00:00:53,530 --> 00:00:54,600
‫OK.

18
00:00:54,600 --> 00:00:59,530
‫E isso está aqui em nosso controlador de visualizações, getTour.

19
00:00:59,530 --> 00:01:02,120
‫E então aqui, não temos nenhum

20
00:01:02,120 --> 00:01:05,260
‫tratamento de erros caso não haja um tour, certo?

21
00:01:05,260 --> 00:01:08,060
‫Portanto, temos isso em todos os nossos outros gerenciadores

22
00:01:08,060 --> 00:01:10,470
‫de rota, mas, neste, ainda não temos.

23
00:01:10,470 --> 00:01:11,513
‫Então, vamos adicionar isso.

24
00:01:12,570 --> 00:01:17,570
‫Portanto, se não houver um tour, volte e vá para

25
00:01:18,910 --> 00:01:23,910
‫o próximo middleware com um novo erro de aplicativo.

26
00:01:25,020 --> 00:01:28,090
‫E provavelmente ainda não está aqui.

27
00:01:28,090 --> 00:01:29,483
‫E não, de fato, não é.

28
00:01:31,290 --> 00:01:32,123
‫Então const.

29
00:01:34,904 --> 00:01:36,363
‫AppError é igual a.

30
00:01:44,880 --> 00:01:46,220
‫Tudo bem.

31
00:01:46,220 --> 00:01:48,280
‫Erro aqui, é claro.

32
00:01:48,280 --> 00:01:49,480
‫E então vamos dizer

33
00:01:53,720 --> 00:01:55,633
‫que não há turnê com esse nome.

34
00:01:57,420 --> 00:02:01,090
‫E então é um 404 para não encontrado.

35
00:02:01,090 --> 00:02:02,400
‫OK?

36
00:02:02,400 --> 00:02:04,300
‫Então, vamos tentar de novo.

37
00:02:04,300 --> 00:02:07,690
‫E agora devemos obter um erro muito melhor.

38
00:02:07,690 --> 00:02:09,490
‫E, de fato, temos um.

39
00:02:09,490 --> 00:02:11,135
‫Então, 404.

40
00:02:11,135 --> 00:02:14,800
‫E lembre-se de que este agora é um erro operacional.

41
00:02:14,800 --> 00:02:18,570
‫Portanto, um erro que sabemos que basicamente criamos a nós mesmos.

42
00:02:18,570 --> 00:02:21,910
‫E, assim como antes, isso será importante para nossa

43
00:02:21,910 --> 00:02:23,870
‫estratégia de tratamento de erros.

44
00:02:23,870 --> 00:02:27,240
‫Então, vamos realmente falar sobre isso.

45
00:02:27,240 --> 00:02:30,010
‫E aqui terminamos.

46
00:02:30,010 --> 00:02:32,283
‫E agora em nosso controlador de

47
00:02:33,500 --> 00:02:37,130
‫erro, temos, lembre-se, duas funções que enviam os erros

48
00:02:37,130 --> 00:02:39,070
‫de volta ao cliente.

49
00:02:39,070 --> 00:02:41,280
‫Portanto, temos este aqui para desenvolvimento

50
00:02:41,280 --> 00:02:43,370
‫e este para produção.

51
00:02:43,370 --> 00:02:45,650
‫Em seguida, na produção,

52
00:02:45,650 --> 00:02:49,730
‫distinguimos entre erros operacionais e outros erros desconhecidos.

53
00:02:49,730 --> 00:02:50,563
‫Direito?

54
00:02:50,563 --> 00:02:53,190
‫E isso é realmente o que acabamos de falar antes.

55
00:02:53,190 --> 00:02:54,690
‫Portanto, para os erros que

56
00:02:54,690 --> 00:02:57,470
‫conhecemos, enviamos de volta a mensagem de erro real porque

57
00:02:57,470 --> 00:02:59,780
‫podemos ter certeza de que não será algum

58
00:02:59,780 --> 00:03:01,130
‫erro de aparência

59
00:03:01,130 --> 00:03:03,520
‫estranha vindo de algum lugar do expresso ou

60
00:03:03,520 --> 00:03:04,910
‫nota ou algo parecido.

61
00:03:04,910 --> 00:03:08,180
‫Enquanto, por outro lado, quando é um erro desconhecido, bem,

62
00:03:08,180 --> 00:03:11,410
‫então não queremos vazar os detalhes do erro.

63
00:03:11,410 --> 00:03:13,880
‫E agora, neste caso, com

64
00:03:13,880 --> 00:03:16,433
‫o site renderizado, usaremos a mesma estratégia.

65
00:03:17,460 --> 00:03:18,950
‫Agora, o que vou

66
00:03:18,950 --> 00:03:21,960
‫fazer é simplesmente adicionar a renderização de uma página de

67
00:03:21,960 --> 00:03:23,900
‫erro a cada uma dessas funções.

68
00:03:23,900 --> 00:03:26,450
‫E basicamente, o que vou fazer

69
00:03:26,450 --> 00:03:29,750
‫é testar se a URL começa com API de barra.

70
00:03:29,750 --> 00:03:33,930
‫E então nesse caso, enviamos esse tipo de erro, certo.

71
00:03:33,930 --> 00:03:38,500
‫Mas se a URL não começar com API, bem, nesse caso,

72
00:03:38,500 --> 00:03:41,340
‫significa que queremos renderizar uma página de

73
00:03:41,340 --> 00:03:44,030
‫erro como um site renderizado, certo?

74
00:03:44,030 --> 00:03:46,823
‫Assim como estivemos fazendo nesta seção.

75
00:03:47,920 --> 00:03:50,520
‫De qualquer forma, vamos implementar isso agora.

76
00:03:50,520 --> 00:03:55,520
‫E assim, podemos usar a URL original do ponto de solicitação.

77
00:03:55,570 --> 00:03:58,133
‫E provavelmente já usamos isso antes.

78
00:04:00,000 --> 00:04:00,840
‫Tudo bem?

79
00:04:00,840 --> 00:04:04,690
‫Portanto, o URL original é basicamente o URL inteiro, mas não

80
00:04:04,690 --> 00:04:06,180
‫com o host.

81
00:04:06,180 --> 00:04:08,990
‫Então parece exatamente como a rota.

82
00:04:08,990 --> 00:04:12,050
‫E então, novamente, quando estamos acessando nosso URL,

83
00:04:12,050 --> 00:04:15,640
‫bem, então essa rota começa com a API de barra.

84
00:04:15,640 --> 00:04:17,440
‫E agora podemos testar isso.

85
00:04:17,440 --> 00:04:20,710
‫Portanto, podemos usar uma função JavaScript chamada startsWith.

86
00:04:24,310 --> 00:04:26,873
‫Portanto, uma função que está disponível para strings.

87
00:04:27,860 --> 00:04:30,973
‫E então teste se ele começa com a API slash.

88
00:04:32,530 --> 00:04:33,363
‫Direito?

89
00:04:33,363 --> 00:04:36,853
‫E se isso acontecer, é isso que queremos fazer.

90
00:04:38,630 --> 00:04:41,163
‫Portanto, basta enviar o erro como JSON.

91
00:04:42,570 --> 00:04:46,943
‫Mas se não, bem, então realmente queremos processar um erro.

92
00:04:49,320 --> 00:04:52,103
‫Portanto, ainda está res. status.

93
00:04:54,530 --> 00:04:56,177
‫E para statusCode também.

94
00:04:56,177 --> 00:04:59,483
‫Mas aqui é realmente renderizado.

95
00:05:00,430 --> 00:05:02,480
‫Em seguida, obtemos o nome do

96
00:05:02,480 --> 00:05:05,290
‫modelo e vamos criá-lo em um segundo, mas

97
00:05:05,290 --> 00:05:07,263
‫ele se chamará erro.

98
00:05:08,230 --> 00:05:10,810
‫E então os dados que queremos enviar são,

99
00:05:10,810 --> 00:05:12,970
‫por enquanto, apenas o título.

100
00:05:12,970 --> 00:05:14,430
‫E vou adicionar mais algumas

101
00:05:14,430 --> 00:05:16,223
‫coisas, quando o modelo estiver realmente pronto.

102
00:05:18,350 --> 00:05:22,900
‫Portanto, algo deu errado será o título desta

103
00:05:22,900 --> 00:05:25,323
‫página de erro.

104
00:05:26,490 --> 00:05:27,750
‫Tudo bem?

105
00:05:27,750 --> 00:05:29,570
‫Oh, na verdade não temos

106
00:05:29,570 --> 00:05:31,630
‫acesso à variável de solicitação aqui.

107
00:05:31,630 --> 00:05:33,480
‫E sua função.

108
00:05:33,480 --> 00:05:35,173
‫E então vamos adicionar isso.

109
00:05:36,790 --> 00:05:38,160
‫Solicite aqui.

110
00:05:38,160 --> 00:05:40,270
‫E também vamos precisar disso aqui.

111
00:05:40,270 --> 00:05:41,103
‫Este.

112
00:05:42,790 --> 00:05:45,010
‫E então vamos adicionar isso aqui também.

113
00:05:45,010 --> 00:05:47,193
‫Bem aqui.

114
00:05:53,723 --> 00:05:54,853
‫OK.

115
00:05:55,690 --> 00:05:59,180
‫Então, agora precisamos criar essa página, ou esse

116
00:05:59,180 --> 00:06:01,400
‫modelo, chamado de erro.

117
00:06:01,400 --> 00:06:04,683
‫E mais uma vez, já tenho um template simples para isso.

118
00:06:06,110 --> 00:06:11,030
‫Portanto, está em dev-data, templates e errorTemplate.

119
00:06:12,830 --> 00:06:14,110
‫OK?

120
00:06:14,110 --> 00:06:15,513
‫Então, vamos copiar isso.

121
00:06:17,370 --> 00:06:19,493
‫Em seguida, crie uma visualização para isso.

122
00:06:21,190 --> 00:06:22,253
‫erro. pug.

123
00:06:24,010 --> 00:06:24,843
‫OK.

124
00:06:24,843 --> 00:06:28,080
‫E aqui temos um h2 simples que diz, uh

125
00:06:28,080 --> 00:06:29,800
‫oh, algo deu errado.

126
00:06:29,800 --> 00:06:32,540
‫Então (risos) alguns emojis divertidos lá.

127
00:06:32,540 --> 00:06:34,100
‫Eles não são realmente divertidos.

128
00:06:34,100 --> 00:06:38,400
‫E aqui também queremos ser capazes de passar uma mensagem.

129
00:06:38,400 --> 00:06:39,750
‫Tudo bem?

130
00:06:39,750 --> 00:06:44,750
‫Então, vamos adicionar isso igual a msg, apenas uma abreviação para mensagem.

131
00:06:46,320 --> 00:06:47,530
‫Tudo bem?

132
00:06:47,530 --> 00:06:48,963
‫E é isso mesmo.

133
00:06:49,940 --> 00:06:54,940
‫Então, vamos fechar isso e passar essa mensagem.

134
00:06:55,810 --> 00:06:58,640
‫Então msg está definido.

135
00:06:58,640 --> 00:07:02,403
‫E vamos realmente configurá-lo para mensagem de ponto de erro.

136
00:07:03,700 --> 00:07:04,533
‫OK?

137
00:07:04,533 --> 00:07:07,260
‫E estamos fazendo aqui porque estamos em desenvolvimento.

138
00:07:07,260 --> 00:07:08,423
‫Portanto, mantenha isso em mente.

139
00:07:09,760 --> 00:07:11,460
‫Vamos também adicionar alguns comentários aqui.

140
00:07:13,402 --> 00:07:14,235
‫API.

141
00:07:18,360 --> 00:07:19,593
‫Vamos colocar isso aqui.

142
00:07:24,740 --> 00:07:26,570
‫O site renderizado.

143
00:07:26,570 --> 00:07:29,890
‫Então estamos fazendo assim, com mensagem de erro, novamente

144
00:07:29,890 --> 00:07:31,530
‫porque no desenvolvimento,

145
00:07:31,530 --> 00:07:34,970
‫realmente não importa se vazarmos todos os detalhes do

146
00:07:34,970 --> 00:07:36,660
‫erro para nossa página, certo?

147
00:07:36,660 --> 00:07:39,920
‫Porque ninguém vai realmente ver, já que, sim,

148
00:07:39,920 --> 00:07:41,310
‫estamos em desenvolvimento.

149
00:07:41,310 --> 00:07:44,323
‫Então, isso deve estar funcionando agora.

150
00:07:45,330 --> 00:07:48,793
‫Portanto, tudo o que precisamos fazer agora é recarregar esta página.

151
00:07:51,950 --> 00:07:54,030
‫Mas agora algo está errado aqui.

152
00:07:54,030 --> 00:07:57,470
‫Portanto, ele diz que não enviou nenhum dado.

153
00:07:57,470 --> 00:07:58,633
‫Então, vamos voltar aqui.

154
00:07:59,470 --> 00:08:01,713
‫Bem, como primeiro problema que estou

155
00:08:02,650 --> 00:08:06,620
‫vendo aqui, devo ter o código de status e não apenas o status.

156
00:08:06,620 --> 00:08:08,870
‫Isso é tudo para verificar se há algum erro aqui.

157
00:08:08,870 --> 00:08:09,910
‫Oh sim.

158
00:08:09,910 --> 00:08:11,413
‫Na verdade, existem erros.

159
00:08:12,770 --> 00:08:16,203
‫Então, na verdade, era o código de status inválido.

160
00:08:17,770 --> 00:08:19,113
‫Portanto, aqui deve estar o código.

161
00:08:20,170 --> 00:08:21,723
‫Vamos dar outra defesa.

162
00:08:23,170 --> 00:08:24,590
‫Recarregue-o.

163
00:08:24,590 --> 00:08:28,000
‫E agora temos alguma página de erro aqui.

164
00:08:28,000 --> 00:08:29,830
‫Bem, não está realmente formatado.

165
00:08:29,830 --> 00:08:32,830
‫Mas ainda assim, ele tem o título e,

166
00:08:32,830 --> 00:08:36,180
‫mais importante, tem essa mensagem que acabamos de transmitir.

167
00:08:36,180 --> 00:08:38,600
‫Portanto, não há turnê com esse nome.

168
00:08:38,600 --> 00:08:43,600
‫E isso vem exatamente do nosso controlador de visualizações.

169
00:08:43,760 --> 00:08:45,340
‫Então, direto daqui.

170
00:08:45,340 --> 00:08:48,720
‫Portanto, lembre-se da lógica em que criamos um erro aqui, que

171
00:08:48,720 --> 00:08:50,920
‫é então passado para o nosso erro

172
00:08:50,920 --> 00:08:52,393
‫global e middleware Lint.

173
00:08:53,340 --> 00:08:54,173
‫Direito?

174
00:08:54,173 --> 00:08:56,760
‫E é isso que vai pegar

175
00:08:56,760 --> 00:08:59,700
‫esses erros e enviá-los para o cliente.

176
00:08:59,700 --> 00:09:02,300
‫Agora, em nosso caso, recebemos esse

177
00:09:02,300 --> 00:09:05,760
‫erro porque aqui em nosso modelo, ainda esquecemos

178
00:09:05,760 --> 00:09:07,770
‫de fazer algo.

179
00:09:07,770 --> 00:09:11,660
‫O que é simplesmente estender, é claro, nosso modelo principal.

180
00:09:11,660 --> 00:09:12,810
‫Direito?

181
00:09:12,810 --> 00:09:17,810
‫Portanto, precisamos dizer extend to base template.

182
00:09:19,690 --> 00:09:22,323
‫E então, como sempre, crie esse bloco aqui.

183
00:09:23,300 --> 00:09:26,040
‫Portanto, bloqueie o conteúdo.

184
00:09:26,040 --> 00:09:29,200
‫E então tudo isso precisa estar lá.

185
00:09:29,200 --> 00:09:31,080
‫E basicamente aqui estamos fazendo

186
00:09:31,080 --> 00:09:35,070
‫exatamente a mesma coisa que fizemos em todos os outros modelos.

187
00:09:35,070 --> 00:09:37,430
‫Então, basicamente injetando esse conteúdo

188
00:09:37,430 --> 00:09:40,693
‫aqui no blog de conteúdo no modelo base.

189
00:09:42,370 --> 00:09:47,370
‫Portanto, se recarregarmos agora, ele finalmente terá a aparência desejada.

190
00:09:48,090 --> 00:09:48,923
‫Tudo bem?

191
00:09:49,870 --> 00:09:53,670
‫E agora, se realmente tivemos algum erro em nosso código, e

192
00:09:53,670 --> 00:09:56,290
‫então vamos dizer novamente que não

193
00:09:56,290 --> 00:09:59,210
‫temos esse tratamento de erro aqui, então é

194
00:09:59,210 --> 00:10:02,713
‫claro que todo o erro vazou para o cliente.

195
00:10:06,520 --> 00:10:09,410
‫Portanto, não é possível ler o nome da propriedade de null.

196
00:10:09,410 --> 00:10:12,140
‫E, claro, não queremos que os visitantes do nosso

197
00:10:12,140 --> 00:10:14,630
‫site recebam esse tipo de erro, certo?

198
00:10:14,630 --> 00:10:17,040
‫Ninguém entenderia realmente o que isso significa.

199
00:10:17,040 --> 00:10:20,520
‫E então, em nosso manipulador de erros de produção,

200
00:10:20,520 --> 00:10:22,570
‫vamos cuidar disso agora.

201
00:10:22,570 --> 00:10:25,300
‫Então, aqui em nosso controlador de erro,

202
00:10:25,300 --> 00:10:28,770
‫agora vamos aplicar a mesma lógica que temos aqui.

203
00:10:28,770 --> 00:10:32,840
‫Portanto, testando se estamos lidando com a API ou não.

204
00:10:32,840 --> 00:10:35,370
‫E, claro, pode haver maneiras mais elegantes de

205
00:10:35,370 --> 00:10:36,380
‫fazer isso.

206
00:10:36,380 --> 00:10:38,820
‫Por exemplo, você poderia ter um middleware

207
00:10:38,820 --> 00:10:41,450
‫de tratamento de erros completamente separado apenas para a

208
00:10:41,450 --> 00:10:44,020
‫API e um para o site renderizado, certo?

209
00:10:44,020 --> 00:10:47,763
‫Mas, novamente, eu só quero mantê-lo um tanto simples aqui.

210
00:10:49,160 --> 00:10:49,993
‫OK?

211
00:10:49,993 --> 00:10:52,283
‫Nesse caso, esse é realmente meu objetivo principal.

212
00:10:53,570 --> 00:10:54,600
‫Tudo bem.

213
00:10:54,600 --> 00:10:56,750
‫Vamos selecionar tudo isso.

214
00:10:56,750 --> 00:10:57,950
‫Oh, o que aconteceu ai?

215
00:11:04,880 --> 00:11:05,783
‫Ah, aqui vamos nós.

216
00:11:07,628 --> 00:11:08,461
‫OK.

217
00:11:08,461 --> 00:11:09,773
‫Então, isso é para a API.

218
00:11:12,490 --> 00:11:15,140
‫E agora teremos algo muito semelhante.

219
00:11:25,280 --> 00:11:27,883
‫Portanto, este é, novamente, para o site renderizado.

220
00:11:30,950 --> 00:11:35,950
‫Vamos chamá-lo de B aqui e A neste caso.

221
00:11:36,380 --> 00:11:38,790
‫Então, só para separar um pouco melhor.

222
00:11:38,790 --> 00:11:40,873
‫Então nós temos e B aqui embaixo.

223
00:11:42,600 --> 00:11:45,513
‫De qualquer forma, isso será um pouco parecido com este.

224
00:11:46,700 --> 00:11:51,433
‫E se tivermos um erro operacional, basicamente a página

225
00:11:52,940 --> 00:11:54,470
‫de erro

226
00:11:54,470 --> 00:11:57,470
‫deve ser semelhante à anterior.

227
00:11:57,470 --> 00:12:01,640
‫Mas no caso de ser um erro de programação

228
00:12:01,640 --> 00:12:05,950
‫ou desconhecido, então não queremos a mensagem completa, mas

229
00:12:05,950 --> 00:12:08,640
‫apenas uma mensagem muito genérica.

230
00:12:08,640 --> 00:12:13,640
‫Então, algo como, por favor, tente novamente mais tarde.

231
00:12:14,490 --> 00:12:15,660
‫Tudo bem?

232
00:12:15,660 --> 00:12:18,770
‫Agora vamos ver que tipo de erro obtemos aqui.

233
00:12:18,770 --> 00:12:21,350
‫E, aparentemente, temos algo chamado de

234
00:12:21,350 --> 00:12:23,380
‫declaração if solitária aqui.

235
00:12:23,380 --> 00:12:24,213
‫Direito.

236
00:12:24,213 --> 00:12:25,900
‫Então, sim, o Lint realmente

237
00:12:25,900 --> 00:12:29,000
‫não quer que tenhamos apenas um if dentro de um bloco else.

238
00:12:29,000 --> 00:12:31,580
‫E eu concordo que não

239
00:12:31,580 --> 00:12:34,280
‫é uma prática de codificação bonita.

240
00:12:34,280 --> 00:12:36,280
‫E então, de fato, vamos consertar

241
00:12:37,500 --> 00:12:39,483
‫isso nos livrando disso aqui.

242
00:12:41,600 --> 00:12:42,740
‫Dê uma chance.

243
00:12:42,740 --> 00:12:44,540
‫E então esse erro desaparece.

244
00:12:44,540 --> 00:12:47,530
‫Mas agora precisamos ter certeza de que isso aqui

245
00:12:47,530 --> 00:12:50,230
‫realmente encerra o ciclo de resposta da solicitação.

246
00:12:50,230 --> 00:12:54,843
‫E então precisamos voltar aqui e aqui também.

247
00:12:56,240 --> 00:12:57,580
‫Tudo bem.

248
00:12:57,580 --> 00:13:02,150
‫Agora, outro erro ESLint, desnecessário depois de um retorno.

249
00:13:02,150 --> 00:13:04,090
‫E, de fato, isso também é verdade.

250
00:13:04,090 --> 00:13:05,760
‫E, na verdade, tenho seguido essa

251
00:13:05,760 --> 00:13:08,330
‫regra ao longo do curso porque gosto dela como

252
00:13:08,330 --> 00:13:09,453
‫prática de codificação.

253
00:13:10,360 --> 00:13:13,723
‫E então, sim, vamos nos livrar disso aqui então.

254
00:13:15,000 --> 00:13:18,080
‫Eu realmente acredito, e tenho acreditado por muito tempo,

255
00:13:18,080 --> 00:13:22,050
‫que parece muito melhor sem essas declarações if else, mas em vez

256
00:13:22,050 --> 00:13:25,660
‫disso, apenas com um if, como este aqui e, em

257
00:13:25,660 --> 00:13:28,253
‫seguida, incluir o else fora disso.

258
00:13:29,240 --> 00:13:31,300
‫Ok, é isso que temos aqui agora.

259
00:13:31,300 --> 00:13:33,373
‫Vamos também colocar A e B aqui.

260
00:13:34,240 --> 00:13:35,073
‫B.

261
00:13:36,020 --> 00:13:38,613
‫E, de fato, vamos fazer exatamente a mesma coisa aqui.

262
00:13:39,930 --> 00:13:41,033
‫Então volte.

263
00:13:44,820 --> 00:13:46,513
‫Devolva este também.

264
00:13:52,160 --> 00:13:53,653
‫Então aqui, A e B também.

265
00:13:57,150 --> 00:14:00,540
‫Então, isso de fato parece mais limpo para mim.

266
00:14:00,540 --> 00:14:02,450
‫Agora temos A aqui e A

267
00:14:02,450 --> 00:14:04,733
‫aqui novamente, mas, bem, não importa neste ponto.

268
00:14:05,570 --> 00:14:06,403
‫Tudo bem.

269
00:14:07,320 --> 00:14:08,993
‫Então volte aqui.

270
00:14:11,260 --> 00:14:12,190
‫Volte aqui.

271
00:14:12,190 --> 00:14:15,863
‫E antes que grite comigo, vamos remover isso.

272
00:14:17,630 --> 00:14:19,773
‫E assim está melhor de novo.

273
00:14:23,120 --> 00:14:24,833
‫Então coloque isso aqui.

274
00:14:25,770 --> 00:14:28,950
‫E deve ser isso.

275
00:14:28,950 --> 00:14:29,840
‫Tudo bem?

276
00:14:29,840 --> 00:14:31,950
‫Vamos apenas por uma

277
00:14:31,950 --> 00:14:35,660
‫questão de integridade copiar este comentário aqui também.

278
00:14:35,660 --> 00:14:39,333
‫E então chame este de B novamente.

279
00:14:41,160 --> 00:14:42,520
‫Tudo bem.

280
00:14:42,520 --> 00:14:43,353
‫Perfeito.

281
00:14:44,720 --> 00:14:46,910
‫Na verdade, vamos copiar este aqui também

282
00:14:46,910 --> 00:14:48,603
‫para a função de desenvolvimento.

283
00:14:49,770 --> 00:14:52,500
‫Porque agora, uma vez que enviarmos de volta

284
00:14:52,500 --> 00:14:55,723
‫aquele erro, realmente não temos como ver o erro completo.

285
00:14:58,460 --> 00:15:02,930
‫Tudo bem, então, se livrar disso para torná-lo mais visível.

286
00:15:02,930 --> 00:15:04,483
‫E agora isso é lindo.

287
00:15:05,740 --> 00:15:06,900
‫OK.

288
00:15:06,900 --> 00:15:08,800
‫Então, vamos encerrar aqui

289
00:15:08,800 --> 00:15:12,300
‫agora para que possamos iniciar nosso aplicativo de produção.

290
00:15:12,300 --> 00:15:15,670
‫Basicamente, agora em produção.

291
00:15:15,670 --> 00:15:18,500
‫E temos um script

292
00:15:19,800 --> 00:15:23,970
‫para isso chamado npm run start production.

293
00:15:27,220 --> 00:15:28,560
‫OK?

294
00:15:28,560 --> 00:15:31,100
‫Então, se testarmos isso agora,

295
00:15:31,100 --> 00:15:34,430
‫não devemos mais ver essa string aqui, lembra?

296
00:15:34,430 --> 00:15:37,090
‫Porque, neste ponto, não temos nenhum tratamento de erros

297
00:15:37,090 --> 00:15:39,610
‫para um nome de tour inválido como este.

298
00:15:39,610 --> 00:15:40,637
‫OK?

299
00:15:40,637 --> 00:15:41,470
‫Direito?

300
00:15:41,470 --> 00:15:42,303
‫Já que

301
00:15:42,303 --> 00:15:44,220
‫estamos em produção e não é um

302
00:15:44,220 --> 00:15:46,127
‫erro operacional, bem, não queremos ver isso.

303
00:15:46,127 --> 00:15:49,400
‫E isso é o que acabamos de codificar antes.

304
00:15:49,400 --> 00:15:53,030
‫E, de fato, esta é a mensagem de erro mais genérica.

305
00:15:53,030 --> 00:15:54,070
‫Direito?

306
00:15:54,070 --> 00:15:59,070
‫Mas se colocarmos de volta aqui no controlador de visualizações, se colocarmos esse

307
00:16:00,800 --> 00:16:03,170
‫tratamento de erro de volta, então

308
00:16:03,170 --> 00:16:06,150
‫é claro, já que isso aqui agora

309
00:16:06,150 --> 00:16:09,830
‫será um erro operacional, então, é claro, obteremos aquela

310
00:16:09,830 --> 00:16:11,460
‫string de erro.

311
00:16:11,460 --> 00:16:12,930
‫Porque é sempre

312
00:16:12,930 --> 00:16:15,400
‫bom mostrar uma mensagem amigável ao usuário.

313
00:16:15,400 --> 00:16:18,453
‫Mas, como você viu, isso realmente não aconteceu.

314
00:16:19,540 --> 00:16:22,383
‫Então, por que isso?

315
00:16:25,140 --> 00:16:28,450
‫Bem, estamos no erro de produção.

316
00:16:28,450 --> 00:16:31,070
‫Estamos no site renderizado.

317
00:16:31,070 --> 00:16:34,290
‫E, de fato, temos um erro operacional.

318
00:16:34,290 --> 00:16:35,483
‫E entao ...

319
00:16:39,010 --> 00:16:40,263
‫Nós temos isso no lugar.

320
00:16:41,200 --> 00:16:45,010
‫E, de fato, deve funcionar como esperávamos.

321
00:16:45,010 --> 00:16:47,200
‫Bem, vamos apenas tentar registrar no console a

322
00:16:48,540 --> 00:16:49,880
‫mensagem do ponto de

323
00:16:51,740 --> 00:16:54,573
‫erro apenas para ver se realmente a recebemos neste ponto.

324
00:16:56,140 --> 00:16:57,570
‫Tudo bem.

325
00:16:57,570 --> 00:16:59,480
‫Recarregue esse cara.

326
00:16:59,480 --> 00:17:01,853
‫E aí está o erro.

327
00:17:02,720 --> 00:17:05,170
‫Mesmo assim, isso é muito estranho.

328
00:17:05,170 --> 00:17:07,363
‫Então, isso de fato registrou todo o erro.

329
00:17:15,210 --> 00:17:16,120
‫Muito estranho.

330
00:17:16,120 --> 00:17:20,560
‫Porque, por algum motivo, a mensagem também não está lá.

331
00:17:20,560 --> 00:17:24,363
‫Então, vamos executá-lo novamente no desenvolvimento.

332
00:17:25,968 --> 00:17:26,883
‫Então npm start.

333
00:17:30,120 --> 00:17:30,953
‫Tudo bem.

334
00:17:31,940 --> 00:17:35,460
‫E aqui, por algum motivo, ele obtém acesso a esta mensagem.

335
00:17:35,460 --> 00:17:38,110
‫Isso significa que em nosso controlador de

336
00:17:38,110 --> 00:17:40,553
‫visualizações, configuramos essa mensagem corretamente.

337
00:17:44,410 --> 00:17:45,983
‫Execute-o novamente em produção.

338
00:17:48,080 --> 00:17:52,183
‫Então esse é o tipo de coisa que não gostamos, certo?

339
00:17:54,370 --> 00:17:57,670
‫Então, vamos dar uma olhada onde nosso erro na

340
00:17:57,670 --> 00:17:59,550
‫produção é realmente criado.

341
00:17:59,550 --> 00:18:01,320
‫E isso está aqui.

342
00:18:01,320 --> 00:18:04,720
‫Então, esse objeto de erro que estamos usando aqui

343
00:18:04,720 --> 00:18:08,020
‫na produção é uma cópia desse erro, certo?

344
00:18:08,020 --> 00:18:10,960
‫Então, aquele que está entrando neste middleware.

345
00:18:10,960 --> 00:18:15,960
‫E então vamos dar uma olhada em ambos no

346
00:18:15,960 --> 00:18:17,083
‫console.

347
00:18:18,850 --> 00:18:20,803
‫Portanto, mensagem de ponto de erro.

348
00:18:23,636 --> 00:18:26,303
‫E então também mensagem de ponto de erro.

349
00:18:29,930 --> 00:18:31,203
‫Então faça isso de novo.

350
00:18:34,070 --> 00:18:35,620
‫OK.

351
00:18:35,620 --> 00:18:37,470
‫Portanto, vemos esse erro,

352
00:18:37,470 --> 00:18:40,590
‫aquele que está vindo direto para nossa função de

353
00:18:40,590 --> 00:18:42,630
‫middleware, de fato tem a mensagem.

354
00:18:42,630 --> 00:18:45,730
‫Mas então aquele que copiamos, então erro, por

355
00:18:45,730 --> 00:18:47,380
‫algum motivo não.

356
00:18:47,380 --> 00:18:49,870
‫E então esse truque que a gente tá

357
00:18:49,870 --> 00:18:53,160
‫fazendo aqui, por algum motivo não copia a mensagem com ele,

358
00:18:53,160 --> 00:18:54,130
‫tá bom?

359
00:18:54,130 --> 00:18:57,930
‫E então vamos fazer uma correção rápida disso.

360
00:18:57,930 --> 00:19:02,930
‫E digamos que a mensagem do ponto de erro seja igual à mensagem do ponto de erro.

361
00:19:07,100 --> 00:19:07,933
‫Tudo bem?

362
00:19:07,933 --> 00:19:10,963
‫E então isso deve consertar, espero.

363
00:19:13,210 --> 00:19:14,660
‫Ah, certo.

364
00:19:14,660 --> 00:19:15,653
‫Aqui vamos nós.

365
00:19:16,910 --> 00:19:17,743
‫Direito.

366
00:19:19,430 --> 00:19:22,930
‫Então agora você vê que eles são realmente os mesmos.

367
00:19:22,930 --> 00:19:24,330
‫E esse era o problema.

368
00:19:25,490 --> 00:19:26,330
‫Tudo bem?

369
00:19:26,330 --> 00:19:28,010
‫Portanto, sem isso, na

370
00:19:28,010 --> 00:19:30,543
‫verdade, todos os erros não funcionariam corretamente.

371
00:19:31,610 --> 00:19:33,860
‫Então, se colocarmos isso aqui e tentarmos

372
00:19:33,860 --> 00:19:38,860
‫fazer o login, por exemplo, admin @ natours. Io.

373
00:19:47,490 --> 00:19:50,970
‫Então, você vê, também temos um erro indefinido aqui.

374
00:19:50,970 --> 00:19:51,890
‫Tudo bem.

375
00:19:51,890 --> 00:19:54,630
‫E isso é novamente porque estamos em

376
00:19:54,630 --> 00:19:58,860
‫produção e nosso objeto de erro não copiou corretamente a mensagem.

377
00:19:58,860 --> 00:20:01,400
‫Não tenho certeza por que não entendi

378
00:20:01,400 --> 00:20:03,780
‫quando estávamos realmente implementando isso.

379
00:20:03,780 --> 00:20:07,253
‫Mas talvez eu não o testei de forma completa o suficiente.

380
00:20:08,240 --> 00:20:09,640
‫OK?

381
00:20:09,640 --> 00:20:11,403
‫E, de qualquer forma, se

382
00:20:12,470 --> 00:20:15,320
‫tentarmos isso agora, obteremos a mensagem de erro correta

383
00:20:15,320 --> 00:20:16,370
‫que esperamos.

384
00:20:18,230 --> 00:20:19,300
‫Tudo bem.

385
00:20:19,300 --> 00:20:20,133
‫Excelente.

386
00:20:20,133 --> 00:20:21,360
‫Então está resolvido.

387
00:20:21,360 --> 00:20:24,950
‫E isso realmente encerra este vídeo.

388
00:20:24,950 --> 00:20:26,250
‫Portanto, para

389
00:20:26,250 --> 00:20:28,740
‫concluir, agora temos uma estratégia de

390
00:20:28,740 --> 00:20:33,740
‫tratamento de erros que funciona para o desenvolvimento, como antes, e

391
00:20:34,050 --> 00:20:35,780
‫também para a produção.

392
00:20:35,780 --> 00:20:39,000
‫E então, em cada um deles, temos basicamente dois ramos.

393
00:20:39,000 --> 00:20:41,500
‫Um envia a mensagem de erro para a

394
00:20:41,500 --> 00:20:43,397
‫API, que é exatamente o que

395
00:20:43,397 --> 00:20:46,640
‫tínhamos antes, e agora também temos uma espécie de manipulador

396
00:20:46,640 --> 00:20:48,430
‫para o site renderizado.

397
00:20:48,430 --> 00:20:52,220
‫E então, nesse caso, renderizamos nosso template de erro.

398
00:20:52,220 --> 00:20:54,850
‫Em seguida, na produção, também

399
00:20:54,850 --> 00:20:57,620
‫distinguimos entre website renderizado e API.

400
00:20:57,620 --> 00:20:59,270
‫E então, como

401
00:20:59,270 --> 00:21:01,700
‫antes, dentro de cada uma dessas

402
00:21:01,700 --> 00:21:03,784
‫ramificações, também distinguimos entre os

403
00:21:03,784 --> 00:21:06,293
‫erros de operação e os erros desconhecidos.

404
00:21:07,240 --> 00:21:09,140
‫Tão operacional e desconhecido.

405
00:21:09,140 --> 00:21:13,230
‫E depois renderizado por dentro, também operacional e desconhecido.

406
00:21:13,230 --> 00:21:15,490
‫E então, para o site

407
00:21:15,490 --> 00:21:18,600
‫renderizado, se tivermos um erro operacional, então confiável,

408
00:21:18,600 --> 00:21:21,270
‫então enviamos nossa mensagem de erro confiável.

409
00:21:21,270 --> 00:21:23,590
‫Mas, caso não confiemos no erro,

410
00:21:23,590 --> 00:21:25,150
‫quando não o

411
00:21:25,150 --> 00:21:29,560
‫soubermos, simplesmente enviaremos esta mensagem genérica de volta para o usuário.

412
00:21:29,560 --> 00:21:31,630
‫Tão bom.

413
00:21:31,630 --> 00:21:35,050
‫Vamos parar com isso aqui e voltar ao

414
00:21:35,920 --> 00:21:38,350
‫desenvolvimento e encerrar esta palestra.

415
00:21:38,350 --> 00:21:39,763
‫Então nos vemos no próximo.