1
00:00:00,000 --> 00:00:04,770
[MUSIC]

2
00:00:04,770 --> 00:00:09,509
Ayant compris quelques détails sur les cors dans la conférence précédente,

3
00:00:09,509 --> 00:00:15,670
dans cet exercice, nous allons utiliser le module cors Node et configurer notre serveur express.

4
00:00:15,670 --> 00:00:21,760
Pour permettre au serveur de répondre avec les

5
00:00:21,760 --> 00:00:26,340
en-têtes associés cors appropriés à la demande provenant du site du client.

6
00:00:28,460 --> 00:00:36,060
Pour commencer comme vous le souhaitez, nous allons d'abord installer le module cors Node.

7
00:00:36,060 --> 00:00:39,280
Donc, à l'invite, tapez npm install.

8
00:00:39,280 --> 00:00:46,170
Assurez-vous que vous êtes dans le dossier du serveur Confusion, puis cors — enregistrez.

9
00:00:46,170 --> 00:00:48,160
Et puis installez le module cors.

10
00:00:49,160 --> 00:00:54,140
Et comme vous pouvez le voir, dans ce cours, j'utilise cors @2 .8.4.

11
00:00:54,140 --> 00:00:57,530
Une fois que vous avez installé le module cors,

12
00:00:57,530 --> 00:01:03,260
allons dans notre éditeur et puis configurer notre serveur express.

13
00:01:03,260 --> 00:01:05,320
Je vais voir notre rédacteur en chef.

14
00:01:05,320 --> 00:01:10,360
Maintenant, dans le dossier routes, maintenant c'est là que j'appliquerais principalement

15
00:01:10,360 --> 00:01:14,980
le module cors parce que c'est là que toutes les différentes routes sont desservies.

16
00:01:14,980 --> 00:01:22,130
Donc, dans le dossier routes, je vais ajouter un nouveau fichier nommé cors.js.

17
00:01:22,130 --> 00:01:27,180
Et puis dans ce fichier, nous allons configurer le module cors.

18
00:01:27,180 --> 00:01:32,795
Maintenant, c'est ma façon de mettre toutes les informations relatives aux

19
00:01:32,795 --> 00:01:38,980
cors dans un module de nœud basé sur un fichier séparé ici.

20
00:01:38,980 --> 00:01:42,445
Donc, à l'invite,

21
00:01:42,445 --> 00:01:47,527
permettez-moi d'essayer const express =

22
00:01:47,527 --> 00:01:53,979
require ('express').

23
00:01:53,979 --> 00:01:58,795
Et allons-y,

24
00:02:02,831 --> 00:02:05,263
Le module cors dans.

25
00:02:10,379 --> 00:02:15,434
Const app = express () ;

26
00:02:15,434 --> 00:02:23,800
puis disons une liste blanche d'un tableau de chaînes.

27
00:02:23,800 --> 00:02:28,843
La liste blanche contient toutes les origines

28
00:02:28,843 --> 00:02:33,892
que ce serveur est prêt à accepter.

29
00:02:33,892 --> 00:02:38,942
Maintenant, je vais inclure quelques d'entre eux ici,

30
00:02:38,942 --> 00:02:41,793
localhost : 3000

31
00:02:41,793 --> 00:02:48,147
, puis, hôte local 3443.

32
00:02:48,147 --> 00:02:53,415
Et si vous avez besoin de plus d'origines à ajouter à votre liste blanche, vous pouvez simplement les ajouter

33
00:02:53,415 --> 00:02:58,544
à votre liste blanche parce que j'essaie explicitement de configurer mon module cors.

34
00:02:58,544 --> 00:03:04,444
Donc ici, je vais déclarer

35
00:03:04,444 --> 00:03:12,006
une fonction A ici,

36
00:03:16,755 --> 00:03:23,000
avec la requête et le rappel étant définis ici.

37
00:03:23,000 --> 00:03:29,180
Et à l'intérieur, je vais comprendre que les options de cors ici.

38
00:03:29,180 --> 00:03:37,337
Donc, je vais commencer par dire corsOptions,

39
00:03:37,337 --> 00:03:43,683
var corsOptions ; et puis je

40
00:03:43,683 --> 00:03:53,453
dirai si (Whitelist.indexOf (req.header ('Origin'-

41
00:03:53,453 --> 00:03:56,850
))).

