Credential Management API adalah API browser berbasis standar yang menyediakan antarmuka terprogram antara situs dan browser untuk login dengan lancar di seluruh perangkat.
Credential Management API:
- Menghilangkan hambatan dari alur login - Pengguna dapat otomatis login kembali ke situs meskipun sesi mereka telah berakhir atau mereka menyimpan kredensial di perangkat lain.
- Mengizinkan login dengan sekali ketuk menggunakan pemilih akun - Pengguna dapat memilih akun di pemilih akun native.
- Menyimpan kredensial - Aplikasi Anda dapat menyimpan kombinasi nama pengguna dan sandi atau bahkan detail akun gabungan. Kredensial ini dapat disinkronkan di seluruh perangkat oleh browser.
Ingin melihat cara kerjanya? Mulai Demo Credential Management API dan lihat kode.
Memeriksa dukungan browser Credential Management API
Sebelum menggunakan Credential Management API, periksa terlebih dahulu apakah PasswordCredential
atau FederatedCredential
didukung.
if (window.PasswordCredential || window.FederatedCredential) {
// Call navigator.credentials.get() to retrieve stored
// PasswordCredentials or FederatedCredentials.
}
Pengguna yang login
Untuk memproses login pengguna, ambil kredensial dari sandi browser pengelola dan menggunakannya untuk membuat {i>login<i} pengguna.
Contoh:
- Saat pengguna membuka situs Anda dan mereka tidak login,
panggil
navigator.credentials.get()
. - Gunakan kredensial yang diambil untuk memproses login pengguna.
- Mengupdate UI untuk menunjukkan bahwa pengguna telah login.
Pelajari lebih lanjut di Pengguna yang Login.
Menyimpan atau memperbarui kredensial pengguna
Jika pengguna login dengan penyedia identitas gabungan seperti Google Login, Facebook, GitHub:
- Setelah pengguna berhasil login atau membuat akun, buat
FederatedCredential
dengan alamat email pengguna sebagai ID dan menentukan penyedia identitas denganFederatedCredentials.provider
. - Simpan objek kredensial menggunakan
navigator.credentials.store()
.
Pelajari lebih lanjut di Pengguna yang Login.
Jika pengguna login dengan nama pengguna dan sandi:
- Setelah pengguna berhasil login atau membuat akun, buat
PasswordCredential
dengan ID pengguna dan {i>password-<i}nya. - Simpan objek kredensial menggunakan
navigator.credentials.store()
.
Pelajari lebih lanjut di Simpan Kredensial dari Formulir.
Logout
Saat pengguna logout, panggil navigator.credentials.preventSilentAccess()
untuk mencegah pengguna masuk kembali secara otomatis.
Menonaktifkan login otomatis juga memungkinkan pengguna untuk beralih antar-akun dengan mudah, misalnya, antara akun kerja dan pribadi, atau antar-akun di di perangkat bersama, tanpa harus memasukkan ulang informasi loginnya.
Pelajari lebih lanjut di Logout.