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

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

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

  1. เพิ่ม Firebase ลงในโปรเจ็กต์ JavaScript
  2. หากยังไม่ได้เชื่อมต่อแอปกับโปรเจ็กต์ Firebase ให้เชื่อมต่อจากFirebase คอนโซล
  3. เปิดใช้การลงชื่อเข้าใช้ด้วยอีเมล/รหัสผ่าน
    1. ในคอนโซล Firebase ให้เปิด ส่วนการตรวจสอบสิทธิ์
    2. ในแท็บวิธีการลงชื่อเข้าใช้ ให้เปิดใช้อีเมล/รหัสผ่าน แล้วคลิกบันทึก

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

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

  1. เมื่อผู้ใช้ใหม่ลงชื่อสมัครใช้โดยใช้แบบฟอร์มลงชื่อสมัครใช้ของแอป ให้ทำตามขั้นตอนการตรวจสอบบัญชีใหม่ที่แอปกำหนด เช่น การยืนยันว่าผู้ใช้ป้อนรหัสผ่านของบัญชีใหม่ถูกต้องและเป็นไปตามข้อกำหนดด้านความซับซ้อน
  2. สร้างบัญชีใหม่โดยส่งอีเมลและรหัสผ่านของผู้ใช้ใหม่ ไปยัง 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;     // ..   });
    หากสร้างบัญชีใหม่แล้ว ระบบจะลงชื่อเข้าใช้ให้ผู้ใช้โดยอัตโนมัติ ดูรายละเอียดผู้ใช้ที่ลงชื่อเข้าใช้ได้ที่ส่วนขั้นตอนถัดไปด้านล่าง

    นอกจากนี้ คุณยังตรวจหาและจัดการข้อผิดพลาดได้ที่นี่ด้วย ดูรายการรหัสข้อผิดพลาดได้ที่เอกสารอ้างอิงการตรวจสอบสิทธิ์

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

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

  1. เมื่อผู้ใช้ลงชื่อเข้าใช้แอป ให้ส่งอีเมลและ รหัสผ่านของผู้ใช้ไปยัง 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;   });
    ดูรายละเอียดผู้ใช้ที่ลงชื่อเข้าใช้ได้ที่ส่วนขั้นตอนถัดไปด้านล่าง

    นอกจากนี้ คุณยังตรวจหาและจัดการข้อผิดพลาดได้ที่นี่ด้วย ดูรายการรหัสข้อผิดพลาดได้ที่เอกสารอ้างอิงการตรวจสอบสิทธิ์

แนะนำ: ตั้งค่านโยบายรหัสผ่าน

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

หากต้องการกำหนดค่านโยบายรหัสผ่านสำหรับโปรเจ็กต์ ให้เปิดแท็บนโยบายรหัสผ่าน ในหน้าการตั้งค่าการตรวจสอบสิทธิ์ของคอนโซล 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. });

Web

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