1
00:00:01,000 --> 00:00:03,340
‫Instruktur: Jadi kami belajar di

2
00:00:03,340 --> 00:00:06,030
‫kuliah terakhir bahwa token web JSON harus

3
00:00:06,030 --> 00:00:08,930
‫disimpan dalam cookie khusus HTTP yang aman.

4
00:00:08,930 --> 00:00:11,470
‫Namun saat ini, kami hanya mengirimkan

5
00:00:11,470 --> 00:00:14,790
‫token sebagai string sederhana dalam respons JSON kami.

6
00:00:14,790 --> 00:00:18,690
‫Jadi di video ini, mari kita juga mengirim token sebagai cookie,

7
00:00:18,690 --> 00:00:20,960
‫sehingga browser dapat menyimpannya dengan cara yang

8
00:00:20,960 --> 00:00:22,473
‫lebih aman ini.

9
00:00:23,920 --> 00:00:25,550
‫Jadi kita dalam kode kita.

10
00:00:25,550 --> 00:00:28,193
‫Apakah kami benar-benar mengirim token ke klien?

11
00:00:29,170 --> 00:00:32,610
‫Ingat, itu ada di authController dan

12
00:00:32,610 --> 00:00:35,920
‫di sini di fungsi createSendToken.

13
00:00:35,920 --> 00:00:39,040
‫Jadi sebelumnya, pada dasarnya kami memiliki semua

14
00:00:39,040 --> 00:00:43,180
‫kode ini di banyak tempat berbeda, tetapi kemudian kami memfaktorkan

15
00:00:43,180 --> 00:00:46,400
‫ulang semua itu ke dalam fungsi createSendToken ini.

16
00:00:46,400 --> 00:00:49,090
‫Baiklah, dan di sinilah kita akan bekerja sekarang.

17
00:00:49,090 --> 00:00:50,980
‫Sekarang, saya yakin Anda sudah

18
00:00:50,980 --> 00:00:53,320
‫familiar dengan cara kerja cookie secara umum, tetapi

19
00:00:53,320 --> 00:00:56,680
‫hanya untuk memastikan kita semua berada di halaman yang sama di

20
00:00:56,680 --> 00:00:58,960
‫sini, mari kita bicara sedikit tentang cookie.

21
00:00:58,960 --> 00:01:02,330
‫Jadi pertama-tama, cookie pada dasarnya hanyalah sepotong

22
00:01:02,330 --> 00:01:06,240
‫kecil teks yang dapat dikirim oleh server ke klien.

23
00:01:06,240 --> 00:01:08,960
‫Kemudian ketika klien menerima cookie, itu akan

24
00:01:08,960 --> 00:01:10,650
‫secara otomatis menyimpannya dan

25
00:01:10,650 --> 00:01:12,860
‫kemudian secara otomatis mengirimkannya kembali bersama

26
00:01:12,860 --> 00:01:16,360
‫dengan semua permintaan di masa mendatang ke server yang sama.

27
00:01:16,360 --> 00:01:20,130
‫Baiklah, sekali lagi, browser secara otomatis menyimpan cookie

28
00:01:20,130 --> 00:01:23,010
‫yang diterimanya dan mengirimkannya kembali

29
00:01:23,010 --> 00:01:27,320
‫di semua permintaan di masa mendatang ke server tempat asalnya.

30
00:01:27,320 --> 00:01:29,500
‫Oke, sekarang, untuk saat ini, ini

31
00:01:29,500 --> 00:01:31,090
‫tidak terlalu penting bagi

32
00:01:31,090 --> 00:01:34,020
‫kami karena kami hanya menguji API menggunakan Postman.

33
00:01:34,020 --> 00:01:37,110
‫Namun beberapa saat kemudian, ketika kita akan membuat halaman

34
00:01:37,110 --> 00:01:39,510
‫web dinamis dan benar-benar berinteraksi dengan

35
00:01:39,510 --> 00:01:41,450
‫browser, maka akan menjadi

36
00:01:41,450 --> 00:01:44,220
‫sangat penting bahwa browser mengirimkan kembali token pada

37
00:01:44,220 --> 00:01:46,410
‫dasarnya secara otomatis di setiap permintaan.

