1
00:00:01,210 --> 00:00:04,730
‫Jonas: Nesta segunda parte do upload das imagens da

2
00:00:04,730 --> 00:00:06,943
‫turnê, vamos processar todas elas.

3
00:00:08,670 --> 00:00:10,300
‫Mas antes de começarmos

4
00:00:10,300 --> 00:00:12,330
‫a fazer isso, há algo que

5
00:00:12,330 --> 00:00:14,500
‫preciso consertar no controlador do usuário.

6
00:00:14,500 --> 00:00:18,530
‫E então nesse resizeUserPhoto, e é

7
00:00:18,530 --> 00:00:21,110
‫aí que precisamos

8
00:00:21,110 --> 00:00:25,210
‫aguardar toda essa operação aqui, certo?

9
00:00:25,210 --> 00:00:28,940
‫Então, tudo isso aqui vai realmente retornar uma promessa, e

10
00:00:28,940 --> 00:00:30,640
‫isso faz sentido, certo,

11
00:00:30,640 --> 00:00:33,950
‫porque todas essas operações aqui levam algum tempo e,

12
00:00:33,950 --> 00:00:36,460
‫é claro, acontecem em segundo plano.

13
00:00:36,460 --> 00:00:38,390
‫Portanto, eles são códigos assíncronos

14
00:00:38,390 --> 00:00:41,850
‫e, portanto, obviamente, não devem bloquear o loop de eventos.

15
00:00:41,850 --> 00:00:43,940
‫Agora, o problema aqui é

16
00:00:43,940 --> 00:00:46,260
‫que agora estamos chamando esta próxima

17
00:00:46,260 --> 00:00:49,030
‫função aqui, então o próximo middleware, sem realmente

18
00:00:49,030 --> 00:00:51,330
‫esperar que essas operações aqui terminem.

19
00:00:51,330 --> 00:00:53,380
‫E isso não é uma boa ideia.

20
00:00:53,380 --> 00:00:55,653
‫Então, vamos simplesmente usar

21
00:00:56,800 --> 00:01:01,483
‫await aqui e, claro, assíncrono, e todas essas coisas.

22
00:01:02,520 --> 00:01:04,483
‫Então catchAsync aqui.

23
00:01:07,110 --> 00:01:11,020
‫Tudo bem, salve, e isso é muito melhor.

24
00:01:11,020 --> 00:01:12,930
‫E agora vamos fazer algo

25
00:01:12,930 --> 00:01:15,580
‫muito semelhante com as imagens da turnê.

26
00:01:15,580 --> 00:01:18,150
‫E então, na verdade, deixe-me ir em frente e copiar isso.

27
00:01:20,850 --> 00:01:22,540
‫Tudo bem, e

28
00:01:22,540 --> 00:01:26,923
‫embora não vá ser exatamente igual, é bom já ter aqui.

29
00:01:28,760 --> 00:01:31,113
‫Portanto, esta também será uma função assíncrona.

30
00:01:36,440 --> 00:01:39,320
‫Tudo bem, agora como antes, caso não

31
00:01:39,320 --> 00:01:41,740
‫haja nenhuma imagem carregada, então

32
00:01:41,740 --> 00:01:44,390
‫queremos ir direto para o próximo middleware.

33
00:01:45,770 --> 00:01:50,290
‫Portanto, se não houver pedido. arquivos e, na verdade, vou

34
00:01:50,290 --> 00:01:52,620
‫dar um passo adiante, exigindo que

35
00:01:52,620 --> 00:01:55,300
‫haja tanto a capa da imagem quanto

36
00:01:55,300 --> 00:01:56,690
‫as imagens.

37
00:01:56,690 --> 00:01:59,450
‫Basicamente, queremos passar para o próximo middleware, caso

38
00:01:59,450 --> 00:02:02,663
‫não haja solicitação. arquivos. imageCover

39
00:02:06,150 --> 00:02:11,150
‫ou nenhuma solicitação. arquivos. imagens.

40
00:02:15,240 --> 00:02:18,463
‫Então, nesse caso, a seguir.

