Xác thực bằng Firebase bằng Tài khoản dựa trên mật khẩu bằng JavaScript

Bạn có thể dùng Firebase Authentication để cho phép người dùng xác thực bằng Firebase thông qua địa chỉ email và mật khẩu, cũng như quản lý các tài khoản dựa trên mật khẩu của ứng dụng.

Trước khi bắt đầu

  1. Thêm Firebase vào dự án JavaScript.
  2. Nếu bạn chưa kết nối ứng dụng với dự án Firebase, hãy kết nối trong bảng điều khiển Firebase của Firebase.
  3. Bật Email/Mật khẩu làm nhà cung cấp dịch vụ đăng nhập cho dự án Firebase:
    1. Trong bảng điều khiển của Firebase, hãy chuyển đến Security > Authentication.
    2. Trong thẻ Sign-in method (Phương thức đăng nhập), hãy bật nhà cung cấp dịch vụ đăng nhập Email/password (Email/mật khẩu) provider.
    3. Nhấp vào Save (Lưu).

Tạo tài khoản dựa trên mật khẩu

Để tạo tài khoản người dùng mới bằng mật khẩu, hãy hoàn tất các bước sau trên trang đăng ký của ứng dụng:

  1. Khi người dùng mới đăng ký bằng biểu mẫu đăng ký của ứng dụng, hãy hoàn tất mọi bước xác thực tài khoản mới mà ứng dụng yêu cầu, chẳng hạn như xác minh rằng mật khẩu của tài khoản mới được nhập chính xác và đáp ứng các yêu cầu về độ phức tạp.
  2. Tạo tài khoản mới bằng cách truyền địa chỉ email và mật khẩu của người dùng mới đến createUserWithEmailAndPassword:

    Web

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

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

    Web

    firebase.auth().createUserWithEmailAndPassword(email, password)
  .then((userCredential) => {
    // Signed in 
    var user = userCredential.user;
    // ...
  })
  .catch((error) => {
    var errorCode = error.code;
    var errorMessage = error.message;
    // ..
  });
    Nếu tài khoản mới được tạo, người dùng sẽ tự động đăng nhập. Hãy xem phần Các bước tiếp theo bên dưới để biết thông tin chi tiết về người dùng đã đăng nhập.

    Đây cũng là nơi bạn có thể phát hiện và xử lý lỗi. Để xem danh sách mã lỗi, hãy tham khảo Tài liệu tham khảo về xác thực.

Đăng nhập người dùng bằng địa chỉ email và mật khẩu

Các bước đăng nhập người dùng bằng mật khẩu cũng tương tự như các bước tạo tài khoản mới. Trên trang đăng nhập của ứng dụng, hãy làm như sau:

  1. Khi người dùng đăng nhập vào ứng dụng của bạn, hãy truyền địa chỉ email và mật khẩu của người dùng đến signInWithEmailAndPassword:

    Web

    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

    firebase.auth().signInWithEmailAndPassword(email, password)
  .then((userCredential) => {
    // Signed in
    var user = userCredential.user;
    // ...
  })
  .catch((error) => {
    var errorCode = error.code;
    var errorMessage = error.message;
  });
    Hãy xem phần Các bước tiếp theo bên dưới để biết thông tin chi tiết về người dùng đã đăng nhập.

    Đây cũng là nơi bạn có thể phát hiện và xử lý lỗi. Để xem danh sách mã lỗi, hãy tham khảo Tài liệu tham khảo về xác thực.

Nên làm: Đặt chính sách mật khẩu

Bạn có thể cải thiện độ bảo mật của tài khoản bằng cách thực thi các yêu cầu về độ phức tạp của mật khẩu.

Để định cấu hình chính sách mật khẩu cho dự án, hãy mở phần Password policy (Chính sách mật khẩu) trong thẻ Security > Authentication > Settings (Bảo mật > Xác thực > Cài đặt) của Firebase bảng điều khiển:

Cài đặt xác thực

Firebase Authentication chính sách mật khẩu hỗ trợ các yêu cầu sau đối với mật khẩu:

  • Cần có ký tự viết thường

  • Cần có ký tự viết hoa

  • Cần có ký tự số

  • Cần có ký tự không phải chữ và số

    Các ký tự sau đáp ứng yêu cầu về ký tự không phải chữ và số: ^ $ * . [ ] { } ( ) ? " ! @ # % & / \ , > < ' : ; | _ ~

  • Độ dài tối thiểu của mật khẩu (từ 6 đến 30 ký tự; mặc định là 6)

  • Độ dài tối đa của mật khẩu (tối đa 4096 ký tự)

