ตรวจสอบสิทธิ์ด้วย Firebase โดยใช้บัญชีแบบรหัสผ่านที่ใช้ JavaScript

คุณสามารถใช้ Firebase Authentication เพื่อให้ผู้ใช้ตรวจสอบสิทธิ์กับ Firebase โดยใช้อีเมลและรหัสผ่าน รวมถึงจัดการบัญชีที่ใช้รหัสผ่านของแอปได้

ก่อนเริ่มต้น

เพิ่ม Firebase ในโปรเจ็กต์ JavaScript
หากยังไม่ได้เชื่อมต่อแอปกับโปรเจ็กต์ Firebase ให้ทำจาก คอนโซล Firebase
เปิดใช้การลงชื่อเข้าใช้ด้วยอีเมล/รหัสผ่าน โดยทำดังนี้
1. ในคอนโซล Firebase เปิดส่วน การตรวจสอบสิทธิ์
2. ในแท็บวิธีการลงชื่อเข้าใช้ ให้เปิดใช้วิธีการลงชื่อเข้าใช้ด้วยอีเมล/รหัสผ่าน แล้วคลิกบันทึก
เคล็ดลับ: หากต้องการใช้ Firebase CLI, ให้เรียกใช้ firebase init auth เพื่อกำหนดค่าผู้ให้บริการตรวจสอบสิทธิ์ แล้วเรียกใช้ firebase deploy --only auth เพื่อทำให้การเปลี่ยนแปลงมีผลกับ โปรเจ็กต์

สร้างบัญชีที่ใช้รหัสผ่าน

หากต้องการสร้างบัญชีผู้ใช้ใหม่ด้วยรหัสผ่าน ให้ทำตามขั้นตอนต่อไปนี้ในหน้าลงชื่อสมัครใช้ของแอป

เมื่อผู้ใช้ใหม่ลงชื่อสมัครใช้โดยใช้แบบฟอร์มลงชื่อสมัครใช้ของแอป ให้ทำตามขั้นตอนการตรวจสอบบัญชีใหม่ที่แอปกำหนด เช่น การตรวจสอบว่าผู้ใช้พิมพ์รหัสผ่านของบัญชีใหม่ถูกต้องและเป็นไปตามข้อกำหนดด้านความซับซ้อน
สร้างบัญชีใหม่โดยส่งอีเมลและรหัสผ่านของผู้ใช้ใหม่ ไปยัง 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;
    // ..
  });auth_signup_password.js
```
Web
```
firebase.auth().createUserWithEmailAndPassword(email, password)
  .then((userCredential) => {
    // Signed in 
    var user = userCredential.user;
    // ...
  })
  .catch((error) => {
    var errorCode = error.code;
    var errorMessage = error.message;
    // ..
  });email.js
```
หากสร้างบัญชีใหม่ได้ ระบบจะลงชื่อเข้าใช้ผู้ใช้โดยอัตโนมัติ ดูรายละเอียดผู้ใช้ที่ลงชื่อเข้าใช้ได้ในส่วนขั้นตอนถัดไปด้านล่าง
นอกจากนี้ คุณยังสามารถตรวจหาและจัดการข้อผิดพลาดได้ที่นี่ด้วย ดูรายการรหัสข้อผิดพลาดได้ในเอกสารอ้างอิงการตรวจสอบสิทธิ์

Firebase จำกัดจำนวนการลงชื่อสมัครใช้ด้วยอีเมล/รหัสผ่านใหม่และการลงชื่อสมัครใช้โดยไม่ระบุชื่อที่แอปพลิเคชันของคุณสามารถทำได้จากที่อยู่ IP เดียวกันในช่วงเวลาสั้นๆ เพื่อป้องกันไม่ให้ผู้อื่นนำโปรเจ็กต์ของคุณไปใช้ในทางที่ผิด คุณสามารถส่งคำขอและกำหนดเวลา การเปลี่ยนแปลงชั่วคราวสำหรับโควต้านี้ได้จาก Firebaseคอนโซล.

ลงชื่อเข้าใช้ผู้ใช้ด้วยอีเมลและรหัสผ่าน

ขั้นตอนการลงชื่อเข้าใช้ผู้ใช้ด้วยรหัสผ่านจะคล้ายกับขั้นตอนการสร้างบัญชีใหม่ ให้ทำดังนี้ในหน้าลงชื่อเข้าใช้ของแอป

เมื่อผู้ใช้ลงชื่อเข้าใช้แอป ให้ส่งอีเมลและรหัสผ่านของผู้ใช้ไปยัง 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;
  });auth_signin_password.js
```
Web
```
firebase.auth().signInWithEmailAndPassword(email, password)
  .then((userCredential) => {
    // Signed in
    var user = userCredential.user;
    // ...
  })
  .catch((error) => {
    var errorCode = error.code;
    var errorMessage = error.message;
  });email.js
```
ดูรายละเอียดผู้ใช้ที่ลงชื่อเข้าใช้ได้ในส่วนขั้นตอนถัดไปด้านล่าง
นอกจากนี้ คุณยังสามารถตรวจหาและจัดการข้อผิดพลาดได้ที่นี่ด้วย ดูรายการรหัสข้อผิดพลาดได้ในเอกสารอ้างอิงการตรวจสอบสิทธิ์