41
00:02:20,840 --> 00:02:24,003
‫Ok, e agora vamos começar processando a imagem

42
00:02:26,860 --> 00:02:31,420
‫da capa e, em seguida, todas as outras imagens em um

43
00:02:31,420 --> 00:02:32,623
‫loop, basicamente.

44
00:02:34,220 --> 00:02:36,170
‫Portanto, outras imagens.

45
00:02:36,170 --> 00:02:39,550
‫Agora, de onde realmente tiramos a imagem da capa?

46
00:02:39,550 --> 00:02:44,460
‫Bem, lembre-se de como eu disse que está a pedido. arquivos?

47
00:02:44,460 --> 00:02:47,403
‫Não arquivo mais, e então. coverImage ou,

48
00:02:49,080 --> 00:02:50,610
‫na verdade, imageCover.

49
00:02:50,610 --> 00:02:52,653
‫E então lembra como era um array?

50
00:02:53,610 --> 00:02:56,113
‫Então, vamos dar uma olhada nisso mais uma vez.

51
00:02:58,850 --> 00:03:02,170
‫Certo, então tudo isso é pedido. arquivos e,

52
00:03:02,170 --> 00:03:05,161
‫a partir daí, pegamos imageCover, que

53
00:03:05,161 --> 00:03:07,950
‫é um array de um elemento.

54
00:03:07,950 --> 00:03:11,710
‫E agora queremos o elemento número zero, e

55
00:03:11,710 --> 00:03:13,780
‫então. amortecedor.

56
00:03:13,780 --> 00:03:17,120
‫Então, essa coisa de aparência estranha aqui.

57
00:03:17,120 --> 00:03:20,750
‫Então queremos redimensionar para uma proporção de

58
00:03:20,750 --> 00:03:23,710
‫2/3, e a largura será

59
00:03:23,710 --> 00:03:28,090
‫de 2.000 pixels e a altura de 1.333, certo?

60
00:03:28,090 --> 00:03:31,380
‫E então, novamente, essa é uma boa proporção de 3/2,

61
00:03:31,380 --> 00:03:33,750
‫o que é muito comum em imagens.

62
00:03:33,750 --> 00:03:38,687
‫Em seguida, também queremos formatá-lo como JPEG com qualidade de 90% e

63
00:03:38,687 --> 00:03:40,820
‫salvá-lo como um arquivo.

64
00:03:40,820 --> 00:03:43,763
‫Mas desta vez é para imagens /

65
00:03:45,828 --> 00:03:49,230
‫tours, e aqui vamos definir nosso nome de arquivo separadamente.

66
00:03:50,890 --> 00:03:54,480
‫Tudo bem, porque na verdade vamos precisar de novo.

67
00:03:54,480 --> 00:03:56,557
‫Então, imageCoverFilename, e mais

68
00:04:00,330 --> 00:04:04,110
‫uma vez, agora precisamos criar um nome de arquivo exclusivo.

69
00:04:04,110 --> 00:04:08,070
‫Agora é o tour, e vamos colocar novamente o

70
00:04:08,070 --> 00:04:12,380
‫ID do tour aqui, onde antes estava o ID do usuário.

71
00:04:12,380 --> 00:04:16,010
‫E isso está a pedido. params, então lembre-se que

72
00:04:16,010 --> 00:04:17,770
‫este roteiro sempre conterá

73
00:04:17,770 --> 00:04:20,140
‫o ID do passeio, portanto está

74
00:04:20,140 --> 00:04:24,393
‫sob consulta. params. Eu iria.

75
00:04:26,290 --> 00:04:31,290
‫Em seguida, novamente o carimbo de data / hora, Data. agora, digamos que

76
00:04:33,810 --> 00:04:38,060
‫essa é a imagem da capa, ok?

77
00:04:38,060 --> 00:04:40,720
‫E os outros receberão alguns números.

78
00:04:40,720 --> 00:04:44,843
‫E então é claro. JPEG, então vamos usar isso aqui.

79
00:04:45,890 --> 00:04:47,807
‫Então, imageCoverFilename.

80
00:04:49,130 --> 00:04:52,100
‫Ok, e agora como uma última etapa, precisamos