38
00:01:46,410 --> 00:01:49,640
‫Oke, dan saat itu, tentu saja, kita akan berbicara lebih banyak tentang itu.

39
00:01:49,640 --> 00:01:52,220
‫Tapi bagaimanapun, sekarang mari kita belajar bagaimana sebenarnya

40
00:01:52,220 --> 00:01:53,950
‫membuat dan mengirim cookie.

41
00:01:53,950 --> 00:01:57,720
‫Jadi untuk mengirim cookie sebenarnya sangat mudah.

42
00:01:57,720 --> 00:02:00,380
‫Yang harus kita lakukan pada dasarnya adalah

43
00:02:00,380 --> 00:02:02,023
‫melampirkannya ke objek respons.

44
00:02:03,010 --> 00:02:06,910
‫Jadi kita katakan res. cookie dan kemudian yang

45
00:02:06,910 --> 00:02:09,550
‫harus kita lakukan adalah menentukan nama

46
00:02:09,550 --> 00:02:11,630
‫cookie, dan saya menyebutnya token

47
00:02:11,630 --> 00:02:14,860
‫web JSON, lalu data yang sebenarnya ingin kita kirim

48
00:02:14,860 --> 00:02:17,830
‫ke dalam cookie, dan itu tentu saja akan

49
00:02:17,830 --> 00:02:22,020
‫menjadi variabel token dan kemudian setelah itu, beberapa opsi untuk cookie.

50
00:02:22,020 --> 00:02:24,119
‫Dan opsi pertama yang

51
00:02:24,119 --> 00:02:26,810
‫akan kita tentukan adalah properti kedaluwarsa.

52
00:02:26,810 --> 00:02:29,620
‫Oke, jadi pada dasarnya, properti

53
00:02:29,620 --> 00:02:33,200
‫kedaluwarsa ini akan membuat browser atau klien pada

54
00:02:33,200 --> 00:02:36,360
‫umumnya akan menghapus cookie setelah kedaluwarsa.

55
00:02:36,360 --> 00:02:38,780
‫Oke, jadi kami mengatur tanggal

56
00:02:38,780 --> 00:02:43,360
‫kedaluwarsa yang mirip dengan yang kami atur di token web JSON, oke.

57
00:02:43,360 --> 00:02:45,810
‫Jadi mari kita buat variabel baru

58
00:02:46,760 --> 00:02:49,390
‫untuk itu, oke, karena paket token web

59
00:02:49,390 --> 00:02:51,870
‫JSON kemudian dapat bekerja dengan format ini.

60
00:02:51,870 --> 00:02:55,450
‫Oke, tapi dalam JavaScript, ini agak tidak berarti dan sebagai

61
00:02:55,450 --> 00:02:58,923
‫gantinya, mari kita buat variabel dengan bilangan real.

62
00:02:59,850 --> 00:03:02,053
‫Jadi sebut saja masih JWT,

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

64
00:03:06,210 --> 00:03:10,740
‫cookie, kedaluwarsa, dan kami masih mengaturnya menjadi 90, jadi 90 hari,

65
00:03:10,740 --> 00:03:12,810
‫tetapi sekali lagi, tanpa D.

66
00:03:12,810 --> 00:03:16,210
‫Oke, jadi sekarang kita bisa benar-benar

67
00:03:16,210 --> 00:03:21,080
‫melakukan operasi dengannya karena kita perlu mengubahnya menjadi milidetik, oke.

68
00:03:21,080 --> 00:03:23,540
‫Jadi kapan cookie ini harus kedaluwarsa?

69
00:03:23,540 --> 00:03:26,610
‫Itu harus kedaluwarsa pada tanggal baru.

70
00:03:26,610 --> 00:03:28,890
‫Jadi dalam JavaScript, saat menentukan tanggal,

71
00:03:28,890 --> 00:03:30,800
‫kita selalu perlu mengatakan

72
00:03:30,800 --> 00:03:35,403
‫Tanggal baru dan tanggal itu harus kedaluwarsa sekarang, ditambah 90 hari ini.

73
00:03:36,820 --> 00:03:39,483
‫Oke, jadi sekarang, seperti ini tentu saja.

74
00:03:41,470 --> 00:03:43,633
‫Dan kemudian proses. env, dan