42
00:03:56,850 --> 00:04:01,920
Donc, vous pouvez voir que nous spécifions ici dans le code ici,

43
00:04:01,920 --> 00:04:03,390
nous disons req.header.

44
00:04:03,390 --> 00:04:07,770
Donc, si l'en-tête de requête entrante contient un flux d'origine,

45
00:04:07,770 --> 00:04:11,420
alors nous allons vérifier cette liste blanche.

46
00:04:11,420 --> 00:04:15,770
À la recherche de cette origine particulière, est-elle présente dans cette liste blanche ?

47
00:04:15,770 --> 00:04:18,360
C' est pourquoi nous disons Whitelist.indexOf.

48
00:04:18,360 --> 00:04:23,020
Donc, c'est une opération de tableau qui se fait ici.

49
00:04:23,020 --> 00:04:29,715
Et nous dirons dans l'origine n'est pas égale à -1.

50
00:04:30,810 --> 00:04:37,575
Comme vous le savez, l'index d'opération retournera l'index supérieur ou

51
00:04:37,575 --> 00:04:42,057
égal à zéro si cela est présent dans ce tableau.

52
00:04:42,057 --> 00:04:46,620
Il retournera -1 si cela n'est pas présent dans ce tableau.

53
00:04:46,620 --> 00:04:51,155
Donc, un moyen très rapide de vérifier si les

54
00:04:51,155 --> 00:04:54,860
demandes entrantes proviennent de la liste blanche.

55
00:04:54,860 --> 00:04:58,875
Dans ce cas, nous dirons

56
00:04:58,875 --> 00:05:03,854
CorsOptions, CorsOptions.

57
00:05:06,358 --> 00:05:11,027
corsOptions = et c'est là que je

58
00:05:11,027 --> 00:05:15,541
vais spécifier {origin : true}

59
00:05:17,633 --> 00:05:23,038
Donc en disant {origin : true}, ce qui signifie que l'

60
00:05:23,038 --> 00:05:27,830
origine dans la requête entrante est dans la liste blanche.

61
00:05:27,830 --> 00:05:30,995
Je vais donc permettre qu'elle soit acceptée.

62
00:05:30,995 --> 00:05:36,305
Donc, quand je mets l'origine est égale à true ici, alors mon module cors

63
00:05:36,305 --> 00:05:42,565
répondra en disant que le contrôle d'accès autorise l'origine, puis inclura cette origine dans

64
00:05:42,565 --> 00:05:47,590
les en-têtes avec la clé d'origine de contrôle d'accès.

65
00:05:47,590 --> 00:05:53,130
Donc, de cette façon, mon côté client sera informé en disant qu'il est correct pour

66
00:05:53,130 --> 00:05:59,250
le serveur d'accepter cette requête pour cette origine particulière.

67
00:05:59,250 --> 00:06:03,858
Sinon, donc si ce n'est pas le cas, donc

68
00:06:03,858 --> 00:06:09,127
si le req.header ('Origine') n'est pas dans

69
00:06:09,127 --> 00:06:14,547
la liste blanche, alors vous verrez CorsOptions.

70
00:06:17,920 --> 00:06:19,610
{ origine : false}.

71
00:06:19,610 --> 00:06:24,815
Donc, lorsque vous définissez l'origine sur false, alors le contrôleur d'accès

72
00:06:24,815 --> 00:06:29,415
Alloworigin ne sera pas retourné par mon site serveur.

73
00:06:29,415 --> 00:06:33,411
Et puis une fois que nous avons fait cela,

74
00:06:33,411 --> 00:06:40,345
alors nous dirons callback (null, CorsOptions) ;.

75
00:06:40,345 --> 00:06:43,335
C' est ça. Donc, en appelant cette fonction ici,

76
00:06:43,335 --> 00:06:48,010
CorsoPtionsDelegate ici, nous allons vérifier si la

77
00:06:48,010 --> 00:06:53,100
requête entrante appartient à l'une des origines de la liste blanche.

78
00:06:53,100 --> 00:06:57,342
Si c'est le cas, alors vous répondez avec le contrôle d'accès

79
00:06:57,342 --> 00:07:02,313
Alloworigin avec l'origine de la requête définie là.