81
00:04:52,100 --> 00:04:53,720
‫tornar possível que nosso

82
00:04:53,720 --> 00:04:55,660
‫gerenciador de tour de atualização

83
00:04:55,660 --> 00:04:59,230
‫pegue o nome do arquivo da capa da imagem para

84
00:04:59,230 --> 00:05:01,680
‫atualizá-lo no documento de tour atual, certo?

85
00:05:01,680 --> 00:05:03,290
‫Portanto, vamos rapidamente dar

86
00:05:03,290 --> 00:05:06,830
‫uma olhada em como o documento é realmente atualizado.

87
00:05:06,830 --> 00:05:08,780
‫E, portanto, estamos usando de

88
00:05:08,780 --> 00:05:11,290
‫forma muito simples essa função de fábrica updateOne.

89
00:05:11,290 --> 00:05:14,430
‫E esse irá simplesmente atualizar todos os dados que

90
00:05:14,430 --> 00:05:17,163
‫estão no corpo para o novo documento.

91
00:05:18,460 --> 00:05:21,670
‫Então, só para provar isso aqui.

92
00:05:21,670 --> 00:05:26,670
‫Portanto, updateOne leva em conta toda a solicitação. corpo, ok?

93
00:05:26,730 --> 00:05:29,920
‫E agora o segredo é colocar esse nome de arquivo

94
00:05:29,920 --> 00:05:34,313
‫de capa de imagem a pedido. corpo, tudo bem?

95
00:05:36,720 --> 00:05:39,760
‫Então, peça. corpo. imagem de capa.

96
00:05:41,840 --> 00:05:45,270
‫Ah, e de novo, é chamado imageCover

97
00:05:45,270 --> 00:05:49,850
‫em vez disso, deve ser igual a imageCoverFilename, ok, faz sentido?

98
00:05:52,350 --> 00:05:54,350
‫E, claro, é chamado de imageCover

99
00:05:54,350 --> 00:05:57,710
‫porque esse é o nome que temos em nossa definição de esquema.

100
00:05:57,710 --> 00:05:59,730
‫E então, quando estiver fazendo a

101
00:05:59,730 --> 00:06:02,280
‫atualização, ele irá combinar este campo no corpo com

102
00:06:02,280 --> 00:06:04,530
‫o campo em nosso banco de dados.

103
00:06:04,530 --> 00:06:06,920
‫E, na verdade, podemos refatorar isso

104
00:06:06,920 --> 00:06:10,950
‫um pouco porque realmente não precisamos desse nome de variável aqui.

105
00:06:10,950 --> 00:06:15,113
‫Portanto, poderíamos simplesmente colocar esse nome de arquivo aqui, bem no corpo.

106
00:06:16,040 --> 00:06:20,260
‫Portanto, coloque-o aqui e, em seguida, use-o aqui imediatamente.

107
00:06:20,260 --> 00:06:23,390
‫Portanto, não precisamos dessa linha de código.

108
00:06:23,390 --> 00:06:27,430
‫Ótimo, e agora antes de passar para as outras imagens, vamos

109
00:06:27,430 --> 00:06:29,940
‫realmente testá-lo com o que já temos

110
00:06:29,940 --> 00:06:30,903
‫neste momento.

111
00:06:31,980 --> 00:06:35,080
‫Então, vamos nos livrar deste console. log, e

112
00:06:35,080 --> 00:06:37,170
‫quando agora fizermos a solicitação,

113
00:06:37,170 --> 00:06:40,100
‫nossa imagem de capa já deve ter

114
00:06:40,100 --> 00:06:43,950
‫sido carregada e colocada no documento do tour, ok?

115
00:06:43,950 --> 00:06:46,870
‫Então, essas outras três imagens aqui é claro que não,

116
00:06:46,870 --> 00:06:48,300
‫mas pelo menos a

117
00:06:48,300 --> 00:06:50,183
‫capa da imagem deve estar funcionando

118
00:06:51,340 --> 00:06:53,253
‫agora, pelo menos se fizemos tudo certo.

