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

2
00:00:04,770 --> 00:00:09,509
Đã hiểu một số chi tiết về cors trong bài giảng trước đó,

3
00:00:09,509 --> 00:00:15,670
trong bài tập này chúng tôi sẽ sử dụng các cors Node Module và cấu hình máy chủ nhanh của chúng tôi.

4
00:00:15,670 --> 00:00:21,760
Để cho phép các máy chủ để đáp ứng với các

5
00:00:21,760 --> 00:00:26,340
tiêu đề liên quan đến cors thích hợp để yêu cầu đến từ trang web của khách hàng.

6
00:00:28,460 --> 00:00:36,060
Để bắt đầu như bạn mong đợi, trước tiên chúng tôi sẽ cài đặt các cors Node Module.

7
00:00:36,060 --> 00:00:39,280
Vì vậy, tại dấu nhắc, gõ npm install.

8
00:00:39,280 --> 00:00:46,170
Hãy chắc chắn rằng bạn đang ở trong thư mục máy chủ Confect, và sau đó cors — lưu.

9
00:00:46,170 --> 00:00:48,160
Và sau đó cài đặt mô-đun cors.

10
00:00:49,160 --> 00:00:54,140
Và như bạn có thể thấy, trong khóa học này tôi đang sử dụng cors @2 .8.4.

11
00:00:54,140 --> 00:00:57,530
Một khi bạn đã cài đặt mô-đun cors, chúng

12
00:00:57,530 --> 00:01:03,260
ta hãy vào trình biên tập của chúng tôi và sau đó cấu hình máy chủ nhanh của chúng tôi.

13
00:01:03,260 --> 00:01:05,320
Tới gặp biên tập viên của chúng tôi.

14
00:01:05,320 --> 00:01:10,360
Bây giờ trong thư mục tuyến đường, bây giờ đó là nơi tôi sẽ chủ yếu áp dụng

15
00:01:10,360 --> 00:01:14,980
Module cors bởi vì đó là nơi mà tất cả các tuyến đường khác nhau đang được phục vụ.

16
00:01:14,980 --> 00:01:22,130
Vì vậy, trong thư mục route, tôi sẽ thêm vào một tập tin mới có tên cors.js.

17
00:01:22,130 --> 00:01:27,180
Và sau đó trong tập tin này, chúng tôi sẽ cấu hình Module cors.

18
00:01:27,180 --> 00:01:32,795
Bây giờ đây là cách của tôi để đặt tất cả các thông tin liên quan đến

19
00:01:32,795 --> 00:01:38,980
cors trong một mô-đun nút dựa trên tập tin riêng biệt ở đây.

20
00:01:38,980 --> 00:01:42,445
Vì vậy, tại dấu nhắc,

21
00:01:42,445 --> 00:01:47,527
hãy để tôi thử const express =

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

23
00:01:53,979 --> 00:01:58,795
Và chúng ta hãy nhận được,

24
00:02:02,831 --> 00:02:05,263
Các mô-đun cors trong.

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

26
00:02:15,434 --> 00:02:23,800
sau đó chúng ta hãy nói một danh sách trắng của một mảng chuỗi.

27
00:02:23,800 --> 00:02:28,843
Danh sách trắng chứa tất cả các nguồn gốc

28
00:02:28,843 --> 00:02:33,892
mà máy chủ này sẵn sàng chấp nhận.

29
00:02:33,892 --> 00:02:38,942
Bây giờ tôi sẽ bao gồm một vài trong số họ ở đây,

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

31
00:02:41,793 --> 00:02:48,147
sau đó, Local host 3443.

32
00:02:48,147 --> 00:02:53,415
Và nếu bạn cần thêm nguồn gốc để được thêm vào danh sách trắng của bạn, bạn chỉ có thể thêm chúng

33
00:02:53,415 --> 00:02:58,544
vào danh sách trắng của bạn bởi vì tôi rõ ràng cố gắng để cấu hình cors Module của tôi.

34
00:02:58,544 --> 00:03:04,444
Vì vậy, ở đây, tôi sẽ khai báo

35
00:03:04,444 --> 00:03:12,006
một hàm A ở đây,

36
00:03:16,755 --> 00:03:23,000
Với yêu cầu và gọi lại được định nghĩa ở đây.

