Google berkomitmen untuk mendorong terwujudnya keadilan ras bagi komunitas Kulit Hitam. Lihat caranya.

Melakukan Autentikasi dengan Firebase menggunakan Akun Berbasis Sandi dengan JavaScript

Anda dapat menggunakan Firebase Authentication untuk mengizinkan pengguna melakukan autentikasi dengan Firebase menggunakan alamat email dan sandi, serta mengelola akun berbasis sandi di aplikasi Anda.

Sebelum memulai

  1. Tambahkan Firebase ke project JavaScript Anda.
  2. Jika Anda belum menghubungkan aplikasi ke project Firebase, lakukanlah dari Firebase console.
  3. Aktifkan login dengan Email/Sandi:
    1. Di Firebase console, buka bagian Auth.
    2. Di tab Metode login, aktifkan metode login Email/sandi dan klik Simpan.

Membuat akun berbasis sandi

Untuk membuat akun pengguna baru dengan sandi, lakukan langkah-langkah berikut di halaman pendaftaran aplikasi Anda:

  1. Ketika pengguna baru mendaftar menggunakan formulir pendaftaran aplikasi Anda, selesaikan langkah-langkah validasi akun baru yang diwajibkan oleh aplikasi, seperti memverifikasi bahwa sandi akun baru tersebut telah diketik dengan benar dan memenuhi persyaratan kerumitan.
  2. Buat akun baru dengan meneruskan alamat email dan sandi pengguna baru ke createUserWithEmailAndPassword:

    Web versi 9

    import { getAuth, createUserWithEmailAndPassword } from "firebase/auth";
    
    const auth = getAuth();
    createUserWithEmailAndPassword(auth, email, password)
      .then((userCredential) => {
        // Signed in
        const user = userCredential.user;
        // ...
      })
      .catch((error) => {
        const errorCode = error.code;
        const errorMessage = error.message;
        // ..
      });

    Web versi 8

    firebase.auth().createUserWithEmailAndPassword(email, password)
      .then((userCredential) => {
        // Signed in
        var user = userCredential.user;
        // ...
      })
      .catch((error) => {
        var errorCode = error.code;
        var errorMessage = error.message;
        // ..
      });
    Jika akun baru telah dibuat, pengguna tersebut juga akan dibuat login secara otomatis. Lihat bagian Langkah berikutnya di bawah untuk mendapatkan detail pengguna yang login.

    Di sini juga Anda dapat menemukan dan menangani error. Untuk mengetahui daftar kode error, lihat Dokumentasi Referensi Auth.

Memproses login dengan alamat email dan sandi

Langkah-langkah untuk membuat agar pengguna login dengan sandi mirip dengan langkah-langkah untuk membuat akun baru. Di halaman login aplikasi Anda, lakukan hal berikut:

  1. Ketika pengguna login ke aplikasi, teruskan alamat email dan sandi pengguna ke signInWithEmailAndPassword:

    Web versi 9

    import { getAuth, signInWithEmailAndPassword } from "firebase/auth";
    
    const auth = getAuth();
    signInWithEmailAndPassword(auth, email, password)
      .then((userCredential) => {
        // Signed in
        const user = userCredential.user;
        // ...
      })
      .catch((error) => {
        const errorCode = error.code;
        const errorMessage = error.message;
      });

    Web versi 8

    firebase.auth().signInWithEmailAndPassword(email, password)
      .then((userCredential) => {
        // Signed in
        var user = userCredential.user;
        // ...
      })
      .catch((error) => {
        var errorCode = error.code;
        var errorMessage = error.message;
      });
    Lihat bagian Langkah berikutnya di bawah untuk mendapatkan detail pengguna yang login.

    Di sini juga Anda dapat menemukan dan menangani error. Untuk mengetahui daftar kode error, lihat Dokumentasi Referensi Auth.

Langkah berikutnya

Setelah pengguna login untuk pertama kalinya, akun pengguna baru akan dibuat dan ditautkan ke kredensial tersebut, yaitu nama pengguna dan sandi, nomor telepon, atau informasi penyedia autentikasi, yang digunakan pengguna tersebut untuk login. Akun baru ini disimpan sebagai bagian dari project Firebase Anda, dan dapat digunakan untuk mengidentifikasi pengguna di setiap aplikasi dalam project, terlepas dari cara pengguna login.

  • Di aplikasi Anda, cara yang direkomendasikan untuk mengetahui status autentikasi pengguna adalah dengan menyetel observer pada objek Auth. Selanjutnya, Anda bisa mendapatkan informasi profil dasar pengguna dari objek User. Baca bagian Mengelola Pengguna.

  • Di Aturan Keamanan Firebase Realtime Database dan Cloud Storage, Anda bisa mendapatkan ID pengguna unik yang login dari variabel auth, dan menggunakannya untuk mengontrol data yang dapat diakses oleh pengguna.

Anda dapat mengizinkan pengguna untuk login ke aplikasi menggunakan beberapa penyedia autentikasi dengan menautkan kredensial penyedia autentikasi ke akun pengguna yang ada.

Untuk memproses logout, panggil signOut:

Web versi 9

import { getAuth, signOut } from "firebase/auth";

const auth = getAuth();
signOut(auth).then(() => {
  // Sign-out successful.
}).catch((error) => {
  // An error happened.
});

Web versi 8

firebase.auth().signOut().then(() => {
  // Sign-out successful.
}).catch((error) => {
  // An error happened.
});