Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Code
  2. Node.js
Code

Otentikasi Node.js aplikasi dengan Passport

by
Difficulty:IntermediateLength:LongLanguages:

Indonesian (Bahasa Indonesia) translation by Dendi Deden (you can also view the original English article)

Menerapkan strategi otentikasi kuat untuk aplikasi apapun dapat tugas yang menakutkan dan Node.js aplikasi tidak terkecuali untuk ini.

Dalam tutorial ini, kami akan mengembangkan aplikasi Node.js dari awal dan menggunakan otentikasi yang relatif baru namun sangat populer middleware - Passport untuk mengurus kekhawatiran otentikasi kami.

Passport's dokumentasi menggambarkannya sebagai "otentikasi sederhana, tidak mengganggu middleware untuk Node" dan memang demikian.

Dengan memberikan dirinya sendiri sebagai middleware, Passport melakukan pekerjaan yang sangat baik di memisahkan kekhawatiran lain aplikasi web dari kebutuhannya otentikasi. Hal ini memungkinkan Passport untuk dikonfigurasi dengan mudah ke dalam setiap aplikasi web berbasis Express, seperti kita mengkonfigurasi middleware Express lain seperti loggin, body-parsing, cookie-parsing, session-handling, dll.

Tutorial ini mengasumsikan pemahaman dasar Frameowork Node.js dan Express dan mencoba untuk tetap fokus pada otentikasi, meskipun kita membuat sebuah contoh Express aplikasi dari awal dan progress melalui menambahkan route dan otentikasi beberapa route tersebut.

Strategi otentikasi

Passport menyediakan kami dengan 140 + mekanisme otentikasi untuk dipilih. Anda dapat mengotentikasi terhadap contoh database lokal/remote atau menggunakan single sign-on menggunakan penyedia OAuth untuk Facebook, Twitter, Google, dll untuk mengotentikasi dengan account media sosial, atau di Anda dapat memilih dari daftar ekstensif penyedia yang mendukung otentikasi dengan passport dan menyediakan node module untuk itu.

Tetapi jangan khawatir: Anda tidak perlu untuk memasukkan strategi/mekanisme yang aplikasi Anda tidak perlu. Semua strategi ini independen satu sama lain dan dikemas sebagai modul terpisah node yang tidak disertakan secara default ketika Anda menginstal Passport middleware: npm install passport

Dalam tutorial ini, kita akan menggunakan strategi otentikasi lokal passport dan mengotentikasi pengguna terhadap sebuah lokal dikonfigurasi Mongo DB misalnya, menyimpan rincian pengguna dalam database. Untuk menggunakan strategi otentikasi lokal, kita perlu menginstal modul passport-local: npm install passport-local

Tapi tunggu: sebelum Anda jalankan terminal dan mulai menjalankan perintah ini, mari kita mulai dengan membangun sebuah aplikasi Express dari awal dan menambahkan beberapa route untuk itu (untuk login, pendaftaran dan rumah) dan kemudian mencoba untuk menambah middleware otentikasi kami untuk itu. Perhatikan bahwa kita akan menggunakan Express 4 untuk tujuan dari tutorial ini, tetapi dengan beberapa perbedaan kecil passort bekerja sama baik dengan Express 3, juga.

Pengaturan aplikasi

Jika Anda belum melakukannya, kemudian pergi ke depan dan menginstal Express & express-generator untuk menghasilkan sebuah aplikasi boilerplate dengan hanya menjalankan express passport-mongo di terminal. Struktur aplikasi yang dihasilkan akan terlihat seperti ini:

Initial Application Structure

Mari kita menghapus beberapa fungsi standar yang kita tidak dipakai - pergi ke depan dan menghapus route users.js dan menghapus referensi yang dari app.js file.

Menambahkan proyek dependensi

Buka package.json dan menambahkan dependensi untuk passport dan passport-local.

Karena kami akan menyimpan user detail dalam MongoDB, kita akan menggunakan Mongoose sebagai objek data modeling tool. Cara lain untuk memasang dan menyimpan ketergantungan untuk package.json adalah dengan memasukkan:

package.JSON akan terlihat seperti ini:

Added Mongoose Dependencies