80
00:07:02,313 --> 00:07:08,490
Sinon, il n'inclura pas ce contrôle d'accès Alloworigin lorsqu'il répond.

81
00:07:08,490 --> 00:07:16,250
Maintenant, à partir de cette fonction, nous allons exporter des cors en tant que cors ici.

82
00:07:16,250 --> 00:07:20,724
Maintenant, si vous configurez le module cors en disant simplement cors

83
00:07:20,724 --> 00:07:24,751
sans aucune option, cela signifie que cela

84
00:07:24,751 --> 00:07:29,597
répondra avec le contrôle d'accès Alloworigin avec le péage wild cards.

85
00:07:29,597 --> 00:07:32,748
Il y a certaines règles sur lesquelles cela est acceptable de faire,

86
00:07:32,748 --> 00:07:35,660
surtout chaque fois que nous effectuons des opérations get.

87
00:07:35,660 --> 00:07:37,830
C' est bon d'accepter ça.

88
00:07:37,830 --> 00:07:44,660
Sinon, nous dirons, corsWithOptions = cors,

89
00:07:44,660 --> 00:07:50,639
puis nous fournirons la)

90
00:07:50,639 --> 00:07:56,060
fonction CorsoPtionsDelegate) que nous venons de définir plus tôt.

91
00:07:57,290 --> 00:08:02,230
Ainsi, si vous avez besoin d'appliquer A cors

92
00:08:02,230 --> 00:08:07,190
avec des options spécifiques à un itinéraire particulier, nous utiliserons cette fonction.

93
00:08:07,190 --> 00:08:09,960
Sinon, nous allons simplement utiliser les cors standard.

94
00:08:09,960 --> 00:08:15,030
Maintenant que nous avons défini le code lié aux cors dans cors.js,

95
00:08:15,030 --> 00:08:19,410
commençons à l'appliquer aux différentes routes.

96
00:08:19,410 --> 00:08:22,040
Donc, nous allons commencer avec le Dish.Router.

97
00:08:22,040 --> 00:08:27,402
Alors ouvrons le Dish.Router, et

98
00:08:27,402 --> 00:08:32,406
dans le Dish.Router, nous allons d'abord

99
00:08:32,406 --> 00:08:37,064
importer [NOISE] [NOISE]. /cors.

100
00:08:37,064 --> 00:08:41,320
Notez que le fichier cors.js est dans le même dossier, donc

101
00:08:41,320 --> 00:08:45,300
nous pouvons simplement l'importer en disant. /cors.js.

102
00:08:45,300 --> 00:08:47,417
Module de nœud basé sur un fichier.

103
00:08:47,417 --> 00:08:53,650
Maintenant, pour la requête GET, une fois que nous avons importé cela.

104
00:08:53,650 --> 00:08:58,970
Maintenant, pour le Dish.Router, je vais configurer le champ d'options.

105
00:08:58,970 --> 00:09:03,510
Ainsi, comme vous l'avez vu, chaque fois que vous avez besoin de passer en amont vos requêtes,

106
00:09:03,510 --> 00:09:10,250
le client envoie d'abord le message de requête HTTP OPTIONS, puis obtient

107
00:09:10,250 --> 00:09:14,340
la réponse du côté serveur avant qu'il envoie réellement la requête réelle.

108
00:09:14,340 --> 00:09:22,960
Donc, pour les options, si le message d'options est reçu sur cette route particulière,

109
00:09:22,960 --> 00:09:28,944
alors nous répondrons comme cors.CorsWithOptions, et,

110
00:09:31,539 --> 00:09:38,022
Avec la fonction de rappel ici, qui dit,

111
00:09:38,022 --> 00:09:45,773
RES.SendStatus, 200.

112
00:09:45,773 --> 00:09:51,850
Nous n'avons pas besoin d'envoyer quoi que ce soit de plus que le statut d'ici.

113
00:09:51,850 --> 00:09:55,120
Et donc, quand un message d'options est reçu,

114
00:09:55,120 --> 00:10:00,060
quand cela répondra, nous verrons quels résultats lorsque nous envoyons une demande

115
00:10:02,570 --> 00:10:05,230
d'option du côté client vers le côté serveur dans un court vol.

