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

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

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

Firebase Authentication รองรับเฉพาะขั้นตอน SAML ที่เริ่มต้นโดยผู้ให้บริการเท่านั้น

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

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

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

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

1. เพิ่ม Firebase ลงในโปรเจ็กต์ JavaScript

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

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

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

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

6. บันทึกการเปลี่ยนแปลง

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

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

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

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

   Web

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

   Web

   var provider = new firebase.auth.SAMLAuthProvider('saml.example-provider');
   ``
   

1. ตรวจสอบสิทธิ์กับ Firebase โดยใช้ออบเจ็กต์ผู้ให้บริการ SAML

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

   ขั้นตอนการเปลี่ยนเส้นทาง

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

   Web

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

   Web

   firebase.auth().signInWithRedirect(provider);
   

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

   Web

   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

   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

   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

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

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

   <Subject>
     <NameID Format="urn:oasis:names:tc:SAML:1.1:nameid-format:emailAddress">test@email.com</NameID>
   </Subject>
   

2. แม้ว่าตัวอย่างข้างต้นจะเน้นที่ขั้นตอนการลงชื่อเข้าใช้ คุณสามารถใช้ รูปแบบเพื่อลิงก์ผู้ให้บริการ SAML กับผู้ใช้ที่มีอยู่โดยใช้ linkWithRedirect() และ linkWithPopup() และตรวจสอบสิทธิ์ผู้ใช้อีกครั้งด้วย reauthenticateWithRedirect() และ reauthenticateWithPopup() ซึ่งสามารถเป็น ใช้เพื่อเรียกข้อมูลข้อมูลเข้าสู่ระบบใหม่สำหรับการดำเนินการที่มีความละเอียดอ่อนซึ่งจำเป็นต้องใช้ การเข้าสู่ระบบครั้งล่าสุด