119
00:06:54,410 --> 00:06:56,863
‫Então, vamos ver se ele está em algum lugar

120
00:06:57,760 --> 00:06:59,963
‫aqui e as imagens ainda estão vazias, obviamente.

121
00:07:00,970 --> 00:07:05,970
‫Mas agora estou procurando a imagem da capa, então onde está?

122
00:07:06,640 --> 00:07:09,280
‫E aqui está, então imageCover, e isso

123
00:07:09,280 --> 00:07:11,843
‫se parece muito com o nome do

124
00:07:11,843 --> 00:07:13,970
‫arquivo que acabamos de especificar.

125
00:07:13,970 --> 00:07:18,970
‫E vamos tentar recarregar nossa página de todos os passeios aqui, e talvez

126
00:07:21,130 --> 00:07:23,550
‫nosso novo passeio já esteja aqui.

127
00:07:23,550 --> 00:07:28,430
‫Ah, aqui vamos nós, então esse é o novo passeio de mountain bike.

128
00:07:28,430 --> 00:07:32,180
‫E esta aqui é de fato a imagem que acabamos de enviar.

129
00:07:32,180 --> 00:07:34,090
‫Tão bonita.

130
00:07:34,090 --> 00:07:36,300
‫Agora, se tentarmos abrir

131
00:07:36,300 --> 00:07:40,870
‫esta página, então as outras imagens não estão aqui, certo?

132
00:07:40,870 --> 00:07:42,780
‫Então, eles não estão em lugar

133
00:07:42,780 --> 00:07:45,513
‫nenhum, então é claro que vamos fazer a seguir.

134
00:07:47,520 --> 00:07:48,353
‫Tudo bem.

135
00:07:50,340 --> 00:07:52,820
‫Portanto, lembre-se de que nossas

136
00:07:52,820 --> 00:07:55,700
‫imagens aqui também são uma matriz,

137
00:07:55,700 --> 00:07:59,360
‫que contém todos esses novos uploads de arquivo.

138
00:07:59,360 --> 00:08:01,500
‫E agora vamos usar um loop

139
00:08:01,500 --> 00:08:03,833
‫para processar cada um deles em uma iteração.

140
00:08:04,900 --> 00:08:09,700
‫Então, peça. arquivos. imagens. para cada.

141
00:08:14,330 --> 00:08:15,810
‫E então nossa função

142
00:08:15,810 --> 00:08:18,823
‫de retorno de chamada na qual obtemos acesso ao arquivo atual.

143
00:08:21,200 --> 00:08:23,780
‫Tudo bem, agora aqui realmente precisamos criar o

144
00:08:23,780 --> 00:08:26,560
‫nome do arquivo atual e você verá o

145
00:08:26,560 --> 00:08:28,210
‫porquê em um segundo.

146
00:08:29,550 --> 00:08:33,850
‫Então, o nome do arquivo é igual, e então algo muito semelhante a isso.

147
00:08:35,758 --> 00:08:38,160
‫Com a diferença de que agora não é

148
00:08:38,160 --> 00:08:41,230
‫cobertura, mas em vez disso, queremos chamá-los de um, dois e três.

149
00:08:41,230 --> 00:08:43,040
‫E assim, em nossa

150
00:08:43,040 --> 00:08:47,173
‫função de retorno de chamada, também obtemos acesso ao índice atual, certo?

151
00:08:48,920 --> 00:08:53,920
‫Portanto, precisamos do arquivo e I para o índice.

152
00:08:54,220 --> 00:08:57,923
‫E então aqui não é a capa, mas o índice mais um.

153
00:09:00,330 --> 00:09:04,240
‫Então mais um, e isso só

154
00:09:04,240 --> 00:09:09,010
‫porque esse índice é baseado em zero, certo?

155
00:09:09,010 --> 00:09:11,693
‫Em seguida, vem a própria etapa de processamento,

156
00:09:13,060 --> 00:09:15,603
‫que também é muito semelhante a esta.

157
00:09:17,400 --> 00:09:21,873
‫E agora, é claro, precisamos marcar isso como assíncrono também.