75
00:03:44,894 --> 00:03:48,280
‫sekarang, mari kita gunakan yang ini dan kemudian

76
00:03:49,840 --> 00:03:52,320
‫cukup masukkan cookie di sana, oke.

77
00:03:52,320 --> 00:03:55,560
‫Tapi sekarang, tentu saja, kita perlu mengubahnya menjadi milidetik.

78
00:03:55,560 --> 00:03:57,410
‫Jadi kita punya 90 hari sekarang.

79
00:03:57,410 --> 00:03:59,910
‫Jadi dua jam, waktunya 24.

80
00:03:59,910 --> 00:04:01,770
‫Dua menit, kali 60.

81
00:04:01,770 --> 00:04:04,810
‫Dua detik, kali 60 lagi.

82
00:04:04,810 --> 00:04:08,610
‫Dan kemudian ke milidetik, kali seribu, oke.

83
00:04:08,610 --> 00:04:10,600
‫Dan tentu saja, saya bisa melakukan

84
00:04:10,600 --> 00:04:14,090
‫semuanya sekaligus, tapi ini hanya untuk menentukan apa yang sebenarnya kita lakukan.

85
00:04:14,090 --> 00:04:15,120
‫Jadi untuk menunjukkan

86
00:04:15,120 --> 00:04:17,163
‫bahwa kita benar-benar mengubahnya menjadi milidetik.

87
00:04:18,040 --> 00:04:21,603
‫Opsi selanjutnya adalah opsi aman.

88
00:04:22,610 --> 00:04:24,560
‫Jadi kita akan menyetel yang

89
00:04:24,560 --> 00:04:27,530
‫ini ke true dan seperti ini, cookie hanya akan

90
00:04:27,530 --> 00:04:29,140
‫dikirim pada koneksi terenkripsi.

91
00:04:29,140 --> 00:04:32,830
‫Jadi pada dasarnya, kami hanya menggunakan HTTPS, oke.

92
00:04:32,830 --> 00:04:37,030
‫Dan akhirnya, itu adalah opsi httpOnly yang telah kita

93
00:04:37,030 --> 00:04:38,593
‫bicarakan sebelumnya.

94
00:04:41,630 --> 00:04:43,740
‫Oke, jadi kita set yang ini

95
00:04:43,740 --> 00:04:45,820
‫ke true dan ini akan

96
00:04:45,820 --> 00:04:50,410
‫membuat cookie tidak dapat diakses atau dimodifikasi dengan cara apa pun oleh browser.

97
00:04:50,410 --> 00:04:53,280
‫Oke, jadi ini penting untuk mencegah

98
00:04:53,280 --> 00:04:55,900
‫serangan skrip lintas situs tersebut.

99
00:04:55,900 --> 00:04:58,110
‫Baiklah, jadi semua yang akan

100
00:04:58,110 --> 00:05:01,340
‫dilakukan browser saat kita menyetel httpOnly ke true

101
00:05:01,340 --> 00:05:03,390
‫pada dasarnya adalah menerima

102
00:05:03,390 --> 00:05:07,180
‫cookie, menyimpannya, dan kemudian mengirimkannya secara otomatis bersama setiap permintaan.

103
00:05:07,180 --> 00:05:09,180
‫Oke, dan itu sebenarnya.

104
00:05:09,180 --> 00:05:12,770
‫Jadi beginilah dasarnya kami mendefinisikan cookie, jadi katakanlah bagian

105
00:05:12,770 --> 00:05:14,360
‫ini, dan kemudian kami

106
00:05:14,360 --> 00:05:17,510
‫mengirimkannya menggunakan res. Kue kering.

107
00:05:17,510 --> 00:05:20,850
‫Sekarang, jika kami ingin mengujinya sekarang, itu tidak akan berhasil

108
00:05:20,850 --> 00:05:23,990
‫karena saat ini, kami sebenarnya tidak menggunakan HTTPS.

109
00:05:23,990 --> 00:05:26,650
‫Dan karena ini aman: benar, cookie

110
00:05:26,650 --> 00:05:28,130
‫tidak akan dibuat

111
00:05:28,130 --> 00:05:30,590
‫dan tidak dikirim ke klien.

112
00:05:30,590 --> 00:05:31,920
‫Baiklah, dan pada