116
00:10:05,230 --> 00:10:08,910
Maintenant, ces options, je vais m'appliquer à chaque itinéraire.

117
00:10:08,910 --> 00:10:11,998
Donc, pour le DishiD, pour

118
00:10:11,998 --> 00:10:16,560
le DishiD/Comments, et aussi pour

119
00:10:16,560 --> 00:10:22,605
le DishiD/Comments commencent, /:CommentID.

120
00:10:24,210 --> 00:10:28,417
Donc, tous les cas, je vais appliquer les mêmes options là-bas.

121
00:10:30,360 --> 00:10:34,090
Maintenant, en remontant, pour

122
00:10:34,090 --> 00:10:39,290
le GET, je vais simplement appliquer des cors.

123
00:10:39,290 --> 00:10:46,474
Donc, pour la requête GET, je dirai, Cors.cors,

124
00:10:46,474 --> 00:10:51,243
alors notez que c'est le premier middleware que nous allons appliquer, et

125
00:10:51,243 --> 00:10:54,660
après cela, il passera à ce message ici.

126
00:10:54,660 --> 00:10:58,380
Donc, le middleware cors est introduit là.

127
00:10:58,380 --> 00:11:05,750
Pour le POST, ils appliqueront Cors.corsWithOptions.

128
00:11:05,750 --> 00:11:10,240
Même chose pour ça, PUT,

129
00:11:12,704 --> 00:11:16,760
SUPPRIMER.

130
00:11:16,760 --> 00:11:21,550
Même chose pour les autres POST, PUT et

131
00:11:21,550 --> 00:11:25,780
DELETE sur toutes les autres routes ici.

132
00:11:25,780 --> 00:11:31,562
Pour le GET, nous allons simplement utiliser les cors,

133
00:11:31,562 --> 00:11:38,124
donc laissez-moi simplement appliquer les CorsWithOptions à POST

134
00:11:38,124 --> 00:11:43,437
, PUT et DELETE dans toutes les routes ici,

135
00:11:43,437 --> 00:11:47,201
donc POST, PUT et DELETE.

136
00:11:49,100 --> 00:11:52,711
Maintenant, pour l'opération GET comme nous l'avons vu pour

137
00:11:52,711 --> 00:11:57,750
la version de Dish.Router, je viens d'appliquer cors.cors,

138
00:11:57,750 --> 00:12:02,910
donc je vais copier cela et ensuite l'appliquer à tous les GET.

139
00:12:04,290 --> 00:12:09,580
Donc, pour ce GET, puis faites défiler vers le bas pour ce GET,

140
00:12:09,580 --> 00:12:16,340
puis aussi pour le dernier, aussi j'appliquerai la même option.

141
00:12:16,340 --> 00:12:19,770
Donc mon Dish.Router est maintenant mis à jour.

142
00:12:19,770 --> 00:12:23,672
Maintenant, je vais faire la même chose avec le PromorOuter,

143
00:12:23,672 --> 00:12:28,180
le LeaderRouter, le UploadRouter, et aussi le users.js.

144
00:12:28,180 --> 00:12:32,660
Alors, ouvrons le LeaderRouter suivant.

145
00:12:32,660 --> 00:12:37,127
Dans le LeaderRouter, la première chose bien sûr est d'

146
00:12:37,127 --> 00:12:41,086
inclure le module de nœud basé sur un fichier cors, alors

147
00:12:41,086 --> 00:12:46,620
laissez-moi le copier et ensuite le coller dans le LeaderRouter.

148
00:12:46,620 --> 00:12:52,970
Ensuite, les options, je vais appliquer la même chose au LeaderRouter aussi.

149
00:12:52,970 --> 00:12:58,230
Donc, pour le LeaderRouter, j'appliquerai le CorsWithOptions,

150
00:12:58,230 --> 00:13:01,370
puis la même chose avec le LeaderRouter ou LeaderID.

151
00:13:01,370 --> 00:13:08,190
Vous n'avez que deux itinéraires ici, donc je vais appliquer les options pour les deux.

152
00:13:08,190 --> 00:13:12,160
Pour les opérations GET,

153
00:13:12,160 --> 00:13:15,905
j'ai besoin d'appliquer les cors.cors, donc en copiant cela à partir du Dish.Router.

154
00:13:17,180 --> 00:13:20,300
Ce GET, je vais appliquer la même chose, et