37
00:03:23,000 --> 00:03:29,180
Và bên trong cái này tôi sẽ tìm ra những lựa chọn cors ở đây.

38
00:03:29,180 --> 00:03:37,337
Vì vậy, tôi sẽ bắt đầu bằng cách nói corsoptions,

39
00:03:37,337 --> 00:03:43,683
var corsoptions; và sau đó tôi sẽ

40
00:03:43,683 --> 00:03:53,453
nói nếu (Whitelist.indexof (req.header ('Origin'-

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

42
00:03:56,850 --> 00:04:01,920
Vì vậy, bạn có thể thấy rằng ở đây chúng tôi đang xác định trong mã ở đây,

43
00:04:01,920 --> 00:04:03,390
chúng tôi đang nói req.header.

44
00:04:03,390 --> 00:04:07,770
Vì vậy, nếu tiêu đề yêu cầu đến chứa một nguồn cấp dữ liệu gốc,

45
00:04:07,770 --> 00:04:11,420
sau đó chúng ta sẽ kiểm tra danh sách trắng này.

46
00:04:11,420 --> 00:04:15,770
Tìm kiếm nguồn gốc cụ thể đó, nó có hiện diện trong danh sách trắng này không?

47
00:04:15,770 --> 00:04:18,360
Vì vậy, đó là lý do tại sao chúng tôi đang nói Whitelist.indexof.

48
00:04:18,360 --> 00:04:23,020
Vì vậy, đây là một hoạt động mảng được thực hiện ở đây.

49
00:04:23,020 --> 00:04:29,715
Và chúng ta sẽ nói về nguồn gốc không bằng -1.

50
00:04:30,810 --> 00:04:37,575
Như bạn đã biết chỉ số hoạt động sẽ trả về chỉ số lớn hơn hoặc

51
00:04:37,575 --> 00:04:42,057
bằng 0 nếu điều này có mặt trong mảng này.

52
00:04:42,057 --> 00:04:46,620
Nó sẽ trả về -1 nếu điều này không có trong mảng này.

53
00:04:46,620 --> 00:04:51,155
Vì vậy, một cách rất nhanh chóng để kiểm tra xem nếu các

54
00:04:51,155 --> 00:04:54,860
yêu cầu đến xuất xứ trong danh sách trắng.

55
00:04:54,860 --> 00:04:58,875
Trong trường hợp đó, chúng ta sẽ nói

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

57
00:05:06,358 --> 00:05:11,027
CorsOptions = và đây là nơi tôi

58
00:05:11,027 --> 00:05:15,541
sẽ chỉ định {origin: true}

59
00:05:17,633 --> 00:05:23,038
Vì vậy, bằng cách nói {origin: true}, có nghĩa là

60
00:05:23,038 --> 00:05:27,830
nguồn gốc ban đầu trong yêu cầu đến nằm trong danh sách trắng.

61
00:05:27,830 --> 00:05:30,995
Vì vậy, tôi sẽ cho phép nó được chấp nhận.

62
00:05:30,995 --> 00:05:36,305
Vì vậy, khi tôi thiết lập nguồn gốc là bằng đúng ở đây, sau đó cors Module của tôi sẽ

63
00:05:36,305 --> 00:05:42,565
trả lời lại nói điều khiển truy cập cho phép nguồn gốc, và sau đó bao gồm nguồn gốc đó vào

64
00:05:42,565 --> 00:05:47,590
các tiêu đề với điều khiển truy cập cho phép nguồn gốc chìa khóa có.

65
00:05:47,590 --> 00:05:53,130
Vì vậy, theo cách đó phía khách hàng của tôi sẽ được thông báo nói rằng không sao cho

66
00:05:53,130 --> 00:05:59,250
máy chủ chấp nhận yêu cầu này cho nguồn gốc cụ thể này.

67
00:05:59,250 --> 00:06:03,858
Nếu không, vì vậy nếu đó không phải là trường hợp, vì vậy

68
00:06:03,858 --> 00:06:09,127
nếu req.header của ('Origin') không nằm

69
00:06:09,127 --> 00:06:14,547
trong danh sách trắng, sau đó bạn sẽ thấy CorsOptions.

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

71
00:06:19,610 --> 00:06:24,815
Vì vậy, khi bạn thiết lập nguồn gốc để false, sau đó bộ điều khiển truy cập

72
00:06:24,815 --> 00:06:29,415
AlloWorigin sẽ không được trả lại bởi trang web máy chủ của tôi.

73
00:06:29,415 --> 00:06:33,411
Và sau đó một khi chúng tôi đã làm điều

74
00:06:33,411 --> 00:06:40,345
đó, sau đó chúng tôi sẽ nói callback (null, CorsOptions);.

75
00:06:40,345 --> 00:06:43,335
Đó là nó. Vì vậy, bằng cách gọi chức năng này ở đây,

76
00:06:43,335 --> 00:06:48,010
CorsoptionsDelegate ở đây, chúng tôi sẽ kiểm tra để xem nếu

77
00:06:48,010 --> 00:06:53,100
yêu cầu đến thuộc về một trong những nguồn gốc danh sách trắng.

78
00:06:53,100 --> 00:06:57,342
Nếu có, sau đó bạn trả lời lại với điều khiển truy cập

79
00:06:57,342 --> 00:07:02,313
AlloWorigin với nguồn gốc của yêu cầu thiết lập trong đó.

80
00:07:02,313 --> 00:07:08,490
Nếu không, nó sẽ không bao gồm điều khiển truy cập AlloWorigin khi trả lời.

81
00:07:08,490 --> 00:07:16,250
Bây giờ, từ chức năng này, chúng tôi sẽ xuất khẩu cors như cors ở đây.

82
00:07:16,250 --> 00:07:20,724
Bây giờ, nếu bạn cấu hình mô-đun cors bằng cách đơn giản nói cors

83
00:07:20,724 --> 00:07:24,751
mà không có bất kỳ tùy chọn, sau đó điều đó có nghĩa là điều này sẽ trả lời

84
00:07:24,751 --> 00:07:29,597
lại với điều khiển truy cập AlloWorigin với số tiền thẻ hoang dã.

85
00:07:29,597 --> 00:07:32,748
Có một số quy tắc mà trên đó điều này là chấp nhận được để làm,

86
00:07:32,748 --> 00:07:35,660
đặc biệt là bất cứ khi nào chúng tôi thực hiện các hoạt động get.

87
00:07:35,660 --> 00:07:37,830
Không sao khi chấp nhận điều đó.

88
00:07:37,830 --> 00:07:44,660
Nếu không, chúng tôi sẽ nói, CorsWithOptions = cors, và

89
00:07:44,660 --> 00:07:50,639
sau đó chúng tôi sẽ cung cấp các) CorsOptionsDelegate)

90
00:07:50,639 --> 00:07:56,060
chức năng mà chúng tôi vừa xác định trước đó.

91
00:07:57,290 --> 00:08:02,230
Vì vậy, theo cách đó, nếu bạn cần áp dụng A cors

92
00:08:02,230 --> 00:08:07,190
với các tùy chọn cụ thể cho một tuyến đường cụ thể, chúng tôi sẽ sử dụng chức năng này.

93
00:08:07,190 --> 00:08:09,960
Nếu không, chúng tôi sẽ chỉ đơn giản là sử dụng cors tiêu chuẩn.

94
00:08:09,960 --> 00:08:15,030
Bây giờ chúng ta đã xác định mã liên quan đến cors-code trong cors.js, chúng

95
00:08:15,030 --> 00:08:19,410
ta hãy bắt đầu áp dụng điều này cho các tuyến đường khác nhau.

96
00:08:19,410 --> 00:08:22,040
Vì vậy, chúng tôi sẽ bắt đầu với DishRouter.

97
00:08:22,040 --> 00:08:27,402
Vì vậy, chúng ta hãy mở DishRouter, và

98
00:08:27,402 --> 00:08:32,406
trong DishRouter, chúng ta sẽ đầu tiên

99
00:08:32,406 --> 00:08:37,064
[NOUSE] nhập khẩu [NOUSE]. /cors.

100
00:08:37,064 --> 00:08:41,320
Lưu ý rằng các tập tin cors.js là trong cùng một thư mục, vì vậy

101
00:08:41,320 --> 00:08:45,300
chúng tôi chỉ có thể nhập nó bằng cách nói. /cors.js.

102
00:08:45,300 --> 00:08:47,417
Mô-đun nút dựa trên tệp.

103
00:08:47,417 --> 00:08:53,650
Bây giờ, cho yêu cầu GET, một khi chúng tôi đã nhập khẩu đó.

104
00:08:53,650 --> 00:08:58,970
Bây giờ, đối với DishRouter, tôi sẽ thiết lập trường tùy chọn.

105
00:08:58,970 --> 00:09:03,510
Vì vậy, như bạn đã thấy, bất cứ khi nào bạn cần phải preflight yêu cầu của bạn,

106
00:09:03,510 --> 00:09:10,250
khách hàng đầu tiên sẽ gửi thông báo yêu cầu HTTP OPTIONS và sau đó có được

107
00:09:10,250 --> 00:09:14,340
trả lời từ phía máy chủ trước khi nó thực sự gửi yêu cầu thực tế.

108
00:09:14,340 --> 00:09:22,960
Vì vậy, đối với các tùy chọn, nếu thông báo tùy chọn được nhận trên tuyến đường cụ thể này,

109
00:09:22,960 --> 00:09:28,944
sau đó chúng tôi sẽ trả lời như cors.CorsWithOptions, và,

110
00:09:31,539 --> 00:09:38,022
Với chức năng gọi lại ở đây, trong đó nói,

111
00:09:38,022 --> 00:09:45,773
res.sendStatus, 200.

112
00:09:45,773 --> 00:09:51,850
Chúng ta không cần gửi bất cứ điều gì hơn là chỉ là tình trạng từ đây.

113
00:09:51,850 --> 00:09:55,120
Và như vậy, khi một thông điệp tùy chọn được nhận,

114
00:09:55,120 --> 00:10:00,060
khi điều này sẽ trả lời, chúng ta sẽ thấy kết quả gì khi chúng ta gửi một yêu cầu tùy chọn

115
00:10:02,570 --> 00:10:05,230
từ phía khách hàng đến phía máy chủ trong một chuyến bay ngắn.

116
00:10:05,230 --> 00:10:08,910
Bây giờ, tùy chọn này, tôi sẽ áp dụng cho mọi tuyến đường.

117
00:10:08,910 --> 00:10:11,998
Vì vậy, cho DisHid, cho D

118
00:10:11,998 --> 00:10:16,560
ishid/Bình luận, và cũng cho D

119
00:10:16,560 --> 00:10:22,605
ishid/Bình luận bắt đầu, /:CommentID.

120
00:10:24,210 --> 00:10:28,417
Vì vậy, tất cả các trường hợp, tôi sẽ áp dụng các tùy chọn tương tự ở đó.

121
00:10:30,360 --> 00:10:34,090
Bây giờ, đi trở lại, cho

122
00:10:34,090 --> 00:10:39,290
GET, tôi sẽ chỉ đơn giản là áp dụng cors.

123
00:10:39,290 --> 00:10:46,474
Vì vậy, đối với yêu cầu GET, tôi sẽ nói, Cors.cors,

124
00:10:46,474 --> 00:10:51,243
vì vậy lưu ý rằng đây là phần mềm trung gian đầu tiên mà chúng tôi sẽ áp dụng, và

125
00:10:51,243 --> 00:10:54,660
sau đó nó sẽ chuyển sang tin nhắn này ở đây.

126
00:10:54,660 --> 00:10:58,380
Vì vậy, các cors middleware được giới thiệu ở đó.

127
00:10:58,380 --> 00:11:05,750
Đối với POST, họ sẽ áp dụng Cors.corsWithOptions.

128
00:11:05,750 --> 00:11:10,240
Cùng một điều cho điều đó, PUT,

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

130
00:11:16,760 --> 00:11:21,550
Điều tương tự cho POST, PUT, và

131
00:11:21,550 --> 00:11:25,780
DELETE còn lại trên tất cả các tuyến đường khác ở đây.

132
00:11:25,780 --> 00:11:31,562
Đối với GET, chúng tôi sẽ chỉ sử dụng cors,

133
00:11:31,562 --> 00:11:38,124
vì vậy hãy để tôi chỉ áp dụng corsWithOptions để POST, PU

134
00:11:38,124 --> 00:11:43,437
T, và DELETE trong tất cả các tuyến đường ở đây,

135
00:11:43,437 --> 00:11:47,201
vì vậy POST, PUT, và DELETE.

136
00:11:49,100 --> 00:11:52,711
Bây giờ, cho các hoạt động GET như chúng ta đã thấy cho

137
00:11:52,711 --> 00:11:57,750
phiên bản của DishRouter tôi chỉ áp dụng cors.cors,

138
00:11:57,750 --> 00:12:02,910
vì vậy tôi sẽ sao chép điều đó và sau đó áp dụng nó cho tất cả các GeT.

139
00:12:04,290 --> 00:12:09,580
Vì vậy, cho GET này, sau đó cuộn xuống cho GET này, và

140
00:12:09,580 --> 00:12:16,340
sau đó cũng cho cuối cùng, tôi cũng sẽ áp dụng cùng một tùy chọn.

141
00:12:16,340 --> 00:12:19,770
Vì vậy, DishRouter của tôi bây giờ đã được cập nhật.

142
00:12:19,770 --> 00:12:23,672
Bây giờ, tôi sẽ làm điều tương tự với Promorouter,

143
00:12:23,672 --> 00:12:28,180
LeaderRouter, UploadRouter, và cũng là users.js.

144
00:12:28,180 --> 00:12:32,660
Vì vậy, hãy mở LeaderRouter tiếp theo.

145
00:12:32,660 --> 00:12:37,127
Trong LeaderRouter, điều đầu tiên tất nhiên là

146
00:12:37,127 --> 00:12:41,086
bao gồm các mô-đun nút dựa trên tập tin cors, vì vậy

147
00:12:41,086 --> 00:12:46,620
hãy để tôi sao chép điều đó và sau đó dán nó vào LeaderRouter.

148
00:12:46,620 --> 00:12:52,970
Sau đó, các tùy chọn, tôi sẽ áp dụng cùng một điều để LeaderRouter cũng.

149
00:12:52,970 --> 00:12:58,230
Vì vậy, đối với LeaderRouter, tôi sẽ áp dụng CorsWithOptions,

150
00:12:58,230 --> 00:13:01,370
và sau đó cùng một điều với LeaderRouter hoặc LeaderID.

151
00:13:01,370 --> 00:13:08,190
Bạn chỉ có hai tuyến đường ở đây, vì vậy tôi sẽ áp dụng các tùy chọn cho cả hai.

152
00:13:08,190 --> 00:13:12,160
Đối với các hoạt động GET,

153
00:13:12,160 --> 00:13:15,905
tôi cần phải áp dụng cors.cors, vì vậy sao chép điều này từ DishRouter.

154
00:13:17,180 --> 00:13:20,300
GET này, Tôi sẽ áp dụng cùng một điều, và

155
00:13:20,300 --> 00:13:24,120
sau đó cũng GET này, Tôi sẽ áp dụng cùng một điều.

156
00:13:24,120 --> 00:13:31,680
Bây giờ, đối với POST, PUT và DELETE, như bạn đã thấy, chúng tôi sẽ áp dụng Cors.CorsWithOptions,

157
00:13:37,239 --> 00:13:40,443
Đối với bài đăng,

158
00:13:40,443 --> 00:13:45,790
sau đó PUT và DELETE.

159
00:13:45,790 --> 00:13:50,462
Và điều tương tự cho POST, PUT, và

160
00:13:50,462 --> 00:13:54,850
DELETE của LeaderID cũng.

161
00:13:54,850 --> 00:13:59,410
Vì vậy, bây giờ LeaderRouter của tôi được cập nhật, chúng ta hãy đi đến Promorouter.

162
00:13:59,410 --> 00:14:05,537
Và trong Promorouter cũng, chúng ta hãy bắt đầu ở dưới cùng ở đây cho

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

164
00:14:11,130 --> 00:14:18,400
Sau đó, để DELETE này, PUT, POST.

165
00:14:18,400 --> 00:14:22,036
Và đối với GET, tất nhiên,

166
00:14:22,036 --> 00:14:29,480
cors.cors theo GET này và GET khác xuống dưới đây.

167
00:14:31,680 --> 00:14:36,620
Và sau đó, chúng ta hãy nhập cors đó,

168
00:14:36,620 --> 00:14:40,782
vì vậy sao chép điều này từ LeaderRouter của tôi.

169
00:14:40,782 --> 00:14:44,940
Sau đó, chúng tôi nhập cors ở đây, và sau đó các tùy chọn.

170
00:14:44,940 --> 00:14:48,713
Vì vậy, tôi sẽ sao chép các tùy chọn từ đây và

171
00:14:48,713 --> 00:14:54,190
sau đó đi vào Promorouter, tôi sẽ áp dụng các tùy chọn ở đây.

172
00:14:56,020 --> 00:15:02,913
Và cũng cho Promorouter khác, các tùy chọn tương tự.

173
00:15:02,913 --> 00:15:06,090
Bây giờ, UploadRouter.

174
00:15:06,090 --> 00:15:11,801
Vì vậy, đi vào UploadRouter, một lần nữa

175
00:15:11,801 --> 00:15:17,945
, nhập khẩu, Cres,

176
00:15:26,379 --> 00:15:30,904
Sau đó, cho uploadRouter.route, cho

177
00:15:30,904 --> 00:15:33,820
phép tôi áp dụng các tùy chọn ở đó.

178
00:15:36,859 --> 00:15:39,929
Và đối với GET,

179
00:15:39,929 --> 00:15:44,590
chúng ta sẽ nói cors.cors.

180
00:15:44,590 --> 00:15:48,698
POST sẽ là Cors.CorsWithOptions.

181
00:15:52,360 --> 00:15:59,770
Tương tự cho, PUT.

182
00:15:59,770 --> 00:16:04,510
Và xóa, vì vậy bộ định tuyến tải lên của tôi được cập nhật.

183
00:16:05,800 --> 00:16:08,090
Người cuối cùng là người dùng.

184
00:16:08,090 --> 00:16:12,447
Vì vậy, trong người dùng, hãy để tôi,

185
00:16:21,187 --> 00:16:25,157
Nhập xe ô tô, Và

186
00:16:25,157 --> 00:16:30,078
sau đó, trong trường hợp này bởi vì chúng tôi đang làm router.get, router.post, và như vậy.

187
00:16:30,078 --> 00:16:37,500
Vì vậy, đối với mỗi người trong số họ, tôi sẽ đi vào và áp dụng rõ ràng,

188
00:16:45,144 --> 00:16:50,900
carsWithOptions, ngay cả đối với GET ở đây.

189
00:16:50,900 --> 00:16:54,398
Bởi vì GET được thực hiện bởi quản trị viên ở đây,

190
00:16:54,398 --> 00:16:57,730
không có người dùng nào khác có thể được phép thực hiện điều đó.

191
00:16:57,730 --> 00:17:03,527
Nhưng đăng ký, cũng CarsWithOptions cho

192
00:17:03,527 --> 00:17:10,540
đăng nhập cũng tôi sẽ áp dụng, Đó là nó.

193
00:17:10,540 --> 00:17:12,966
Hãy lưu tất cả các thay đổi vì vậy

194
00:17:12,966 --> 00:17:17,147
chúng tôi có cập nhật tất cả các tuyến đường khác nhau để sử dụng ô tô.

195
00:17:17,147 --> 00:17:23,860
Bây giờ chúng ta hãy đi và khởi động máy chủ của chúng tôi và sau đó xem chiếc xe này giúp chúng tôi như thế nào.

196
00:17:23,860 --> 00:17:27,122
Đi đến thiết bị đầu cuối,

197
00:17:27,122 --> 00:17:31,857
hãy để tôi bắt đầu trang web máy chủ ở đây.

198
00:17:31,857 --> 00:17:34,947
Và khi máy chủ được khởi động, chúng

199
00:17:34,947 --> 00:17:39,990
ta hãy vào Postman của chúng tôi và sau đó gửi một yêu cầu GET.

200
00:17:42,015 --> 00:17:47,475
Vì vậy, khi bạn gửi một yêu cầu GET cho một localhost:3000dishes,

201
00:17:47,475 --> 00:17:52,890
bạn sẽ ngay lập tức nhận được một phản hồi từ phía máy chủ.

202
00:17:52,890 --> 00:17:57,690
Tất nhiên ngay bây giờ cơ sở dữ liệu của tôi là trống rỗng vì vậy tôi nhận được một mảng trống ở đây, nhưng chúng

203
00:17:57,690 --> 00:18:01,260
ta hãy đặc biệt nhìn vào các tiêu đề bởi vì đó là nơi mà

204
00:18:02,260 --> 00:18:06,720
điểm quan tâm cho chúng tôi là trong bài tập này.

205
00:18:06,720 --> 00:18:11,573
Vì vậy, trong đây, bạn có thể thấy rằng chúng tôi có một tiêu đề bổ sung

206
00:18:11,573 --> 00:18:15,930
ở đây gọi là Access-Control-Allow-Origin.

207
00:18:15,930 --> 00:18:20,306
Vì vậy, Access-Control-Allow-Origin như bạn thấy cung cấp chiếc xe hoang dã,

208
00:18:20,306 --> 00:18:22,140
đó là ngôi sao ở đây.

209
00:18:22,140 --> 00:18:25,874
Vì vậy, có nghĩa là, bất kỳ nguồn gốc để truy cập tài nguyên cụ thể này,

210
00:18:25,874 --> 00:18:30,485
vì vậy máy chủ nói rằng okay, bất kỳ nguồn gốc sẽ được phép truy cập tài nguyên này.

211
00:18:30,485 --> 00:18:32,960
Đối với yêu cầu GET chúng tôi hài lòng với điều đó.

212
00:18:34,070 --> 00:18:37,468
Bây giờ chúng ta hãy đăng nhập vào hệ thống, và

213
00:18:37,468 --> 00:18:42,530
sau đó một khi chúng ta có được mã thông báo, hãy để tôi sao chép mã thông báo ở đây.

214
00:18:42,530 --> 00:18:49,210
Và sau đó chúng tôi sẽ thực hiện một thao tác xóa trên trang web máy chủ của chúng tôi.

215
00:18:50,320 --> 00:18:54,930
Vì vậy, chúng tôi sẽ xóa các món ăn ở đây, vì vậy

216
00:18:54,930 --> 00:19:01,360
hãy để tôi bao gồm, Mã thông báo vào tiêu đề ủy quyền ở đây.

217
00:19:01,360 --> 00:19:05,561
Và cũng lưu ý rằng đối với thao tác xóa, tôi đang thiết lập nguồn gốc.

218
00:19:05,561 --> 00:19:13,280
Vì vậy, một lĩnh vực khác ở đây gọi là nguồn gốc để localhost:3343 đây.

219
00:19:13,280 --> 00:19:16,680
Vì vậy, chỉ ra rằng thao tác xóa này thực sự

220
00:19:17,860 --> 00:19:20,740
đang cố gắng để xóa tại nguồn gốc cụ thể này ở đây.

221
00:19:22,170 --> 00:19:28,521
Và vì vậy khi chúng tôi thực hiện thao tác này như vậy, nếu bạn đang làm điều này từ một trình duyệt,

222
00:19:28,521 --> 00:19:33,142
nguồn gốc sẽ được tự động thiết lập bởi trình duyệt

223
00:19:33,142 --> 00:19:37,779
dựa trên trang web mà từ đó yêu cầu bắt nguồn.

224
00:19:37,779 --> 00:19:43,400
Nhưng ở đây, vì chúng ta đang sử dụng Postman, tôi phải thiết lập rõ ràng nguồn gốc ở đây.

225
00:19:43,400 --> 00:19:47,060
Vì vậy, hãy để tôi gửi yêu cầu với trường nguồn gốc này thiết lập ở đây.

226
00:19:47,060 --> 00:19:51,415
Và sau đó bạn sẽ nhận thấy rằng trường tiêu đề bây giờ chứa

227
00:19:51,415 --> 00:19:57,615
Access-Control-Allow-Origin với localhost:3443 được chỉ định ở đây.

228
00:19:57,615 --> 00:20:02,280
Và như bạn sẽ nhận thấy rằng nguồn gốc này nằm trong danh sách trắng.

229
00:20:02,280 --> 00:20:06,520
Vì vậy, đó là lý do tại sao Access-Control-Allow-Origin này được đặt

230
00:20:06,520 --> 00:20:10,520
thành cùng một nguồn gốc mà chúng tôi đã chỉ định ở đó.

231
00:20:10,520 --> 00:20:15,927
Nếu bạn chỉ định một nguồn gốc khác nhau ví dụ,

232
00:20:15,927 --> 00:20:23,430
nếu bạn chỉ định, Nói localhost:2000 ví dụ.

233
00:20:23,430 --> 00:20:30,490
Bạn sẽ nhận thấy rằng điều này sẽ không có, trong câu trả lời đến từ máy chủ,

234
00:20:30,490 --> 00:20:36,210
điều này sẽ không có Access-Control-Allow-Origin đặt ở đây.

235
00:20:36,210 --> 00:20:42,790
Bởi vì, địa chỉ cụ thể này không nằm trong danh sách trắng trên trang web máy chủ.

236
00:20:42,790 --> 00:20:45,710
Bây giờ hãy xem một ví dụ về preflighting một yêu cầu.

237
00:20:45,710 --> 00:20:51,749
Vì vậy, để làm điều đó, trong Postman, chọn Tùy chọn ở đây,

238
00:20:51,749 --> 00:20:56,718
và sau đó chúng ta hãy gửi một yêu cầu preflighting

239
00:20:56,718 --> 00:21:00,650
đến localhost: 3443dishes.

240
00:21:00,650 --> 00:21:05,170
Và trong tiêu đề chúng tôi sẽ,

241
00:21:05,170 --> 00:21:10,725
Đặt nguồn gốc như :localhost3443.

242
00:21:10,725 --> 00:21:18,120
Và sau đó điều này gửi yêu cầu này đến máy chủ.

243
00:21:18,120 --> 00:21:22,575
Và để trả lời yêu cầu tùy chọn này mà bạn đã gửi đến máy chủ,

244
00:21:22,575 --> 00:21:27,540
bạn sẽ nhận thấy rằng trong thư trả lời chúng tôi sẽ nói 204 Không có Nội dung.

245
00:21:27,540 --> 00:21:31,790
Không có nội dung nào được trả lại ở đây.

246
00:21:31,790 --> 00:21:39,110
Tuy nhiên, khi bạn nhìn vào tiêu đề của thư trả lời đi kèm, hãy chú ý rằng

247
00:21:39,110 --> 00:21:43,960
chúng tôi có Access-Control-Allow-Origin để được đặt giá trị đó.

248
00:21:43,960 --> 00:21:47,750
Cũng lưu ý rằng nó đặt các phương pháp Access-Control-Allow.

249
00:21:47,750 --> 00:21:52,340
Và ở đây nó chỉ định những phương pháp mà máy chủ sẽ

250
00:21:52,340 --> 00:21:55,500
sẵn sàng chấp nhận tại điểm kết thúc này.

251
00:21:55,500 --> 00:22:00,880
Vì vậy, do đó bạn đang thông báo cho khách hàng nói rằng,

252
00:22:00,880 --> 00:22:06,240
tất cả các phương pháp này được chấp nhận cho máy chủ tại điểm kết thúc tương ứng.

253
00:22:06,240 --> 00:22:12,120
Vì vậy, đây là cách chúng ta có thể làm preflighting của một yêu cầu.

254
00:22:12,120 --> 00:22:16,130
Bằng cách gửi các tùy chọn yêu cầu tin nhắn đầu tiên, và

255
00:22:16,130 --> 00:22:19,700
sau đó lấy lại thông tin từ máy chủ ở đây.

256
00:22:19,700 --> 00:22:24,030
Và như bạn nhớ lại, đây là những gì chúng tôi cấu hình trong

257
00:22:24,030 --> 00:22:29,160
phần tùy chọn của mỗi điểm kết thúc của bộ định tuyến.

258
00:22:29,160 --> 00:22:34,098
Vì vậy, đây là cách chúng ta có thể cấu hình mô-đun nút ô tô của chúng tôi và

259
00:22:34,098 --> 00:22:40,490
sau đó cấu hình máy chủ của chúng tôi để đáp ứng với các thông điệp tiêu đề khác nhau.

260
00:22:40,490 --> 00:22:43,360
Với điều này, chúng tôi hoàn thành bài tập này.

261
00:22:43,360 --> 00:22:48,080
Trong bài tập này, chúng ta đã thấy làm thế nào chúng ta có thể cấu hình máy chủ của chúng tôi để có thể gửi

262
00:22:48,080 --> 00:22:53,080
lại các tiêu đề liên quan đến khóa học khác nhau trong thông điệp trả lời

263
00:22:53,080 --> 00:22:55,190
bằng cách sử dụng mô-đun nút khóa học.

264
00:22:56,330 --> 00:22:58,196
Với điều này, chúng tôi hoàn thành bài tập này.

265
00:22:58,196 --> 00:23:01,515
Đây là thời điểm tốt để bạn thực hiện một bình luận GIT với khóa học tin nhắn.

266
00:23:01,515 --> 00:23:02,467
[ NHẠC]