158
00:09:23,660 --> 00:09:27,083
‫Certo, e aqui embaixo agora é o nome do arquivo.

159
00:09:29,360 --> 00:09:33,570
‫Ok, agora por que realmente precisamos desse nome de arquivo?

160
00:09:33,570 --> 00:09:37,250
‫Bem, precisamos disso porque agora precisamos enviar esse nome

161
00:09:37,250 --> 00:09:42,250
‫de arquivo para solicitação. corpo. imagens, e essa é exatamente a mesma lógica que

162
00:09:42,280 --> 00:09:45,913
‫tínhamos aqui antes, a pedido. corpo. imageCover.

163
00:09:47,040 --> 00:09:49,020
‫Portanto, lembre-se de que, em

164
00:09:49,020 --> 00:09:52,870
‫nossa coleção, solicite. corpo. as imagens são, na verdade, uma matriz.

165
00:09:52,870 --> 00:09:55,610
‫E agora precisamos criar esse array e iniciá-lo

166
00:09:55,610 --> 00:09:57,343
‫como um array vazio.

167
00:09:58,400 --> 00:10:01,430
‫Portanto, peça. corpo. images

168
00:10:03,870 --> 00:10:07,150
‫como um array vazio e, em cada iteração,

169
00:10:07,150 --> 00:10:09,720
‫enviaremos o nome do arquivo atual

170
00:10:09,720 --> 00:10:11,770
‫para esse array de imagens.

171
00:10:11,770 --> 00:10:15,070
‫Então, peça. corpo. imagens. push,

172
00:10:19,580 --> 00:10:23,370
‫o nome do arquivo, certo?

173
00:10:23,370 --> 00:10:25,100
‫E com isso estamos quase terminando.

174
00:10:25,100 --> 00:10:27,020
‫Há apenas um pequeno problema, que

175
00:10:27,020 --> 00:10:28,530
‫é o fato de que

176
00:10:28,530 --> 00:10:31,710
‫na verdade não estamos usando async await corretamente aqui neste

177
00:10:31,710 --> 00:10:33,200
‫caso, portanto, neste loop.

178
00:10:33,200 --> 00:10:35,560
‫E isso porque este async await

179
00:10:35,560 --> 00:10:38,450
‫aqui está apenas dentro dessa função de retorno

180
00:10:38,450 --> 00:10:40,550
‫de chamada do loop foreach.

181
00:10:40,550 --> 00:10:42,880
‫E isso não impedirá que

182
00:10:42,880 --> 00:10:46,300
‫o código se mova para a direita ao lado

183
00:10:46,300 --> 00:10:49,390
‫dessa linha, onde chamamos o próximo middleware, certo?

184
00:10:49,390 --> 00:10:52,510
‫Então, novamente, no momento não estamos esperando nada

185
00:10:52,510 --> 00:10:55,940
‫disso aqui, novamente, porque essa espera assíncrona acontece dentro da

186
00:10:55,940 --> 00:10:58,000
‫função de retorno de chamada

187
00:10:58,000 --> 00:11:00,440
‫de um desses métodos de loop.

188
00:11:00,440 --> 00:11:03,310
‫E já nos deparamos com esse tipo de

189
00:11:03,310 --> 00:11:06,040
‫problema antes, mas felizmente há uma solução para

190
00:11:06,040 --> 00:11:08,970
‫isso, porque, como essa é uma função assíncrona

191
00:11:08,970 --> 00:11:11,470
‫aqui, ela retornará uma nova promessa.

192
00:11:11,470 --> 00:11:13,610
‫E se fizermos um

193
00:11:13,610 --> 00:11:17,210
‫mapa, podemos salvar uma série de todas essas promessas.

194
00:11:17,210 --> 00:11:18,910
‫E então, se tivermos um array,

195
00:11:18,910 --> 00:11:22,190
‫podemos usar a promessa. tudo para esperar todos eles.

196
00:11:22,190 --> 00:11:24,530
‫E com isso vamos então realmente esperar

197
00:11:24,530 --> 00:11:27,000
‫até que todo esse código, e neste caso,

198
00:11:27,000 --> 00:11:29,340
‫até que todo esse processamento de imagem