Bạn có thể bật chế độ thực thi chính sách mật khẩu theo hai cách:

  • Require (Yêu cầu): Các lượt đăng ký sẽ không thành công cho đến khi người dùng cập nhật mật khẩu tuân thủ chính sách của bạn.

  • Notify (Thông báo): Người dùng được phép đăng ký bằng mật khẩu không tuân thủ chính sách. Khi sử dụng chế độ này, bạn nên kiểm tra xem mật khẩu của người dùng có tuân thủ chính sách ở phía máy khách hay không và nhắc người dùng cập nhật mật khẩu nếu mật khẩu đó không tuân thủ.

Người dùng mới luôn phải chọn mật khẩu tuân thủ chính sách của bạn.

Nếu bạn có người dùng đang hoạt động, thì bạn không nên bật chế độ buộc nâng cấp khi đăng nhập, trừ phi bạn muốn chặn quyền truy cập của những người dùng có mật khẩu không tuân thủ chính sách của bạn. Thay vào đó, hãy sử dụng chế độ thông báo. Chế độ này cho phép người dùng đăng nhập bằng mật khẩu hiện tại và thông báo cho họ về những yêu cầu mà mật khẩu của họ chưa đáp ứng.

Xác thực mật khẩu ở phía máy khách

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

const status = await validatePassword(getAuth(), passwordFromUser);
if (!status.isValid) {
  // Password could not be validated. Use the status to show what
  // requirements are met and which are missing.

  // If a criterion is undefined, it is not required by policy. If the
  // criterion is defined but false, it is required but not fulfilled by
  // the given password. For example:
  const needsLowerCase = status.containsLowercaseLetter !== true;
}

Nên làm: Bật tính năng bảo vệ chống liệt kê email

Một số phương thức Firebase Authentication lấy địa chỉ email làm tham số sẽ gửi các lỗi cụ thể nếu địa chỉ email chưa đăng ký khi phải đăng ký (ví dụ: khi đăng nhập bằng địa chỉ email và mật khẩu) hoặc đã đăng ký khi phải chưa sử dụng (ví dụ: khi thay đổi địa chỉ email của người dùng). Mặc dù điều này có thể hữu ích khi đề xuất các biện pháp khắc phục cụ thể cho người dùng, nhưng các tác nhân độc hại cũng có thể lợi dụng để khám phá địa chỉ email mà người dùng của bạn đã đăng ký.

Để giảm thiểu rủi ro này, bạn nên bật tính năng bảo vệ chống liệt kê email cho dự án của mình bằng công cụ gcloud của Google Cloud. Xin lưu ý rằng việc bật tính năng này sẽ thay đổi hành vi báo cáo lỗi của Firebase Authentication's: hãy đảm bảo rằng ứng dụng của bạn không dựa vào các lỗi cụ thể hơn.

Các bước tiếp theo

Sau khi người dùng đăng nhập lần đầu tiên, một tài khoản người dùng mới sẽ được tạo và liên kết với thông tin đăng nhập (tức là tên người dùng và mật khẩu, số điện thoại hoặc thông tin nhà cung cấp dịch vụ xác thực) mà người dùng đã đăng nhập. Tài khoản mới này được lưu trữ trong dự án Firebase của bạn và có thể dùng để xác định người dùng trên mọi ứng dụng trong dự án, bất kể cách người dùng đăng nhập.

  • Trong ứng dụng, cách tốt nhất để biết trạng thái xác thực của người dùng là đặt trình quan sát trên đối tượng Auth. Sau đó, bạn có thể lấy thông tin cơ bản về hồ sơ của người dùng từ đối tượng User. Xem bài viết Quản lý người dùng.

  • Trong Firebase Realtime Database và Cloud Storage Quy tắc bảo mật, bạn có thể lấy mã người dùng riêng biệt của người dùng đã đăng nhập từ biến auth, và dùng mã này để kiểm soát dữ liệu mà người dùng có thể truy cập.

Bạn có thể cho phép người dùng đăng nhập vào ứng dụng của mình bằng nhiều nhà cung cấp dịch vụ xác thực bằng cách liên kết thông tin đăng nhập của nhà cung cấp dịch vụ xác thực với tài khoản người dùng hiện có.

Để đăng xuất người dùng, hãy gọi signOut:

Web

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

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

Web

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