Sekarang, Instal semua dependensi dan jalankan aplikasi boilerplate dengan mengeksekusi npm install && npm start,. Itu sekarang akan men-download dan Instal semua dependensi dan akan memulai node server. Anda dapat memeriksa aplikasi Express di http://localhost:3000/ tapi tidak ada banyak yang bisa dilihat.

Segera, kita akan mengubah bahwa dengan menciptakan sebuah aplikasi ex[ress yang meminta untuk menunjukkan halaman pendaftaran untuk pengguna baru, login pengguna terdaftar, dan mengotentikasi pengguna terdaftar dengan menggunakan Passport.

Membuat Model Mongoose

Karena kami akan menyimpan user detail dalam Mongo, mari kita membuat User Model di Mongoose dan menyimpan itu di models/user.js di aplikasi kita.

Pada dasarnya, kami menciptakan sebuah model Mongoose yang menggunakan yang kita dapat melakukan operasi CRUD pada database yang digunakan.

Mengkonfigurasi Mongo

Jika Anda tidak memiliki Mongo terinstal secara lokal maka kami sarankan bahwa Anda menggunakan layanan database cloud seperti Modulus atau MongoLab. Membuat MongoDB instance menggunakan ini tidak hanya gratis tapi hanya beberapa klik.

Setelah Anda membuat sebuah database di salah satu layanan ini, itu akan memberi Anda database URI like mongodb:/ /<dbuser>:<dbpassword>@novus.modulusmongo.net:27017/<dbName> yang dapat digunakan untuk melakukan operasi CRUD pada database. Ini adalah ide yang baik untuk menjaga konfigurasi database dalam file terpisah yang dapat menjadi pull up sebagai dan bila diperlukan. Dengan demikian, kita membuat db.js modul node yang terlihat seperti:

Jika Anda seperti saya, Anda menggunakan sebuah instance Mongo lokal maka saatnya untuk memulai mongod daemon dan db.js akan terlihat seperti

Sekarang kita menggunakan konfigurasi ini di app.js dan menyambung menggunakan Mongoose API:

Mengkonfigurasi Passport

Passport hanya menyediakan mekanisme untuk menangani otentikasi meninggalkan tanggung jawab pelaksanaan session-handling diri kita sendiri dan untuk itu kami akan menggunakan express-session. Buka app.js dan paste kode di bawah ini sebelum mengkonfigurasi route:


Hal ini diperlukan seperti yang kita inginkan session pengguna kami menjadi persistent secara alami. Sebelum menjalankan aplikasi, kita perlu menginstal express-session dan menambahkannya ke daftar ketergantungan kami di package.json. Untuk melakukan itu ketik npm instasll --save express-session

Serializing dan Deserializing User Instance

Passport juga perlu cerita serialize dan deserialize instance user dari session store untuk mendukung session login, sehingga setiap permintaan berikutnya tidak akan berisi kredensial pengguna. Ini menyediakan dua metode serializeUser dan deserializeUser untuk tujuan ini:

Menggunakan Passport Strategi

Kita sekarang akan mendefinisikan strategi passport untuk menangani login dan pendaftaran. Masing-masing akan menjadi contoh strategi otentikasi lokal passport dan akan dibuat dengan menggunakan passport.use() fungsi. Kami menggunakan connect-flash untuk membantu kami dengan penanganan dengan menyediakan pesan flash yang dapat ditampilkan kepada pengguna pada kesalahan.

Login Strategi

Strategi login yang terlihat seperti ini:

Parameter pertama ke passport.use() adalah nama dari strategi yang akan digunakan untuk mengidentifikasi strategi ini bila diterapkan kemudian. Parameter kedua adalah jenis strategi yang Anda ingin membuat, di sini kita menggunakan username-password atau LocalStrategy. Hal ini untuk dicatat bahwa secara default LocalStrategy mengharapkan untuk menemukan kredensial pengguna dalam parameter username & password, tetapi hal ini memungkinkan kita untuk menggunakan nama parameter lain juga. passReqToCallback variabel konfigurasi memungkinkan kita untuk mengakses objek request di callback, sehingga memungkinkan kita untuk menggunakan setiap parameter yang terkait dengan permintaan.

Selanjutnya, kami menggunakan API Mongoose untuk menemukan pengguna dalam koleksi kami mendasari pengguna untuk memeriksa apakah pengguna pengguna sah atau tidak. Parameter terakhir dalam callback kami: done menunjukkan metode yang berguna menggunakan yang kita dapat sinyal keberhasilan atau kegagalan untuk paspor modul. Untuk menentukan kegagalan baik parameter pertama harus berisi kesalahan, atau parameter kedua harus mengevaluasi ke false. Untuk menandakan parameter sukses pertama harus null dan parameter kedua harus mengevaluasi ke nilai truthy, dalam hal itu akan dibuat tersedia pada request objek

Karena password inheren asalnya lemah , kita harus selalu mengenkripsi mereka sebelum menyimpan mereka ke database. Untuk ini, kita menggunakan bcrypt-nodejs untuk membantu kami keluar dengan enkripsi dan dekripsi dari password.

Jika Anda merasa tidak nyaman dengan potongan kode dan lebih suka melihat kode lengkap langsung, jangan ragu untuk menelusuri kode di sini.

Pendaftaran strategi

Sekarang, kita mendefinisikan strategi berikutnya yang akan menangani pendaftaran pengguna baru dan menciptakan nya entri dalam DB Mongo yang mendasari kami:

Di sini, kita lagi menggunakan API Mongoose untuk menemukan jika pengguna diberikan username sudah ada atau tidak. Jika tidak, kemudian membuat pengguna baru dan menyimpan informasi user di Mongo. Lain kembali kesalahan menggunakan done callback dan flash pesan. Perhatikan bahwa kita menggunakan bcrypt-nodejs untuk membuat password hash sebelum disimpan:

Menciptakan Route

Jika kita melihat sebuah mata burung lihat dari aplikasi kita, itu akan terlihat seperti:

Birds Eye View of Our Application

Kita sekarang menentukan route kami untuk aplikasi dalam modul berikut yang mengambil contoh passport yang dibuat di app.js di atas. Menyimpan modul ini di routes/index.js

Bagian terpenting dari potongan kode di atas adalah penggunaan passport.authenticate() mendelegasikan otentikasi login dan signup strategi ketika POST HTTP yang dibuat untuk /login dan /signup route masing-masing. Perhatikan bahwa tidak wajib untuk nama strategi di path route dan itu bisa dinamai apa saja.

Menciptakan Jade Views

Selanjutnya, kita membuat berikut dua view untuk aplikasi kita:

  1. layout.jade berisi layout dasar & informasi styling
  2. index.jade berisi halaman login yang mengandung login form dan memberikan pilihan untuk membuat akun baru

Berkat Bootstrap, halaman Login kami sekarang terlihat seperti

Login Page for Our Passport App

Kita perlu dua lebih view untuk pendaftaran dan halaman home dari aplikasi:

  1. register.jade berisi form pendaftaran
  2. home.Jade mengatakan halo dan menunjukkan log in pengguna rincian

Jika Anda tidak terbiasa dengan Jade, periksa dokumentasi.

Implementasi fungsi Logout

Passport, menjadi middleware, diizinkan untuk menambahkan properti dan metode tertentu pada objek request dan response dan itu membuat penggunaan yang tepat dari itu dengan menambahkan request.logout() sangat berguna metode yang membatalkan session pengguna dari properti lainnya.

Melindungi Route

Passport juga memberikan kemampuan untuk melindungi akses ke route yang dianggap layak untuk seorang pengguna anonim. Ini berarti bahwa jika beberapa pengguna yang mencoba untuk mengakses http://localhost:3000/home tanpa otentikasi dalam aplikasi, ia akan diarahkan ke halaman home dengan sendirinya

Kesimpulan

Passport bukanlah satu-satunya pemain dalam arena ini ketika yang datang untuk otentikasi Node.js aplikasi dan ada alternatif seperti EveryAuth tetapi modularitas, fleksibilitas, dukungan komunitas, dan fakta bahwa hanya middleware membuat passport pasti pilihan yang jauh lebih baik.

Untuk perbandingan terinci antara dua, di sini adalah perspektif yang menarik & informatif dari pengembang Passport dirinya.

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.