199
00:11:29,340 --> 00:11:32,180
‫seja feito, e só então passar para a próxima

200
00:11:32,180 --> 00:11:34,290
‫linha, que está chamando o

201
00:11:34,290 --> 00:11:37,000
‫próximo middleware para realmente atualizar os documentos do tour.

202
00:11:37,000 --> 00:11:38,960
‫E se não fizéssemos

203
00:11:38,960 --> 00:11:41,020
‫isso nesse caso, realmente

204
00:11:41,020 --> 00:11:44,090
‫não funcionaria, porque sem esse empurrar aqui,

205
00:11:44,090 --> 00:11:48,260
‫o pedido. corpo. as imagens ainda estariam vazias

206
00:11:48,260 --> 00:11:49,460
‫na próxima chamada.

207
00:11:49,460 --> 00:11:51,880
‫Portanto, nenhum desses nomes

208
00:11:51,880 --> 00:11:55,260
‫de imagem seria persistido no documento, certo?

209
00:11:55,260 --> 00:11:57,630
‫Portanto, agora vamos usar a promessa. todos e,

210
00:11:57,630 --> 00:12:02,250
‫na verdade, nem mesmo estou salvando esse array aqui em nenhuma variável, em

211
00:12:02,250 --> 00:12:06,340
‫vez disso, vou usar a promessa. tudo imediatamente sobre

212
00:12:06,340 --> 00:12:07,913
‫isso.

213
00:12:09,030 --> 00:12:14,030
‫Portanto, aguarde a promessa. tudo na

214
00:12:15,010 --> 00:12:17,963
‫matriz retornando disso, ok?

215
00:12:19,870 --> 00:12:21,906
‫Espero que tenha feito sentido.

216
00:12:21,906 --> 00:12:25,093
‫Portanto, agora vamos realmente registrar o corpo aqui no console.

217
00:12:28,390 --> 00:12:32,190
‫Tudo bem, com isso devemos estar prontos para fazer o

218
00:12:32,190 --> 00:12:35,560
‫upload de todas as nossas imagens, certo?

219
00:12:35,560 --> 00:12:40,560
‫Vamos descer aqui e tentar novamente.

220
00:12:44,290 --> 00:12:46,903
‫Tudo bem, então onde está nossa matriz de imagens?

221
00:12:54,440 --> 00:12:57,800
‫Bem, talvez estivesse em algum lugar aqui, ah, aqui está.

222
00:12:57,800 --> 00:12:59,660
‫Então eu perdi isso de alguma forma.

223
00:12:59,660 --> 00:13:03,300
‫E isso parece muito promissor, certo?

224
00:13:03,300 --> 00:13:05,730
‫Então, três belas imagens, vamos

225
00:13:05,730 --> 00:13:08,693
‫agora dar uma olhada aqui em nossa página.

226
00:13:10,910 --> 00:13:15,910
‫Ah, aí estão eles, mas não exatamente corretos, certo?

227
00:13:15,980 --> 00:13:18,540
‫Parece que simplesmente carregamos a imagem

228
00:13:18,540 --> 00:13:20,943
‫da capa três vezes.

229
00:13:22,050 --> 00:13:24,710
‫Então, vamos dar uma olhada no Postman, mas

230
00:13:24,710 --> 00:13:26,840
‫os nomes das imagens estão realmente

231
00:13:26,840 --> 00:13:29,963
‫corretos e, portanto, há algo errado em nosso processamento ali.

232
00:13:32,470 --> 00:13:37,050
‫Vamos dar uma olhada também nas solicitações. corpo, oh, e eu esqueci

233
00:13:37,050 --> 00:13:39,243
‫de realmente colocá-lo aqui.

234
00:13:41,820 --> 00:13:44,220
‫Ok, mas acho que nem é necessário porque acabamos

235
00:13:44,220 --> 00:13:45,700
‫de ver no Postman

236
00:13:45,700 --> 00:13:47,763
‫que os nomes dos arquivos estão corretos.

237
00:13:48,630 --> 00:13:50,630
‫Portanto, não precisamos mais deste.

