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ể sử dụng Firebase Authentication để cho phép người dùng xác thực bằng Firebase bằng địa chỉ email và mật khẩu của họ, 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 thực hiện việc này trong bảng điều khiển Firebase.
  3. Bật tính năng đăng nhập bằng email/mật khẩu:
    1. Trong bảng điều khiển Firebase, hãy mở phần Auth (Xác thực).
    2. Trên thẻ Phương thức đăng nhập, hãy bật phương thức đăng nhập Email/mật khẩu rồi nhấp vào 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 có 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 của bạn 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 vào 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ẽ được đăng nhập tự động. Vui lòng 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. Để biết danh sách mã lỗi, hãy xem Tài liệu tham khảo 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 cho người dùng bằng mật khẩu 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 chuyển địa chỉ email và mật khẩu của người dùng tới 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;
      });
    Vui lòng 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ý các lỗi. Để biết danh sách mã lỗi, hãy xem Tài liệu tham khảo xác thực.

Đề xuất: Đặt chính sách mật khẩu

Bạn có thể tăng cường bảo mật 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ở thẻ Password policy (Chính sách mật khẩu) trên trang Xác thực của bảng điều khiển Firebase:

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

Chính sách mật khẩu của Firebase Authentication hỗ trợ các yêu cầu sau đây về mật khẩu:

  • Phải có ký tự viết thường

  • Phải viết hoa ký tự

  • Bắt buộc phải có ký tự số

  • Bắt buộc phải có ký tự không phải chữ và số

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

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

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

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

  • Bắt buộc: Người dùng sẽ không đăng ký được cho đến khi cập nhật mật khẩu tuân thủ chính sách của bạn.

  • Thông báo: Người dùng được phép đăng ký bằng mật khẩu không tuân thủ. 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ủ theo một cách nào đó.

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 có người dùng đang hoạt động, bạn không nên bật tính năng buộc nâng cấp khi đăng nhập, trừ phi bạn có ý định 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 để 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ề các yêu cầu mà mật khẩu của họ còn thiếu.

Xác thực mật khẩu trên ứng dụng

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;
}

Đề xuất: Bật tính năng bảo vệ 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 bị huỷ đăng ký khi cần phải đăng ký (ví dụ: khi đăng nhập bằng địa chỉ email và mật khẩu) hoặc được đăng ký khi không sử dụng đến địa chỉ email đó (ví dụ: khi thay đổi địa chỉ email của người dùng). Mặc dù có thể hữu ích trong việc đề xuất các biện pháp khắc phục cụ thể cho người dùng, nhưng tính năng này cũng có thể bị đối tượng xấu lợi dụng để khám phá các địa chỉ email mà người dùng đã đăng ký.

Để giảm thiểu rủi ro này, bạn nên bật tính năng bảo vệ liệt kê email cho dự án của mình bằng cách sử dụ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ẽ làm thay đổi hành vi báo cáo lỗi của Firebase Authentication: hãy đảm bảo ứ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 (chẳng hạn như tên người dùng và mật khẩu, số điện thoại hoặc thông tin của 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ữ như một phần trong dự án Firebase và có thể được dùng để xác định người dùng trên mọi ứng dụng trong dự án của bạn, bất kể người dùng đăng nhập bằng cách nào.

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

  • Trong Quy tắc bảo mật của Firebase Realtime DatabaseCloud Storage, bạn có thể lấy mã nhận dạng người dùng riêng biệt của người dùng đã đăng nhập từ biến auth rồi sử dụng biến này để kiểm soát những dữ liệu mà một 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 bạn bằng nhiều trình cung cấp dịch vụ xác thực bằng cách liên kết thông tin xác thực của trình cung cấp dịch vụ xác thực với một tài khoản người dùng hiện có.

Để đăng xuất mộ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.
});