Join us in person and online for Firebase Summit on October 18, 2022. Learn how Firebase can help you accelerate app development, release your app with confidence, and scale with ease. Register now

ตรวจสอบสิทธิ์โดยใช้ SAML ในเว็บแอป

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

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

การตรวจสอบสิทธิ์ Firebase รองรับเฉพาะขั้นตอน SAML ที่ผู้ให้บริการเริ่มต้นเท่านั้น

ก่อนจะเริ่ม

ในการลงชื่อเข้าใช้ผู้ใช้โดยใช้ผู้ให้บริการข้อมูลประจำตัว SAML คุณต้องรวบรวมข้อมูลบางอย่างจากผู้ให้บริการก่อน:

  • รหัสเอนทิตีของผู้ให้บริการ : URI ที่ระบุผู้ให้บริการข้อมูลประจำตัว
  • URL ของ SAML SSO ของผู้ให้บริการ : URL ของหน้าลงชื่อเข้าใช้ของผู้ให้บริการข้อมูลประจำตัว
  • ใบรับรองคีย์สาธารณะของผู้ให้บริการ : ใบรับรองที่ใช้ตรวจสอบโทเค็นที่ลงนามโดยผู้ให้บริการข้อมูลประจำตัว
  • รหัสเอนทิตีของแอปของคุณ : URI ที่ระบุแอปของคุณ "ผู้ให้บริการ"

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

  1. เพิ่ม Firebase ในโครงการ JavaScript ของคุณ

  2. หากคุณยังไม่ได้อัปเกรดเป็น Firebase Authentication ด้วย Identity Platform ให้ดำเนินการดังกล่าว การตรวจสอบสิทธิ์ SAML ใช้ได้เฉพาะในโปรเจ็กต์ที่อัปเกรดแล้ว

  3. ในหน้า ผู้ให้บริการการลงชื่อเข้าใช้ ของคอนโซล Firebase ให้คลิก เพิ่มผู้ให้บริการใหม่ จากนั้นคลิก SAML

  4. ตั้งชื่อให้กับผู้ให้บริการรายนี้ หมายเหตุ ID ผู้ให้บริการที่สร้างขึ้น: บางอย่างเช่น saml.example-provider คุณจะต้องใช้รหัสนี้เมื่อเพิ่มรหัสลงชื่อเข้าใช้ในแอป

  5. ระบุ ID เอนทิตีของผู้ให้บริการข้อมูลประจำตัว, URL ของ SSO และใบรับรองคีย์สาธารณะ ระบุ ID เอนทิตีของแอปของคุณด้วย (ผู้ให้บริการ) ค่าเหล่านี้ต้องตรงกับค่าที่ผู้ให้บริการของคุณกำหนดให้คุณทุกประการ

  6. บันทึกการเปลี่ยนแปลงของคุณ

  7. หากคุณยังไม่ได้อนุญาตโดเมนของแอป ให้เพิ่มลงในรายการอนุญาตในหน้าการ ตรวจสอบสิทธิ์ > การตั้งค่า ของคอนโซล Firebase

จัดการขั้นตอนการลงชื่อเข้าใช้ด้วย Firebase SDK

หากต้องการจัดการขั้นตอนการลงชื่อเข้าใช้ด้วย Firebase JavaScript SDK ให้ทำตามขั้นตอนเหล่านี้:

  1. สร้างอินสแตนซ์ของ SAMLAuthProvider โดยใช้ ID ผู้ให้บริการที่คุณได้รับในคอนโซล Firebase

    Web version 9

    import { SAMLAuthProvider } from "firebase/auth";
    
    const provider = new SAMLAuthProvider('saml.example-provider');
    

    Web version 8

    var provider = new firebase.auth.SAMLAuthProvider('saml.example-provider');
    ``
    
  1. ตรวจสอบสิทธิ์กับ Firebase โดยใช้วัตถุผู้ให้บริการ SAML

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

    โฟลว์การเปลี่ยนเส้นทาง

    เปลี่ยนเส้นทางไปยังหน้าลงชื่อเข้าใช้ของผู้ให้บริการโดยเรียก signInWithRedirect() :

    Web version 9

    import { getAuth, signInWithRedirect } from "firebase/auth";
    
    const auth = getAuth();
    signInWithRedirect(auth, provider);
    

    Web version 8

    firebase.auth().signInWithRedirect(provider);
    

    หลังจากที่ผู้ใช้ลงชื่อเข้าใช้เสร็จแล้วและกลับมาที่แอปของคุณ คุณสามารถรับผลการลงชื่อเข้าใช้ได้โดยเรียก getRedirectResult()

    Web version 9

    import { getAuth, getRedirectResult, SAMLAuthProvider } from "firebase/auth";
    
    const auth = getAuth();
    getRedirectResult(auth)
      .then((result) => {
        // User is signed in.
    
        // Provider data available using getAdditionalUserInfo()
      })
      .catch((error) => {
        // Handle error.
      });
    

    Web version 8

    firebase.auth().getRedirectResult()
      .then((result) => {
        // User is signed in.
    
        // Provider data available in result.additionalUserInfo.profile,
        // or from the user's ID token obtained from result.user.getIdToken()
        // as an object in the firebase.sign_in_attributes custom claim.
      })
      .catch((error) => {
        // Handle error.
      });
    

    ป๊อปอัปโฟลว์

    Web version 9

    import { getAuth, signInWithPopup, OAuthProvider } from "firebase/auth";
    
    const auth = getAuth();
    signInWithPopup(auth, provider)
      .then((result) => {
        // User is signed in.
    
        // Provider data available in result.additionalUserInfo.profile,
        // or from the user's ID token obtained from result.user.getIdToken()
        // as an object in the firebase.sign_in_attributes custom claim.
      })
      .catch((error) => {
        // Handle error.
      });
    

    Web version 8

    firebase.auth().signInWithPopup(provider)
      .then((result) => {
        // User is signed in.
    
        // Provider data available in result.additionalUserInfo.profile,
        // or from the user's ID token obtained from result.user.getIdToken()
        // as an object in the firebase.sign_in_attributes custom claim.
      })
      .catch((error) => {
        // Handle error.
      });
    
  2. ในขณะที่ตัวอย่างข้างต้นเน้นที่ขั้นตอนการลงชื่อเข้าใช้ คุณสามารถใช้รูปแบบเดียวกันเพื่อเชื่อมโยงผู้ให้บริการ SAML กับผู้ใช้ที่มีอยู่โดยใช้ linkWithRedirect() และ linkWithPopup() และรับรองความถูกต้องผู้ใช้อีกครั้งด้วย reauthenticateWithRedirect() และ reauthenticateWithPopup() ซึ่งสามารถใช้เพื่อดึงข้อมูลรับรองใหม่สำหรับการดำเนินการที่มีความละเอียดอ่อนซึ่งต้องเข้าสู่ระบบล่าสุด