238
00:13:50,630 --> 00:13:53,150
‫Agora vamos dar uma olhada nos nomes

239
00:13:53,150 --> 00:13:58,150
‫de arquivo que acabamos de enviar, para que estejam em público e em tours.

240
00:14:00,570 --> 00:14:01,673
‫E então aqui estão eles.

241
00:14:04,120 --> 00:14:07,763
‫Portanto, este foi provavelmente o primeiro do último teste.

242
00:14:10,980 --> 00:14:13,860
‫E, como você pode ver, todos eles são, de

243
00:14:13,860 --> 00:14:15,920
‫fato, exatamente a mesma imagem.

244
00:14:15,920 --> 00:14:20,720
‫Portanto, capa, um, dois e três são as mesmas imagens

245
00:14:20,720 --> 00:14:23,760
‫e, portanto, isso não está correto.

246
00:14:23,760 --> 00:14:27,500
‫E posso ver imediatamente qual é o problema.

247
00:14:27,500 --> 00:14:30,980
‫Então, você vê que, na verdade, ainda estamos lendo

248
00:14:30,980 --> 00:14:33,950
‫o pedido. arquivos. imageCover, e

249
00:14:33,950 --> 00:14:37,533
‫não o arquivo da iteração atual deste loop.

250
00:14:39,090 --> 00:14:43,107
‫Ok, então, em vez disso, esse deve ser o arquivo. amortecedor.

251
00:14:45,930 --> 00:14:48,210
‫Tudo bem, então vamos em frente

252
00:14:48,210 --> 00:14:50,073
‫e deletar tudo isso.

253
00:14:54,440 --> 00:14:57,253
‫Tudo bem, e simplesmente tente novamente agora.

254
00:14:59,490 --> 00:15:00,653
‫Então, vamos enviar isso.

255
00:15:03,220 --> 00:15:05,633
‫Os nomes ainda parecem

256
00:15:06,810 --> 00:15:10,310
‫estar corretos, mas agora, quando recarregarmos, vamos ver.

257
00:15:10,310 --> 00:15:12,680
‫Ah, isso parece correto.

258
00:15:12,680 --> 00:15:14,260
‫Lindo lindo.

259
00:15:14,260 --> 00:15:17,120
‫Você vê que as imagens estão todas bem

260
00:15:17,120 --> 00:15:19,480
‫formatadas, até essa que estava, lembre-se,

261
00:15:19,480 --> 00:15:21,720
‫em retrato e nem mesmo

262
00:15:21,720 --> 00:15:24,913
‫paisagem, mas basicamente recortamos isso e ainda está lindo.

263
00:15:26,300 --> 00:15:29,473
‫Ok, então aqui podemos confirmar isso, de

264
00:15:31,000 --> 00:15:34,993
‫modo que está na casa dos 2.000 por 1.333 pixels.

265
00:15:37,220 --> 00:15:40,880
‫Tudo bem, ainda está um pouco para o lado grande aqui,

266
00:15:40,880 --> 00:15:44,360
‫então talvez pudéssemos reduzir a qualidade um pouco mais, mas

267
00:15:44,360 --> 00:15:46,280
‫isso não é muito importante.

268
00:15:46,280 --> 00:15:47,943
‫O que realmente importa aqui

269
00:15:47,943 --> 00:15:51,350
‫é que a lógica que acabamos de aplicar aqui realmente funciona.

270
00:15:51,350 --> 00:15:55,233
‫Então, apenas para recapitular rapidamente o que fizemos nessas duas palestras.

271
00:15:56,820 --> 00:16:00,920
‫Então criamos um upload de multer usando o armazenamento de memória

272
00:16:00,920 --> 00:16:03,183
‫e esse filtro apenas para imagens.

273
00:16:04,330 --> 00:16:07,370
‫Em seguida, criamos o middleware de imagem do

274
00:16:07,370 --> 00:16:11,490
‫tour de upload usando upload. campos, que pega em

275
00:16:11,490 --> 00:16:14,570
‫uma capa de imagem e três imagens, e

276
00:16:14,570 --> 00:16:19,020
‫depois na requisição vai colocar a propriedade de arquivos assim, tá bom?