155
00:13:20,300 --> 00:13:24,120
puis aussi ce GET, je vais appliquer la même chose.

156
00:13:24,120 --> 00:13:31,680
Maintenant, pour le POST, PUT et DELETE, comme vous l'avez vu, nous allons appliquer cors.corsWithOptions,

157
00:13:37,239 --> 00:13:40,443
Pour le POST,

158
00:13:40,443 --> 00:13:45,790
puis PUT et DELETE.

159
00:13:45,790 --> 00:13:50,462
Et la même chose pour le POST,

160
00:13:50,462 --> 00:13:54,850
PUT et DELETE du LeaderID aussi.

161
00:13:54,850 --> 00:13:59,410
Donc maintenant mon LeaderRouter est mis à jour, allons à Promorouter.

162
00:13:59,410 --> 00:14:05,537
Et dans le PROMORouter aussi, commençons en bas ici pour

163
00:14:05,537 --> 00:14:09,970
le DELETE, CorsWithOptions, PUT, POST.

164
00:14:11,130 --> 00:14:18,400
Puis à cette SUPPRIMER, PUT, POST.

165
00:14:18,400 --> 00:14:22,036
Et pour le GET, bien sûr,

166
00:14:22,036 --> 00:14:29,480
les cors.cors suivent ce GET et l'autre GET ci-dessous.

167
00:14:31,680 --> 00:14:36,620
Et puis, nous allons importer ces cors,

168
00:14:36,620 --> 00:14:40,782
donc copier ceci à partir de mon LeaderRouter.

169
00:14:40,782 --> 00:14:44,940
Ensuite, nous importons des cors ici, puis les options.

170
00:14:44,940 --> 00:14:48,713
Donc, je vais copier les options d'ici et

171
00:14:48,713 --> 00:14:54,190
puis aller dans le PROMORouter, je vais appliquer les options ici.

172
00:14:56,020 --> 00:15:02,913
Et aussi à l'autre PromorOuter, les mêmes options.

173
00:15:02,913 --> 00:15:06,090
Maintenant, UploadRouter.

174
00:15:06,090 --> 00:15:11,801
Alors allez dans le UploadRouter, encore une fois

175
00:15:11,801 --> 00:15:17,945
, importer, Cors,

176
00:15:26,379 --> 00:15:30,904
Puis après cela, pour le UploadRouter.route,

177
00:15:30,904 --> 00:15:33,820
laissez-moi appliquer les options là.

178
00:15:36,859 --> 00:15:39,929
Et pour le GET,

179
00:15:39,929 --> 00:15:44,590
nous dirons cors.cors.

180
00:15:44,590 --> 00:15:48,698
Le POST serait Cors.corsWithOptions.

181
00:15:52,360 --> 00:15:59,770
Même chose pour le, PUT.

182
00:15:59,770 --> 00:16:04,510
Et supprimez, donc mon routeur de téléchargement est mis à jour.

183
00:16:05,800 --> 00:16:08,090
Le dernier est les utilisateurs.

184
00:16:08,090 --> 00:16:12,447
Donc, dans les utilisateurs, laissez-moi,

185
00:16:21,187 --> 00:16:25,157
Importer des voitures, Et

186
00:16:25,157 --> 00:16:30,078
puis, dans ce cas, parce que nous faisons router.get, router.post, et ainsi de suite.

187
00:16:30,078 --> 00:16:37,500
Donc, pour chacun d'eux, je vais entrer et appliquer explicitement,

188
00:16:45,144 --> 00:16:50,900
voitures.carsWithOptions, même pour le GET ici.

189
00:16:50,900 --> 00:16:54,398
Étant donné que le GET est effectué par l'administrateur ici,

190
00:16:54,398 --> 00:16:57,730
aucun autre utilisateur ne peut être autorisé à effectuer cela.

191
00:16:57,730 --> 00:17:03,527
Mais l'inscription, aussi carsWithOptions pour

192
00:17:03,527 --> 00:17:10,540
la connexion aussi je vais appliquer, C'est tout.

193
00:17:10,540 --> 00:17:12,966
Sauvegardons tous les changements afin que

194
00:17:12,966 --> 00:17:17,147
nous ayons mis à jour toutes les différentes routes pour utiliser les voitures.