113
00:05:31,920 --> 00:05:36,180
‫dasarnya, kami hanya ingin mengaktifkan bagian ini di sini dalam produksi.

114
00:05:36,180 --> 00:05:38,820
‫Jadi yang akan saya lakukan pada

115
00:05:38,820 --> 00:05:42,510
‫dasarnya adalah mengekspor seluruh objek ini ke dalam variabel terpisah.

116
00:05:42,510 --> 00:05:44,160
‫Oke, jadi izinkan saya menunjukkannya kepada Anda.

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

118
00:05:47,242 --> 00:05:49,710
‫const cookieOptions harus sama dengan

119
00:05:50,780 --> 00:05:54,003
‫ini dan kemudian di sini, kami meneruskannya.

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

121
00:05:57,480 --> 00:06:00,300
‫Sekarang, tentu saja, kami kemudian tidak menginginkan bagian ini di

122
00:06:00,300 --> 00:06:03,100
‫sini, tetapi hanya ketika kami sedang dalam produksi.

123
00:06:03,100 --> 00:06:04,050
‫Jadi

124
00:06:06,830 --> 00:06:11,670
‫katakanlah jika proses. lingkungan NODE_ENV, ingat itu tempat

125
00:06:11,670 --> 00:06:13,500
‫penyimpanannya apakah kita sedang produksi

126
00:06:13,500 --> 00:06:15,023
‫atau tidak.

127
00:06:16,130 --> 00:06:17,780
‫Jadi jika itu

128
00:06:20,210 --> 00:06:24,590
‫sama dengan produksi, atur cookieOptions. aman sama dengan

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

130
00:06:28,970 --> 00:06:31,533
‫Oke, dan sekarang, kita bisa menghapusnya dari sini.

131
00:06:33,600 --> 00:06:36,430
‫Ya, jadi sekarang, hanya saat kita dalam produksi,

132
00:06:36,430 --> 00:06:39,300
‫kita akan mendapatkan opsi aman yang disetel ke true.

133
00:06:39,300 --> 00:06:42,150
‫Dan sebaliknya, hanya akan dikirim seperti

134
00:06:42,150 --> 00:06:45,470
‫ini, jadi hanya dengan tanggal kedaluwarsa dan httpOnly.

135
00:06:45,470 --> 00:06:48,263
‫Oke, dan sekarang mari kita benar-benar menguji ini.

136
00:06:50,200 --> 00:06:53,153
‫Dan saya akan mengujinya dengan membuat pengguna baru.

137
00:06:54,940 --> 00:06:56,970
‫Jadi di sini di Daftar sebenarnya

138
00:06:58,600 --> 00:06:59,750
‫dan sebut saja

139
00:07:00,880 --> 00:07:03,180
‫ini pengguna@jonas. saya

140
00:07:03,180 --> 00:07:04,733
‫Selalu dengan kata sandi yang sama.

141
00:07:07,390 --> 00:07:09,100
‫Saya akan memanggilnya

142
00:07:09,100 --> 00:07:13,273
‫Pengguna juga dan katakanlah peran di sini adalah panduan, jadi

143
00:07:14,520 --> 00:07:17,823
‫kami juga memiliki beberapa peran berbeda di sini.

144
00:07:19,040 --> 00:07:20,360
‫Berikan lebih banyak ruang.

145
00:07:20,360 --> 00:07:22,670
‫Dan sekarang, mari kita coba sebenarnya.

146
00:07:22,670 --> 00:07:25,500
‫Dan responnya seperti yang kami harapkan dengan perbedaan

147
00:07:25,500 --> 00:07:26,810
‫yang sekarang, kami

148
00:07:26,810 --> 00:07:30,190
‫mendapatkan satu cookie di sini di tab Cookie ini.

149
00:07:30,190 --> 00:07:32,160
‫Dan memang, di

150
00:07:32,160 --> 00:07:35,450
‫sini, kita mendapatkan nama cookie, nilainya.

151
00:07:35,450 --> 00:07:37,220
‫Kami juga memiliki tanggal

152
00:07:37,220 --> 00:07:40,160
‫kedaluwarsa, yaitu tepat 90 hari dari sekarang.

153
00:07:40,160 --> 00:07:44,913
‫Kami memiliki httpOnly disetel ke true dan juga, secure disetel ke false.

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