277
00:16:19,020 --> 00:16:22,600
‫Então, em nosso próximo middleware, redimensionamos essas imagens, primeiro

278
00:16:22,600 --> 00:16:24,170
‫a imagem da

279
00:16:24,170 --> 00:16:27,090
‫capa e, em seguida, as três imagens restantes.

280
00:16:27,090 --> 00:16:28,930
‫E o que é realmente importante observar aqui

281
00:16:28,930 --> 00:16:33,380
‫é como colocamos os nomes dos arquivos de imagem sob solicitação. corpo.

282
00:16:33,380 --> 00:16:35,620
‫E fazemos isso para que no

283
00:16:35,620 --> 00:16:37,570
‫próximo middleware, que é o

284
00:16:37,570 --> 00:16:40,230
‫gerenciador de rota real, ele coloque esses dados

285
00:16:40,230 --> 00:16:42,620
‫no novo documento quando for atualizá-lo, certo?

286
00:16:42,620 --> 00:16:44,700
‫Então, fazemos isso com a capa da imagem,

287
00:16:44,700 --> 00:16:46,940
‫e também fazemos isso com as imagens restantes,

288
00:16:46,940 --> 00:16:50,120
‫empurrando-a para dentro do corpo. imagens, que como

289
00:16:50,120 --> 00:16:52,510
‫sabemos de nosso esquema de

290
00:16:52,510 --> 00:16:54,920
‫passeio, espera uma série de strings.

291
00:16:54,920 --> 00:16:57,290
‫E então, neste caso, nomes de arquivos.

292
00:16:57,290 --> 00:16:58,980
‫Então, sobre essas outras imagens,

293
00:16:58,980 --> 00:17:03,490
‫nós as pedimos. arquivos. imagens, então é um

294
00:17:03,490 --> 00:17:07,150
‫array, e é claro que fazemos um loop através dele usando map.

295
00:17:07,150 --> 00:17:10,130
‫E usamos map para que possamos basicamente

296
00:17:10,130 --> 00:17:12,680
‫salvar as três promessas que são

297
00:17:12,680 --> 00:17:15,710
‫o resultado dessas três funções assíncronas aqui,

298
00:17:15,710 --> 00:17:17,920
‫então podemos esperar todas elas

299
00:17:17,920 --> 00:17:20,860
‫aqui usando Promise. Tudo certo?

300
00:17:20,860 --> 00:17:23,680
‫E só depois disso passamos para

301
00:17:23,680 --> 00:17:26,950
‫o gerenciador de atualização do tour real, certo?

302
00:17:26,950 --> 00:17:28,670
‫E essa parte é muito importante,

303
00:17:28,670 --> 00:17:30,650
‫por isso é importante que apenas

304
00:17:30,650 --> 00:17:33,620
‫passemos para o próximo middleware assim que esta parte aqui

305
00:17:33,620 --> 00:17:34,940
‫estiver realmente concluída.

306
00:17:34,940 --> 00:17:38,940
‫Porque caso contrário, peça. corpo. as imagens ficarão

307
00:17:38,940 --> 00:17:42,030
‫vazias e, claro, os nomes dos nossos arquivos não

308
00:17:42,030 --> 00:17:44,633
‫serão salvos no documento da turnê atual, certo?

309
00:17:45,580 --> 00:17:47,710
‫E isso realmente encerra a

310
00:17:47,710 --> 00:17:51,450
‫parte da imagem ou do upload do arquivo desta seção.

311
00:17:51,450 --> 00:17:53,290
‫Espero que tenha sido divertido,

312
00:17:53,290 --> 00:17:55,850
‫sei que para mim foi muito legal.

313
00:17:55,850 --> 00:17:58,130
‫Eu realmente gosto desse tipo

314
00:17:58,130 --> 00:18:02,570
‫de coisa, o que faz minhas aplicações parecerem do mundo real.

315
00:18:02,570 --> 00:18:04,470
‫De qualquer forma, espero que tenham gostado

316
00:18:04,470 --> 00:18:06,163
‫e nos vemos no próximo.