195
00:17:17,147 --> 00:17:23,860
Allons maintenant démarrer notre serveur et voir comment ces voitures nous aident.

196
00:17:23,860 --> 00:17:27,122
Aller au terminal,

197
00:17:27,122 --> 00:17:31,857
laissez-moi démarrer le site du serveur ici.

198
00:17:31,857 --> 00:17:34,947
Et quand le serveur est démarré,

199
00:17:34,947 --> 00:17:39,990
allons à notre Facteur et ensuite envoyer une requête GET.

200
00:17:42,015 --> 00:17:47,475
Ainsi, lorsque vous envoyez une requête GET à un localhost : 3000plats,

201
00:17:47,475 --> 00:17:52,890
vous obtiendrez immédiatement une réponse du côté serveur.

202
00:17:52,890 --> 00:17:57,690
Bien sûr, en ce moment, ma base de données est vide, donc je reçois un tableau vide ici, mais

203
00:17:57,690 --> 00:18:01,260
regardons en particulier les en-têtes parce que c'est là que

204
00:18:02,260 --> 00:18:06,720
le point d'intérêt pour nous est dans cet exercice.

205
00:18:06,720 --> 00:18:11,573
Donc, ici, vous pouvez voir que nous avons un en-tête supplémentaire

206
00:18:11,573 --> 00:18:15,930
ici appelé Access-Control-Allow-Origin.

207
00:18:15,930 --> 00:18:20,306
Ainsi, l'Access-Control-Allow-Origin comme vous le voyez fournit la voiture sauvage,

208
00:18:20,306 --> 00:18:22,140
qui est la star ici.

209
00:18:22,140 --> 00:18:25,874
Donc, ce qui signifie que, toute origine pour accéder à cette ressource particulière, de

210
00:18:25,874 --> 00:18:30,485
sorte que le serveur dit que d'accord, n'importe quelle origine sera autorisée à accéder à cette ressource.

211
00:18:30,485 --> 00:18:32,960
Pour la demande GET, nous sommes satisfaits de cela.

212
00:18:34,070 --> 00:18:37,468
Laissez-nous maintenant nous connecter au système,

213
00:18:37,468 --> 00:18:42,530
puis une fois que nous aurons obtenu le jeton, laissez-moi copier le jeton ici.

214
00:18:42,530 --> 00:18:49,210
Ensuite, nous allons effectuer une opération de suppression sur notre site serveur.

215
00:18:50,320 --> 00:18:54,930
Donc, nous allons supprimer les plats ici, alors

216
00:18:54,930 --> 00:19:01,360
laissez-moi inclure le, Token dans l'en-tête d'autorisation ici.

217
00:19:01,360 --> 00:19:05,561
Et notez également que pour l'opération de suppression, je suis en train de définir l'origine.

218
00:19:05,561 --> 00:19:13,280
Donc, un autre champ ici appelé origine à localhost : 3343 ici.

219
00:19:13,280 --> 00:19:16,680
Donc, indiquant que cette opération de suppression

220
00:19:17,860 --> 00:19:20,740
essaie réellement de supprimer à cette origine particulière ici.

221
00:19:22,170 --> 00:19:28,521
Et donc, lorsque nous effectuons cette opération, si vous faites cela à partir d'un navigateur,

222
00:19:28,521 --> 00:19:33,142
l'origine sera automatiquement définie par le navigateur en fonction de

223
00:19:33,142 --> 00:19:37,779
la page Web à partir de laquelle la demande est originaire.

224
00:19:37,779 --> 00:19:43,400
Mais ici, puisque nous utilisons Postman, je dois explicitement définir l'origine ici.

225
00:19:43,400 --> 00:19:47,060
Alors laissez-moi envoyer la demande avec ce champ d'origine défini ici.

226
00:19:47,060 --> 00:19:51,415
Et puis vous remarquerez que le champ d'en-tête contient maintenant

227
00:19:51,415 --> 00:19:57,615
Access-Control-Allow-Origin avec le localhost:3443 spécifié ici.

228
00:19:57,615 --> 00:20:02,280
Et comme vous remarquerez que cette origine est dans la liste blanche.

229
00:20:02,280 --> 00:20:06,520
C' est pourquoi cet Access-Control-Allow-Origin est défini