155
00:07:47,210 --> 00:07:49,970
‫Hebat, kami juga dapat melihat semua cookie yang kami miliki

156
00:07:49,970 --> 00:07:51,733
‫di sini di tab Cookie ini.

157
00:07:52,690 --> 00:07:55,480
‫Dan sekali lagi, kami melihat satu cookie yang

158
00:07:55,480 --> 00:07:57,673
‫kami terima dari domain ini, oke.

159
00:07:58,630 --> 00:08:01,540
‫Sekarang, hanya satu hal terakhir yang sebenarnya ingin

160
00:08:01,540 --> 00:08:04,130
‫saya ubah dalam fungsi yang baru saja

161
00:08:04,130 --> 00:08:05,313
‫kita kerjakan,

162
00:08:06,200 --> 00:08:10,660
‫jadi createSendToken, pada dasarnya menghilangkan kata sandi ini di sini di output.

163
00:08:10,660 --> 00:08:13,560
‫Oke, jadi dalam skema kami, kami sebenarnya

164
00:08:13,560 --> 00:08:16,510
‫mengaturnya untuk memilih salah, sehingga tidak muncul saat

165
00:08:16,510 --> 00:08:18,380
‫kami meminta semua pengguna.

166
00:08:18,380 --> 00:08:21,290
‫Tetapi dalam kasus ini, itu berasal dari pembuatan dokumen

167
00:08:21,290 --> 00:08:24,410
‫baru dan itu berbeda dan itulah mengapa kami melihatnya di sini.

168
00:08:24,410 --> 00:08:27,373
‫Oke, tapi sebenarnya kita bisa memperbaikinya dengan sangat mudah.

169
00:08:28,650 --> 00:08:31,850
‫Oke, jadi yang perlu kita lakukan sebenarnya adalah mengatur

170
00:08:33,660 --> 00:08:35,010
‫pengguna. kata

171
00:08:36,370 --> 00:08:37,563
‫sandi untuk tidak terdefinisi.

172
00:08:38,750 --> 00:08:40,590
‫Baiklah, dan itu

173
00:08:42,630 --> 00:08:43,920
‫harus menghapus

174
00:08:46,340 --> 00:08:48,490
‫kata sandi dari output.

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

176
00:08:49,630 --> 00:08:53,203
‫Jadi mari kita hapus saja pengguna ini di sini yang baru saja kita buat.

177
00:08:57,890 --> 00:08:59,850
‫Dan coba lagi

178
00:08:59,850 --> 00:09:04,010
‫hanya untuk melihat apakah kata sandi tidak muncul lagi.

179
00:09:04,010 --> 00:09:07,170
‫Dan ya, memang sekarang, itu hilang.

180
00:09:07,170 --> 00:09:09,820
‫Dan tetap saja, kue kami, tentu saja, ada di sini.

181
00:09:09,820 --> 00:09:12,450
‫Dan ketika kita sekarang sampai di sini ke tab

182
00:09:12,450 --> 00:09:14,710
‫Cookies, maka Anda masih memiliki hanya satu cookie

183
00:09:14,710 --> 00:09:17,430
‫karena yang lama sekarang pada dasarnya ditimpa oleh yang baru

184
00:09:17,430 --> 00:09:18,600
‫ini dan itu

185
00:09:18,600 --> 00:09:20,380
‫karena mereka memiliki nama yang sama.

186
00:09:20,380 --> 00:09:23,940
‫Jadi namanya seperti pengidentifikasi unik untuk cookie.

187
00:09:23,940 --> 00:09:26,160
‫Jadi jika kita menerima satu

188
00:09:26,160 --> 00:09:27,570
‫dengan nama yang

189
00:09:27,570 --> 00:09:30,683
‫sudah diberikan, ya, yang lama diganti saja.

190
00:09:31,720 --> 00:09:33,800
‫Oke, dan itu sebenarnya.

191
00:09:33,800 --> 00:09:36,737
‫Jadi beginilah cara kami mengirim cookie khusus HTTP dan sekali lagi,

192
00:09:36,737 --> 00:09:38,730
‫kami akan membicarakan lebih banyak tentang

193
00:09:38,730 --> 00:09:40,813
‫ini saat kami membangun situs web dinamis kami.