Mengintegrasikan ID Provider dengan Azure AD B2C menggunakan Trust Framework Extensions
October 27, 2024 ,

Mengintegrasikan ID Provider dengan Azure AD B2C menggunakan Trust Framework Extensions

Pada tahap ini, Anda telah menyetel ID provider tetapi belum dapat digunakan pada halaman login. Untuk mengatasi hal ini, Anda perlu membuat pengalaman user yang ditentukan sendiri.

Mengkloning Pengalaman User dengan Menggunakan Template

Jika Anda tidak memiliki pengalaman user yang ditentukan sendiri, maka Anda harus mengkloning pengalaman user yang ada. Untuk melakukan hal ini, buka file TrustFrameworkBase.xml dan cari elemen UserJourney dengan atribut Id="SignUpOrSignIn". Copy semua konten elemen tersebut.

Selanjutnya, buka file TrustFrameworkExtensions.xml dan cari elemen UserJourneys. Jika elemen tersebut tidak ada, maka Anda harus membuatnya. Setelah itu, pastikan bahwa elemen UserJourney yang telah di-copy sebelumnya menjadi anak elemen dari elemen UserJourneys.

Mengganti ID Pengalaman User

Ganti nama ID pengalaman user menjadi sesuatu yang unik, seperti Id="CustomSignUpSignIn".

Menambahkan ID Provider ke Pengalaman User

Sekarang pengalaman user sudah ada, maka Anda dapat menambahkan ID provider ke dalamnya. Pertama-tama, tambahkan tombol login dan koneksi tombol tersebut dengan teknologi profil yang telah dibuat sebelumnya.

Selanjutnya, cari elemen OrchestrationStep dengan atribut Type="CombinedSignInAndSignUp" atau Type="ClaimsProviderSelection". Jika Anda menemukan elemen tersebut, maka Anda harus menambahkan elemen ClaimsProviderSelections.

Dalam elemen ClaimsProviderSelections, tambahkan elemen ClaimsProviderSelection dengan atribut TargetClaimsExchangeId yang telah di-set sebelumnya. Contohnya:

<OrchestrationStep Order="1" Type="CombinedSignInAndSignUp" ContentDefinitionReferenceId="api.signuporsignin">
 <ClaimsProviderSelections>
 ...
 <ClaimsProviderSelection TargetClaimsExchangeId="QQExchange" />
 </ClaimsProviderSelections>
 ...
</OrchestrationStep>

<OrchestrationStep Order="2" Type="ClaimsExchange">
 ...
 <ClaimsExchanges>
 <ClaimsExchange Id="QQExchange" TechnicalProfileReferenceId="QQ-OAuth2" />
 </ClaimsExchanges>
</OrchestrationStep>

Mengonfigurasi Relying Party Policy

Relying party policy (contohnya SignUpSignIn.xml) menentukan pengalaman user yang akan digunakan oleh Azure AD B2C. Dalam file tersebut, cari elemen DefaultUserJourney dan ganti atribut ReferenceId menjadi nama ID pengalaman user yang telah dibuat sebelumnya, seperti CustomSignUpSignIn.

Mengupload Policy

Upload policy menggunakan portal Azure. Pertama-tama, login ke portal Azure, lalu pilih directory + subscription icon dan pilih directory yang berisi tenant Azure AD B2C.

Selanjutnya, cari Azure AD B2C dan pilih Identity Experience Framework. Upload file policy yang telah diubah sebelumnya, yaitu TrustFrameworkExtensions.xml dan SignUpSignIn.xml, dalam urutan yang sesuai.

Menguji Policy

Pada tahap terakhir, uji coba policy yang telah diupload. Pilih policy B2C_1A_signup_signin, lalu pilih aplikasi yang telah di-register sebelumnya. Pastikan bahwa URL callback adalah https://jwt.ms.

Setelah itu, klik tombol "Run" dan login ke Azure AD B2C menggunakan ID QQ. Jika proses login berhasil, maka browser akan diarahkan ke https://jwt.ms untuk menampilkan isi token yang dikeluarkan oleh Azure AD B2C.

Tags:
Share this