แนะนำ: กำหนดนโยบายรหัสผ่าน

คุณสามารถเพิ่มความปลอดภัยให้กับบัญชีด้วยการบังคับใช้ข้อกำหนดรหัสผ่านที่ซับซ้อน

หากต้องการกำหนดค่านโยบายรหัสผ่านสำหรับโปรเจ็กต์ ให้เปิดแท็บนโยบายรหัสผ่าน ในหน้าการตั้งค่าการตรวจสอบสิทธิ์ของคอนโซลFirebase

การตั้งค่าการตรวจสอบสิทธิ์

Firebase Authentication นโยบายรหัสผ่านรองรับข้อกำหนดรหัสผ่านต่อไปนี้

ต้องมีอักขระตัวพิมพ์เล็ก
ต้องมีอักขระตัวพิมพ์ใหญ่
ต้องมีอักขระตัวเลข
ต้องมีอักขระที่ไม่ใช่ตัวอักษรและตัวเลข

อักขระต่อไปนี้เป็นไปตามข้อกำหนดอักขระที่ไม่ใช่ตัวอักษรและตัวเลข: ^ $ * . [ ] { } ( ) ? " ! @ # % & / \ , > < ' : ; | _ ~
ความยาวรหัสผ่านขั้นต่ำ (ตั้งแต่ 6 ถึง 30 อักขระ โดยค่าเริ่มต้นคือ 6)
ความยาวรหัสผ่านสูงสุด (สูงสุด 4096 อักขระ)

คุณสามารถเปิดใช้การบังคับใช้นโยบายรหัสผ่านได้ 2 โหมด ดังนี้

กำหนด: การพยายามลงชื่อสมัครใช้จะล้มเหลวจนกว่าผู้ใช้จะอัปเดตรหัสผ่าน ให้เป็นไปตามนโยบาย
แจ้ง: ผู้ใช้สามารถลงชื่อสมัครใช้ด้วยรหัสผ่านที่ไม่เป็นไปตามข้อกำหนด เมื่อใช้โหมดนี้ คุณควรตรวจสอบว่ารหัสผ่านของผู้ใช้เป็นไปตามนโยบายในฝั่งไคลเอ็นต์หรือไม่ และแจ้งให้ผู้ใช้อัปเดตรหัสผ่านหากรหัสผ่านไม่เป็นไปตามข้อกำหนด

ผู้ใช้ใหม่จะต้องเลือกรหัสผ่านที่เป็นไปตามนโยบายเสมอ

หากมีผู้ใช้ที่ใช้งานอยู่ เราขอแนะนำว่าอย่าเปิดใช้การบังคับให้อัปเกรดเมื่อลงชื่อเข้าใช้ เว้นแต่คุณต้องการบล็อกการเข้าถึงของผู้ใช้ที่มีรหัสผ่านไม่เป็นไปตามนโยบาย ให้ใช้โหมดแจ้งแทน ซึ่งจะอนุญาตให้ผู้ใช้ลงชื่อเข้าใช้ด้วยรหัสผ่านปัจจุบันได้ และแจ้งให้ผู้ใช้ทราบข้อกำหนดที่รหัสผ่านยังขาดอยู่