230
00:20:06,520 --> 00:20:10,520
sur la même origine que nous y avons spécifiée.

231
00:20:10,520 --> 00:20:15,927
Si vous spécifiez une autre origine par exemple,

232
00:20:15,927 --> 00:20:23,430
si vous spécifiez, Say localhost:2000 par exemple.

233
00:20:23,430 --> 00:20:30,490
Vous remarquerez que cela n'aura pas, dans la réponse provenant du serveur,

234
00:20:30,490 --> 00:20:36,210
cela n'aura pas l'Access-Control-Allow-Origin défini ici.

235
00:20:36,210 --> 00:20:42,790
Parce que, cette adresse particulière ne figure pas dans la liste blanche sur le site du serveur.

236
00:20:42,790 --> 00:20:45,710
Regardons maintenant un exemple de pré-vol d'une demande.

237
00:20:45,710 --> 00:20:51,749
Donc, pour ce faire, dans le Facteur, sélectionnez Options ici,

238
00:20:51,749 --> 00:20:56,718
puis envoyons une demande de prévol

239
00:20:56,718 --> 00:21:00,650
à localhost : 3443plats.

240
00:21:00,650 --> 00:21:05,170
Et dans l'en-tête, nous allons, Mettez

241
00:21:05,170 --> 00:21:10,725
l'origine en tant que :localhost3443.

242
00:21:10,725 --> 00:21:18,120
Et puis cela envoie cette requête au serveur.

243
00:21:18,120 --> 00:21:22,575
Et en réponse à cette demande d'options que vous avez envoyée au serveur,

244
00:21:22,575 --> 00:21:27,540
vous remarquerez que dans le message de réponse, nous dirons 204 Pas de contenu. Il

245
00:21:27,540 --> 00:21:31,790
n'y a pas de contenu à renvoyer ici.

246
00:21:31,790 --> 00:21:39,110
Mais, lorsque vous regardez les en-têtes du message de réponse qui arrive, notez que

247
00:21:39,110 --> 00:21:43,960
nous avons l'Access-Control-Allow-Origin à définir sur cette valeur.

248
00:21:43,960 --> 00:21:47,750
Notez également qu'il définit les méthodes Access-Control-Allow.

249
00:21:47,750 --> 00:21:52,340
Et ici, il spécifie les méthodes que le serveur sera

250
00:21:52,340 --> 00:21:55,500
prêt à accepter à ce point final.

251
00:21:55,500 --> 00:22:00,880
Ainsi, vous informez le client en disant que,

252
00:22:00,880 --> 00:22:06,240
toutes ces méthodes sont acceptables pour le serveur au point de fin correspondant.

253
00:22:06,240 --> 00:22:12,120
Donc, c'est comme ça que nous pouvons faire le pré-vol d'une demande.

254
00:22:12,120 --> 00:22:16,130
En envoyant d'abord le message de demande d'options,

255
00:22:16,130 --> 00:22:19,700
puis en récupérant les informations du serveur ici.

256
00:22:19,700 --> 00:22:24,030
Et comme vous vous en souvenez, c'est ce que nous avons configuré dans la

257
00:22:24,030 --> 00:22:29,160
partie options de chacun des points d'extrémité du routeur.

258
00:22:29,160 --> 00:22:34,098
C' est ainsi que nous pouvons configurer notre module de noeud de voitures

259
00:22:34,098 --> 00:22:40,490
, puis configurer notre serveur pour répondre avec divers messages d'en-tête.

260
00:22:40,490 --> 00:22:43,360
Avec cela, nous complétons cet exercice.

261
00:22:43,360 --> 00:22:48,080
Dans cet exercice, nous avons vu comment nous pouvons configurer notre serveur pour pouvoir

262
00:22:48,080 --> 00:22:53,080
renvoyer divers en-têtes liés au cours dans le message de réponse en

263
00:22:53,080 --> 00:22:55,190
utilisant le module de noeud de cours.

264
00:22:56,330 --> 00:22:58,196
Avec cela, nous complétons cet exercice.

265
00:22:58,196 --> 00:23:01,515
C' est un bon moment pour vous de faire un commentaire GIT avec le cours de message.

266
00:23:01,515 --> 00:23:02,467
[ MUSIQUE]