1 00:00:01,750 --> 00:00:05,683 ‫Ini adalah bagian kedua dari membangun fungsionalitas login kami. 2 00:00:07,280 --> 00:00:09,600 ‫Hal pertama yang ingin saya 3 00:00:09,600 --> 00:00:14,160 ‫lakukan dalam video ini adalah merender bagian halaman ini secara kondisional. 4 00:00:14,160 --> 00:00:16,390 ‫Jadi yang dimaksud adalah membuat 5 00:00:16,390 --> 00:00:18,570 ‫tombol masuk dan daftar ini 6 00:00:18,570 --> 00:00:21,010 ‫di sini jika pengguna tidak masuk, 7 00:00:21,010 --> 00:00:23,470 ‫dan jika pengguna benar-benar masuk dengan 8 00:00:23,470 --> 00:00:27,450 ‫baik, maka buat semacam menu pengguna di sini dan 9 00:00:27,450 --> 00:00:29,543 ‫juga tombol keluar. 10 00:00:30,720 --> 00:00:32,650 ‫Render semacam itu tentu saja 11 00:00:32,650 --> 00:00:36,720 ‫harus terjadi di bagian belakang, jadi di salah satu templat pug kami. 12 00:00:36,720 --> 00:00:39,420 ‫Sekarang, bagaimana template keluar benar-benar tahu apakah 13 00:00:39,420 --> 00:00:41,603 ‫pengguna masuk atau tidak? 14 00:00:42,510 --> 00:00:44,600 ‫Sebenarnya, untuk menentukan bahwa 15 00:00:44,600 --> 00:00:47,550 ‫kita harus membuat fungsi middleware baru, 16 00:00:47,550 --> 00:00:50,970 ‫dan satu-satunya tujuan dari fungsi middleware baru 17 00:00:50,970 --> 00:00:54,813 ‫ini adalah apakah pengguna sedang login atau tidak. 18 00:00:55,720 --> 00:00:58,790 ‫Anda mungkin berpikir bahwa middleware pelindung kami 19 00:00:58,790 --> 00:01:02,080 ‫juga melakukan hal serupa, dan sebenarnya, itu serupa. 20 00:01:02,080 --> 00:01:03,590 ‫Tapi bedanya yang 21 00:01:03,590 --> 00:01:07,720 ‫satu hanya berfungsi untuk batang yang dilindungi, jadi masuk akal kan? 22 00:01:07,720 --> 00:01:10,370 ‫Tetapi fungsi middleware baru kami akan 23 00:01:10,370 --> 00:01:14,003 ‫berjalan untuk setiap permintaan di situs web kami yang dirender. 24 00:01:17,060 --> 00:01:19,710 ‫Sekarang mari kita praktikkan di sini 25 00:01:19,710 --> 00:01:23,170 ‫di authController kita, dan karena ini sangat mirip dengan 26 00:01:23,170 --> 00:01:26,430 ‫rute proteksi atau middleware sebenarnya, saya akan melanjutkan 27 00:01:26,430 --> 00:01:29,450 ‫dan menyalin yang ini di sini dan kemudian 28 00:01:29,450 --> 00:01:31,483 ‫hanya melakukan beberapa modifikasi. 29 00:01:34,250 --> 00:01:37,240 ‫Jadi mari kita salin dan tempel di sini 30 00:01:37,240 --> 00:01:39,860 ‫dan yang ini akan disebut isLoggedIn. 31 00:01:43,210 --> 00:01:46,900 ‫Middleware ini benar-benar hanya untuk halaman yang dirender sehingga tujuannya 32 00:01:46,900 --> 00:01:50,510 ‫di sini bukan untuk melindungi rute apa pun sehingga tidak 33 00:01:50,510 --> 00:01:53,593 ‫akan pernah ada kesalahan di middleware ini. 34 00:01:55,200 --> 00:01:57,370 ‫Mari kita tulis dengan cepat 35 00:01:58,550 --> 00:02:03,550 ‫di sini hanya untuk halaman yang dirender, dan tidak akan ada kesalahan. 36 00:02:08,360 --> 00:02:11,560 ‫Token kami harus berasal dari cookie dan bukan 37 00:02:11,560 --> 00:02:13,640 ‫dari header otorisasi karena, 38 00:02:13,640 --> 00:02:16,230 ‫tentu saja, untuk halaman yang dirender, 39 00:02:16,230 --> 00:02:19,133 ‫kami tidak akan memiliki token di header. 40 00:02:20,050 --> 00:02:23,220 ‫Jadi sekali lagi, untuk seluruh situs web kami 41 00:02:23,220 --> 00:02:25,800 ‫yang dirender, token hanya akan selalu 42 00:02:25,800 --> 00:02:29,000 ‫dikirim menggunakan cookie, dan tidak pernah menggunakan header otorisasi. 43 00:02:29,000 --> 00:02:32,143 ‫Yang itu hanya untuk api. 44 00:02:33,070 --> 00:02:36,320 ‫Dan sebenarnya tidak perlu serumit ini, kita cukup 45 00:02:36,320 --> 00:02:38,790 ‫mengatakan untuk mengeksekusi semua kode 46 00:02:38,790 --> 00:02:42,030 ‫yang kita miliki di sini jika ada tokennya. 47 00:02:42,030 --> 00:02:46,083 ‫Atau sebenarnya, jika ada cookie yang disebut jwt pada dasarnya. 48 00:02:49,680 --> 00:02:54,460 ‫Jadi mari kita hapus semua ini dan taruh di sini. 49 00:02:54,460 --> 00:02:57,303 ‫Saya akan menghapus yang ini dan meletakkannya di akhir. 50 00:03:02,780 --> 00:03:04,373 ‫Dan kemudian memformat ulang itu. 51 00:03:08,630 --> 00:03:10,900 ‫Sekarang token ini di sini tidak ada, 52 00:03:10,900 --> 00:03:13,907 ‫itu hanya meminta cookie. jwt. 53 00:03:20,000 --> 00:03:22,743 ‫Jadi ini di sini memverifikasi token. 54 00:03:28,060 --> 00:03:31,320 ‫Kemudian kita juga perlu memeriksa apakah pengguna masih ada, dan 55 00:03:31,320 --> 00:03:33,290 ‫semuanya dari sini akan sangat 56 00:03:33,290 --> 00:03:36,513 ‫mirip dengan apa yang kita miliki sebelumnya dengan pengecualian 57 00:03:36,513 --> 00:03:39,533 ‫besar bahwa kita tidak akan membuat kesalahan baru. 58 00:03:41,500 --> 00:03:43,780 ‫Kami hanya akan beralih ke middleware berikutnya, tetapi 59 00:03:43,780 --> 00:03:45,123 ‫tidak akan terjadi apa-apa. 60 00:03:47,540 --> 00:03:49,530 ‫Kemudian kami juga ingin memeriksa 61 00:03:49,530 --> 00:03:51,910 ‫apakah pengguna baru saja mengubah kata sandi mereka. 62 00:03:51,910 --> 00:03:55,113 ‫Dan lagi, begitu, maka tidak ada kesalahan. 63 00:03:56,210 --> 00:03:58,410 ‫Nah, di sini pada akhirnya apa yang 64 00:03:58,410 --> 00:04:00,420 ‫akan terjadi jika semua ini 65 00:04:00,420 --> 00:04:03,920 ‫di sini benar, jadi jika token diverifikasi, jika pengguna masih ada, 66 00:04:03,920 --> 00:04:06,400 ‫dan jika mereka tidak mengubah kata sandi mereka, 67 00:04:06,400 --> 00:04:09,673 ‫nah, dalam hal ini berarti ada adalah pengguna yang masuk. 68 00:04:11,800 --> 00:04:12,713 ‫Letakkan itu di sini. 69 00:04:17,810 --> 00:04:20,440 ‫Jadi ada pengguna yang masuk. 70 00:04:20,440 --> 00:04:22,130 ‫Apa yang ingin kami lakukan 71 00:04:22,130 --> 00:04:25,320 ‫dalam hal ini adalah membuat pengguna tersebut dapat mengakses template kami. 72 00:04:25,320 --> 00:04:26,950 ‫Dan bagaimana kita bisa melakukannya? 73 00:04:26,950 --> 00:04:29,960 ‫Sebenarnya itu adalah sesuatu yang tidak kami lakukan sebelumnya 74 00:04:29,960 --> 00:04:33,283 ‫dan sekarang ini adalah tempat yang bagus untuk benar-benar mempelajarinya. 75 00:04:34,970 --> 00:04:38,340 ‫Kita bisa melakukan respon. penduduk setempat dan kemudian 76 00:04:38,340 --> 00:04:40,500 ‫masukkan variabel apa pun di sana. 77 00:04:40,500 --> 00:04:43,650 ‫Dan template pug kami kemudian akan mendapatkan akses ke sana. 78 00:04:43,650 --> 00:04:46,920 ‫Jadi jika saya mengatakan tanggapan. penduduk setempat. user, maka 79 00:04:46,920 --> 00:04:49,000 ‫di dalam template akan ada 80 00:04:49,000 --> 00:04:50,963 ‫variabel yang disebut user. 81 00:04:52,320 --> 00:04:55,060 ‫Jadi sekali lagi, setiap template pug akan 82 00:04:55,060 --> 00:04:59,410 ‫memiliki akses ke response . locals dan apa pun 83 00:04:59,410 --> 00:05:02,060 ‫yang kita letakkan di sana akan menjadi 84 00:05:02,060 --> 00:05:04,300 ‫variabel di dalam template ini. 85 00:05:04,300 --> 00:05:07,350 ‫Jadi ini seperti melewatkan data ke dalam template 86 00:05:07,350 --> 00:05:08,713 ‫menggunakan fungsi render. 87 00:05:11,870 --> 00:05:14,400 ‫Yang ini tidak lagi kami perlukan, karena kami akan menempatkan 88 00:05:14,400 --> 00:05:17,593 ‫pengguna saat ini sebagai respons . penduduk setempat. 89 00:05:20,710 --> 00:05:24,450 ‫Dan tentu saja, setelah itu middleware berikutnya dipanggil. 90 00:05:24,450 --> 00:05:27,833 ‫Dan kita juga perlu melakukan itu di luar ini 91 00:05:30,930 --> 00:05:32,660 ‫Jika, jadi jika tidak 92 00:05:32,660 --> 00:05:34,180 ‫ada cookie 93 00:05:34,180 --> 00:05:35,900 ‫maka tentu saja middleware 94 00:05:35,900 --> 00:05:38,380 ‫berikutnya akan segera dipanggil, karena tentu 95 00:05:38,380 --> 00:05:41,010 ‫saja tidak mungkin ada pengguna yang login. 96 00:05:41,010 --> 00:05:44,260 ‫Jadi sekali lagi, jika tidak ada cookie, maka tidak 97 00:05:44,260 --> 00:05:46,170 ‫ada pengguna yang login. 98 00:05:46,170 --> 00:05:49,050 ‫Dan selanjutnya segera, dan kami tidak akan memberikan respons 99 00:05:49,050 --> 00:05:52,283 ‫kepada pengguna saat ini. penduduk setempat. 100 00:05:53,410 --> 00:05:55,240 ‫Tapi jika ada cookie, 101 00:05:55,240 --> 00:05:58,180 ‫yah, lalu kita melalui semua langkah verifikasi ini 102 00:05:58,180 --> 00:06:00,400 ‫dan pada akhirnya jika tidak ada 103 00:06:00,400 --> 00:06:02,530 ‫yang memanggil middleware berikutnya di tumpukan 104 00:06:02,530 --> 00:06:05,620 ‫dengan baik, maka itu berarti ada pengguna yang masuk. 105 00:06:05,620 --> 00:06:09,510 ‫Oleh karena itu, kami menempatkan pengguna tersebut sebagai respons . locals, dan seperti itu, kami 106 00:06:09,510 --> 00:06:12,190 ‫kemudian memiliki akses ke pengguna itu di 107 00:06:12,190 --> 00:06:13,573 ‫template pug kami. 108 00:06:15,090 --> 00:06:19,230 ‫Misalnya, di sini di tajuk yang sebenarnya 109 00:06:19,230 --> 00:06:22,493 ‫merupakan tempat navigasi pengguna itu. 110 00:06:23,810 --> 00:06:25,990 ‫Jadi mari kita benar-benar menggunakannya di 111 00:06:25,990 --> 00:06:29,380 ‫sini sebentar lagi, tetapi sebelum kita melakukannya tentu saja juga membutuhkan 112 00:06:29,380 --> 00:06:31,733 ‫middleware baru yang baru saja kita buat. 113 00:06:32,950 --> 00:06:35,563 ‫Jadi mari datang ke sini untuk melihat rute, dan 114 00:06:37,320 --> 00:06:39,210 ‫seperti yang saya katakan di 115 00:06:39,210 --> 00:06:41,240 ‫awal, kami ingin middleware ini diterapkan 116 00:06:41,240 --> 00:06:43,710 ‫ke setiap rute yang kami miliki di sini. 117 00:06:43,710 --> 00:06:45,840 ‫Jadi kami melakukannya sedikit seperti 118 00:06:45,840 --> 00:06:48,210 ‫yang kami lakukan sebelumnya dengan melindungi middleware. 119 00:06:48,210 --> 00:06:51,330 ‫Jadi pada dasarnya meletakkannya di sini sebelum semua rute lainnya. 120 00:06:51,330 --> 00:06:54,020 ‫Dan kemudian itu akan dimasukkan ke dalam tumpukan 121 00:06:54,020 --> 00:06:56,403 ‫middleware untuk setiap permintaan yang masuk. 122 00:06:57,820 --> 00:07:02,820 ‫Jadi router. gunakan, authController. Apakah sudah masuk. 123 00:07:07,250 --> 00:07:10,140 ‫Dan mari kita juga menghapus perlindungan ini 124 00:07:10,140 --> 00:07:12,180 ‫dari halaman detail tur 125 00:07:12,180 --> 00:07:14,803 ‫karena itu sebenarnya tidak masuk akal. 126 00:07:15,690 --> 00:07:18,433 ‫Jadi sekarang kita benar-benar siap untuk menggunakan ini. 127 00:07:19,290 --> 00:07:23,103 ‫Jadi mari kita datang ke sini ke header kita dan menggunakan conditional. 128 00:07:24,420 --> 00:07:25,500 ‫Sekarang ingat 129 00:07:25,500 --> 00:07:29,260 ‫bagaimana saya katakan sebelumnya bahwa conditional di pug tidak terlalu 130 00:07:29,260 --> 00:07:32,570 ‫kuat dan sering kali kita benar-benar menggunakan Java Script. 131 00:07:32,570 --> 00:07:34,340 ‫Tetapi untuk apa yang ingin 132 00:07:34,340 --> 00:07:36,270 ‫kami lakukan sekarang, mereka sebenarnya cukup baik. 133 00:07:36,270 --> 00:07:40,793 ‫Jadi yang ingin kami lakukan sekarang adalah mengatakan jika pengguna. 134 00:07:42,020 --> 00:07:46,980 ‫Dan untuk itu, mereka berfungsi dengan baik untuk hal-hal yang sangat sederhana hanya 135 00:07:46,980 --> 00:07:50,063 ‫untuk menguji apakah suatu variabel ada atau tidak. 136 00:07:52,273 --> 00:07:56,380 ‫Jadi jika ada pengguna maka kita ingin menampilkan ini apa yang kita 137 00:07:56,380 --> 00:07:59,853 ‫miliki di sini, jadi mari kita taruh itu di sana. 138 00:08:00,940 --> 00:08:02,433 ‫Jadi saya menyalinnya di 139 00:08:05,000 --> 00:08:06,410 ‫sini, mengomentari 140 00:08:09,150 --> 00:08:13,560 ‫kode ini dan kemudian di sini, kami mengatakan yang lain. 141 00:08:13,560 --> 00:08:17,670 ‫Jadi seperti di Java Script kita bisa mengatakan if, else. 142 00:08:17,670 --> 00:08:20,300 ‫Lalu di sini, saya sebenarnya tidak ingin 143 00:08:20,300 --> 00:08:22,580 ‫memesan, tetapi saya ingin logout. 144 00:08:22,580 --> 00:08:24,173 ‫Saya tidak yakin mengapa itu ada. 145 00:08:25,490 --> 00:08:29,000 ‫Jadi itu logout, dan juga memiliki kelas khusus yang 146 00:08:29,980 --> 00:08:33,313 ‫saya buat agar terlihat istimewa di CSS. 147 00:08:34,180 --> 00:08:39,180 ‫Jadi nav, el, dan kemudian dengan pengubah, logout, dan mari kita 148 00:08:40,860 --> 00:08:44,713 ‫juga menghapus atribut href ini dari sana. 149 00:08:47,270 --> 00:08:49,743 ‫Kemudian di sini, kami ingin 150 00:08:53,010 --> 00:08:57,040 ‫nama pengguna, jadi pengguna. nama, dan sebenarnya kami hanya ingin nama depan. 151 00:08:57,040 --> 00:08:59,990 ‫Jadi misalnya saya membuat akun bernama 152 00:08:59,990 --> 00:09:04,650 ‫Jonas Schmedtmann, jadi seperti ini maka saya hanya ingin menampilkan 153 00:09:04,650 --> 00:09:07,293 ‫bagian Jonas di sini. 154 00:09:08,530 --> 00:09:11,810 ‫Jadi mari kita pisahkan nama menggunakan spasi dan 155 00:09:11,810 --> 00:09:14,030 ‫kemudian hanya menampilkan elemen pertama dari 156 00:09:14,030 --> 00:09:15,623 ‫array yang dihasilkan. 157 00:09:18,330 --> 00:09:21,280 ‫Ingat disini kita cukup menggunakan Java Script seperti ini. 158 00:09:22,610 --> 00:09:26,513 ‫Pisahkan dengan spasi, lalu hanya elemen pertama. 159 00:09:28,330 --> 00:09:31,593 ‫Kemudian di sini tentu kita juga menginginkan 160 00:09:33,430 --> 00:09:37,300 ‫gambar itu, jadi itu gambar /pengguna, ingat, setidaknya saya 161 00:09:37,300 --> 00:09:38,313 ‫percaya. 162 00:09:41,930 --> 00:09:43,377 ‫Jadi, ini dia, pengguna. 163 00:09:46,660 --> 00:09:49,683 ‫Dan kemudian apa pun yang berasal dari database kami. 164 00:09:53,220 --> 00:09:56,747 ‫Jadi pengguna. foto, dan kemudian 165 00:09:56,747 --> 00:10:00,880 ‫kami juga dapat memberikan teks alternatif yang bagus 166 00:10:00,880 --> 00:10:03,737 ‫yang sangat penting untuk aksesibilitas. 167 00:10:03,737 --> 00:10:05,723 ‫Mari kita dapatkan di sini. 168 00:10:12,070 --> 00:10:14,040 ‫Jadi, mari kita uji ini 169 00:10:14,040 --> 00:10:18,113 ‫sekarang, karena saya sebenarnya sangat penasaran untuk melihat apakah ini berhasil. 170 00:10:19,780 --> 00:10:22,180 ‫Jadi seperti sebelumnya, izinkan saya melanjutkan dan 171 00:10:22,180 --> 00:10:24,393 ‫benar-benar menghapus cookie di sini. 172 00:10:25,610 --> 00:10:28,900 ‫Saya tidak yakin apa yang dilakukan penyimpanan lokal ini di sini sekarang. 173 00:10:28,900 --> 00:10:33,163 ‫Mari kita hapus itu juga, dan cookie ini juga. 174 00:10:35,030 --> 00:10:38,460 ‫Jadi mari kita kembali untuk login di sini, dan 175 00:10:38,460 --> 00:10:40,903 ‫sekarang saya harus mengetik ulang ini. tes io, satu, dua, tiga, empat. 176 00:10:44,217 --> 00:10:48,260 ‫Langsung saja kita salin disini, login, dan 177 00:10:48,260 --> 00:10:50,940 ‫memang kita berhasil login. 178 00:10:50,940 --> 00:10:55,420 ‫Jadi, kami mendapatkan kue kami sekarang, ini dia. 179 00:10:55,420 --> 00:10:59,040 ‫Tetapi tentu saja foto dan nama pengguna kami tidak langsung 180 00:10:59,040 --> 00:11:01,820 ‫ditampilkan di sini, dan itu tentu saja 181 00:11:01,820 --> 00:11:04,470 ‫karena ini hanya dapat terjadi setelah 182 00:11:04,470 --> 00:11:06,210 ‫memuat ulang, karena 183 00:11:06,210 --> 00:11:08,450 ‫itu mengungkapkan siapa yang merender halaman 184 00:11:08,450 --> 00:11:11,470 ‫ini, jadi ada semacam kebutuhan untuk memuat ulang. 185 00:11:11,470 --> 00:11:13,443 ‫Jadi mari kita terapkan itu sebentar lagi, tapi 186 00:11:15,120 --> 00:11:17,460 ‫untuk sekarang mari kita lihat apakah kita sekarang sudah login. 187 00:11:17,460 --> 00:11:22,160 ‫Jadi mari kita pergi ke semua tur di sini, dan sekarang 188 00:11:22,160 --> 00:11:25,400 ‫kita mendapatkan kesalahan ini di sini. 189 00:11:25,400 --> 00:11:28,180 ‫Coba muat ulang di sini. 190 00:11:28,180 --> 00:11:29,373 ‫Yah, katanya tidak dapat menemukannya di server. 191 00:11:30,490 --> 00:11:33,630 ‫Apa yang terjadi jika kita memuat ulang di sini? 192 00:11:33,630 --> 00:11:35,633 ‫Nah, yang ini berfungsi, dan Anda melihat 193 00:11:37,400 --> 00:11:39,936 ‫bahwa sebenarnya menu pengguna kami sudah ada di sini. 194 00:11:39,936 --> 00:11:42,910 ‫Jadi kami mendapatkan tombol dan gambar 195 00:11:42,910 --> 00:11:46,220 ‫logout kami, dan tentu saja nama saya. 196 00:11:46,220 --> 00:11:48,490 ‫Besar. 197 00:11:48,490 --> 00:11:49,870 ‫Sekarang mari kita 198 00:11:49,870 --> 00:11:51,890 ‫coba logout dengan menghapus cookie ini. 199 00:11:51,890 --> 00:11:53,670 ‫Dan di video berikutnya kami 200 00:11:53,670 --> 00:11:55,900 ‫akan benar-benar menerapkan fungsi yang tepat ini. 201 00:11:55,900 --> 00:11:57,433 ‫Dan jika kita memuat ulang sekarang maka itu kembali, bagus! 202 00:11:59,530 --> 00:12:03,160 ‫Jadi fungsi middleware yang baru saja kita 203 00:12:03,160 --> 00:12:05,840 ‫buat sebelumnya benar-benar melakukan tugasnya. 204 00:12:05,840 --> 00:12:07,663 ‫Mari kita masuk 205 00:12:08,500 --> 00:12:12,440 ‫sebagai orang lain di sini, jadi katakanlah Laura, baiklah. 206 00:12:12,440 --> 00:12:15,713 ‫Jadi Laura, dan daripada dengan tes kata 207 00:12:17,870 --> 00:12:20,930 ‫sandi yang sama satu dua tiga 208 00:12:20,930 --> 00:12:25,190 ‫empat, masuk, tidak apa-apa, muat ulang, dan itu dia. 209 00:12:25,190 --> 00:12:29,690 ‫Jadi ini bekerja dengan sangat baik. 210 00:12:29,690 --> 00:12:31,680 ‫Saya hanya khawatir tentang kesalahan ini, 211 00:12:31,680 --> 00:12:33,900 ‫jadi sebelum kita melakukan hal lain, kita 212 00:12:33,900 --> 00:12:35,580 ‫harus benar-benar memperbaiki yang ini. 213 00:12:35,580 --> 00:12:37,890 ‫Dan karena kesalahan ini hanya 214 00:12:37,890 --> 00:12:40,000 ‫dimulai setelah kita mulai 215 00:12:40,000 --> 00:12:43,060 ‫menggunakan middleware baru ini, mari kita pastikan, lihat 216 00:12:43,060 --> 00:12:45,520 ‫apakah itu ada hubungannya dengan itu. 217 00:12:45,520 --> 00:12:47,020 ‫Jadi jika kita menghapus 218 00:12:48,110 --> 00:12:50,530 ‫middleware ini, mari kita lihat apakah ini berfungsi kembali. 219 00:12:50,530 --> 00:12:52,853 ‫Dan ya, sekarang. 220 00:12:54,860 --> 00:12:56,570 ‫Jadi itu agak aneh memang. 221 00:12:56,570 --> 00:12:58,253 ‫Mari kita lihat apakah 222 00:12:59,218 --> 00:13:02,790 ‫kita dapat menemukan beberapa bug di fungsi middleware ini. 223 00:13:02,790 --> 00:13:05,023 ‫Apa yang saya lihat di sini 224 00:13:09,560 --> 00:13:13,890 ‫segera adalah bahwa kami selalu kembali setiap kali kami menelepon berikutnya, tetapi 225 00:13:13,890 --> 00:13:15,760 ‫di sini kami tidak. 226 00:13:15,760 --> 00:13:18,360 ‫Jadi itu berarti bahwa jika kita 227 00:13:18,360 --> 00:13:22,540 ‫memasuki blok ini di sini, middleware berikutnya akan dipanggil, 228 00:13:22,540 --> 00:13:24,490 ‫tetapi kemudian middleware 229 00:13:24,490 --> 00:13:27,060 ‫berikutnya akan dipanggil lagi setelah itu. 230 00:13:27,060 --> 00:13:28,633 ‫Jadi kita mungkin perlu mengembalikan yang ini ke sini juga. 231 00:13:30,630 --> 00:13:34,823 ‫Tapi ini kami pastikan selanjutnya hanya dipanggil sekali. 232 00:13:36,040 --> 00:13:40,223 ‫Jadi mari kita coba, pasang yang ini kembali, 233 00:13:41,670 --> 00:13:45,430 ‫simpan, gulir ke bawah di sini. 234 00:13:45,430 --> 00:13:48,713 ‫Ya, itu berhasil sekarang. 235 00:13:53,460 --> 00:13:54,510 ‫Jadi kami 236 00:13:55,840 --> 00:13:59,490 ‫mendapatkan pengguna yang masuk di sini juga sekarang, dan tentu saja 237 00:13:59,490 --> 00:14:03,610 ‫jika kami menghapus cookie yang pada dasarnya mengeluarkan pengguna, memuat ulang ini 238 00:14:03,610 --> 00:14:05,330 ‫sekarang, maka kami kembali normal. 239 00:14:05,330 --> 00:14:09,283 ‫Selanjutnya apa yang ingin kami perbaiki di sini adalah untuk benar-benar 240 00:14:12,366 --> 00:14:14,430 ‫mendapatkan peringatan di sini, dan 241 00:14:14,430 --> 00:14:16,930 ‫juga memuat ulang halaman setelah beberapa waktu. 242 00:14:16,930 --> 00:14:20,133 ‫Sebenarnya tidak memuat ulang, tetapi mengirimnya 243 00:14:21,620 --> 00:14:23,400 ‫kembali ke beranda. 244 00:14:23,400 --> 00:14:26,343 ‫Jadi sekarang ini sudah hilang, dan seperti yang saya 245 00:14:28,570 --> 00:14:30,410 ‫katakan sebelumnya kita hanya pernah 246 00:14:30,410 --> 00:14:33,330 ‫melihat menu pengguna itu ketika kita memuat ulang halaman. 247 00:14:33,330 --> 00:14:36,230 ‫Jadi itulah yang akan kita lakukan sekarang secara otomatis 248 00:14:36,230 --> 00:14:38,800 ‫dalam kode Java Script kita di sini. 249 00:14:38,800 --> 00:14:40,293 ‫Jadi mari kita, pertama-tama, singkirkan data ini di sini. 250 00:14:41,882 --> 00:14:45,280 ‫Mencatat data sensitif ke konsol bukanlah ide yang baik, dan 251 00:14:46,350 --> 00:14:48,340 ‫sekarang mari kita lakukan apa yang 252 00:14:48,340 --> 00:14:50,140 ‫baru saja saya katakan sebelumnya. 253 00:14:50,140 --> 00:14:53,403 ‫Jadi di sini kami melakukan permintaan, dan tentu saja 254 00:14:54,250 --> 00:14:58,220 ‫saya juga akan menunjukkan kepada Anda bagaimana kami dapat mengirim data langsung 255 00:14:58,220 --> 00:15:01,220 ‫dari formulir htl ke dalam aplikasi Catatan kami. 256 00:15:01,220 --> 00:15:04,503 ‫Ada dua cara. 257 00:15:06,430 --> 00:15:07,410 ‫Salah satu caranya adalah mengirim 258 00:15:07,410 --> 00:15:09,260 ‫data menggunakan permintaan http seperti yang kami lakukan di sini. 259 00:15:09,260 --> 00:15:11,750 ‫Dan satu lagi adalah dengan langsung menggunakan formulir html. 260 00:15:11,750 --> 00:15:15,940 ‫Dan yang satu itu juga sangat penting, dan nanti 261 00:15:15,940 --> 00:15:17,960 ‫di bagian ini saya 262 00:15:17,960 --> 00:15:21,130 ‫akan menunjukkan kepada Anda bagaimana melakukannya juga. 263 00:15:21,130 --> 00:15:23,090 ‫Bagaimanapun, sekarang mari kita tunjukkan peringatan itu dan muat ulang halaman. 264 00:15:23,090 --> 00:15:27,200 ‫Mari kita lakukan itu jika kita benar-benar yakin 265 00:15:27,200 --> 00:15:30,320 ‫bahwa panggilan api kita berhasil. 266 00:15:30,320 --> 00:15:32,870 ‫Katakanlah tanggapan. data, dan data itu sebenarnya adalah 267 00:15:32,870 --> 00:15:36,290 ‫data yang kami 268 00:15:36,290 --> 00:15:38,600 ‫kirim sebagai respons hari kami, dan 269 00:15:38,600 --> 00:15:41,220 ‫dari sana kami dapat membaca . status, dan periksa apakah itu 270 00:15:41,220 --> 00:15:44,693 ‫sama dengan sukses. 271 00:15:44,693 --> 00:15:47,483 ‫Jadi, ingat bagaimana kami selalu mengatur 272 00:15:50,439 --> 00:15:53,920 ‫status menjadi sukses, dan sekarang kami benar-benar dapat menggunakannya 273 00:15:53,920 --> 00:15:55,900 ‫untuk melakukan verifikasi ini. 274 00:15:55,900 --> 00:15:58,093 ‫Jadi mari kita gunakan lansiran Java 275 00:15:59,038 --> 00:16:02,147 ‫Script sederhana, lansiran seperti ini, dan katakan berhasil masuk. 276 00:16:02,147 --> 00:16:07,147 ‫Mari kita singkirkan ini, dan juga mari setelah 277 00:16:14,120 --> 00:16:17,950 ‫satu setengah detik memuat halaman depan. 278 00:16:17,950 --> 00:16:21,330 ‫Jadi pada dasarnya, halaman rumah. 279 00:16:21,330 --> 00:16:22,730 ‫Jadi, jendela. setTimeout, lalu di 280 00:16:23,640 --> 00:16:28,640 ‫sini fungsi panggilan balik, dan untuk memuat 281 00:16:31,100 --> 00:16:33,400 ‫halaman lain kita katakan location . assign, lalu kita langsung saja masuk ke 282 00:16:33,400 --> 00:16:36,633 ‫halaman home seperti ini. 283 00:16:37,700 --> 00:16:41,563 ‫Dan kami ingin melakukannya setelah 1500 284 00:16:43,690 --> 00:16:47,120 ‫milidetik, jadi, satu setengah detik. 285 00:16:47,120 --> 00:16:49,023 ‫Kemudian jika kami 286 00:16:49,990 --> 00:16:52,780 ‫tidak berhasil, kami sebenarnya tidak 287 00:16:52,780 --> 00:16:55,950 ‫ingin mencatat ini, tetapi kami ingin mengingatkannya. 288 00:16:55,950 --> 00:16:57,553 ‫Jadi waspada, dan sekali 289 00:16:59,600 --> 00:17:02,350 ‫lagi data ini sebenarnya adalah respons data kami. 290 00:17:02,350 --> 00:17:04,533 ‫Jadi dari sini mari kita baca properti pesan. 291 00:17:05,793 --> 00:17:08,403 ‫Itu seharusnya berhasil, mari kita muat ulang di sini. 292 00:17:14,680 --> 00:17:17,313 ‫Oke, itu bukan orang yang tepat. 293 00:17:19,930 --> 00:17:21,853 ‫Jadi, bukannya admin di natours. io, uji satu 294 00:17:22,830 --> 00:17:27,413 ‫dua tiga empat lima, 295 00:17:29,230 --> 00:17:31,770 ‫untuk melihat kesalahannya terlebih dahulu. 296 00:17:31,770 --> 00:17:34,270 ‫Dan begitulah, email atau kata 297 00:17:34,270 --> 00:17:37,490 ‫sandi salah, dan tentu saja itu karena 298 00:17:37,490 --> 00:17:40,783 ‫kata sandi kita salah, jadi mari kita singkirkan 299 00:17:41,960 --> 00:17:44,750 ‫itu, login, dan login dengan sukses. 300 00:17:44,750 --> 00:17:46,630 ‫Sekarang mari kita lihat apa yang terjadi. 301 00:17:46,630 --> 00:17:48,710 ‫Dan itu sebenarnya tidak memuat ulang 302 00:17:48,710 --> 00:17:51,310 ‫secara otomatis, karena sebelum itu terjadi kita 303 00:17:51,310 --> 00:17:52,970 ‫perlu menutup jendela ini. 304 00:17:52,970 --> 00:17:54,700 ‫Jadi begitu kita menutupnya maka harus segera melakukan reload. 305 00:17:54,700 --> 00:17:57,963 ‫Dan begitulah. 306 00:18:00,690 --> 00:18:01,973 ‫Kami sekarang berada di halaman 307 00:18:02,950 --> 00:18:05,810 ‫beranda, dan sekali lagi dengan menu pengguna yang benar dirender di sini, sempurna. 308 00:18:05,810 --> 00:18:10,213 ‫Jadi bagian ini selesai juga, dan sekarang sebagai langkah 309 00:18:11,990 --> 00:18:14,530 ‫terakhir saya ingin meningkatkan peringatan 310 00:18:14,530 --> 00:18:17,020 ‫yang didapat pengguna ini. 311 00:18:17,020 --> 00:18:19,060 ‫Alih-alih menampilkan peringatan Skrip Java bawaan ini. 312 00:18:19,060 --> 00:18:22,333 ‫Juga, kita akan melakukan bundling Java Script yang telah 313 00:18:23,230 --> 00:18:26,050 ‫saya sebutkan beberapa kali, tapi kita akan 314 00:18:26,050 --> 00:18:28,490 ‫meninggalkan semua itu untuk video berikutnya 315 00:18:28,490 --> 00:18:31,320 ‫karena saya tidak ingin membebani masing-masing terlalu banyak.