การตรวจสอบรหัสผ่านในไคลเอ็นต์

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

แนะนำ: เปิดใช้การป้องกันการแจกแจงอีเมล

วิธีการบางวิธีที่ใช้อีเมลเป็นพารามิเตอร์จะส่งข้อผิดพลาดที่เฉพาะเจาะจงหากอีเมลไม่ได้ลงทะเบียนในกรณีที่ต้องลงทะเบียน (เช่น เมื่อลงชื่อเข้าใช้ด้วยอีเมลและรหัสผ่าน) หรือลงทะเบียนในกรณีที่ต้องไม่ได้ใช้ (เช่น เมื่อเปลี่ยนอีเมลของผู้ใช้)Firebase Authentication แม้ว่าวิธีนี้จะเป็นประโยชน์ในการแนะนำวิธีแก้ไขปัญหาที่เฉพาะเจาะจงแก่ผู้ใช้ แต่ผู้ไม่ประสงค์ดีก็อาจนำไปใช้ในทางที่ผิดเพื่อค้นหาอีเมลที่ผู้ใช้ลงทะเบียนไว้

เราขอแนะนำให้คุณเปิดใช้การป้องกันการแจกแจงอีเมล สำหรับโปรเจ็กต์โดยใช้เครื่องมือ gcloud ของ Google Cloud เพื่อลดความเสี่ยงนี้ โปรดทราบว่าการเปิดใช้ฟีเจอร์นี้จะเปลี่ยนลักษณะการทำงานของการรายงานข้อผิดพลาดของFirebase Authentication ดังนั้นโปรดตรวจสอบว่าแอปของคุณไม่ได้ใช้ข้อผิดพลาดที่เฉพาะเจาะจงมากขึ้น

ขั้นตอนถัดไป

หลังจากที่ผู้ใช้ลงชื่อเข้าใช้เป็นครั้งแรก ระบบจะสร้างบัญชีผู้ใช้ใหม่และลิงก์กับข้อมูลเข้าสู่ระบบ นั่นคือชื่อผู้ใช้และรหัสผ่าน หมายเลขโทรศัพท์ หรือข้อมูลผู้ให้บริการตรวจสอบสิทธิ์ที่ผู้ใช้ใช้ลงชื่อเข้าใช้ ระบบจะจัดเก็บบัญชีใหม่นี้เป็นส่วนหนึ่งของโปรเจ็กต์ Firebase และสามารถใช้เพื่อระบุผู้ใช้ในทุกแอปของโปรเจ็กต์ได้ ไม่ว่าผู้ใช้จะลงชื่อเข้าใช้ด้วยวิธีใดก็ตาม

ในแอป วิธีที่แนะนำในการทราบสถานะการตรวจสอบสิทธิ์ของผู้ใช้คือการตั้งค่า Observer ในออบเจ็กต์ Auth จากนั้นคุณจะได้รับข้อมูลโปรไฟล์พื้นฐานของผู้ใช้จากออบเจ็กต์ User ดูหัวข้อ จัดการผู้ใช้
ใน Firebase Realtime Database และ Cloud Storage กฎความปลอดภัย คุณสามารถ รับรหัสผู้ใช้ที่ไม่ซ้ำกันของผู้ใช้ที่ลงชื่อเข้าใช้จากตัวแปร auth และใช้รหัสนี้เพื่อควบคุมข้อมูลที่ผู้ใช้เข้าถึงได้

คุณสามารถอนุญาตให้ผู้ใช้ลงชื่อเข้าใช้แอปโดยใช้ผู้ให้บริการตรวจสอบสิทธิ์หลายรายได้ด้วยการลิงก์ข้อมูลเข้าสู่ระบบของผู้ให้บริการตรวจสอบสิทธิ์กับบัญชีผู้ใช้ที่มีอยู่

หากต้องการลงชื่อออกจากระบบของผู้ใช้ ให้เรียกใช้ signOut ดังนี้

Web

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

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

Web

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