Tutorial: Membuat alur pengguna dan kebijakan kustom di Azure Active Directory B2C

Sebelum memulai, gunakan pemilih Pilih jenis kebijakan untuk memilih jenis kebijakan yang Anda siapkan. Azure Active Directory B2C menawarkan dua metode untuk menentukan cara pengguna berinteraksi dengan aplikasi Anda: melalui alur pengguna yang telah ditentukan sebelumnya atau melalui kebijakan kustom yang sepenuhnya dapat dikonfigurasi. Langkah yang diperlukan dalam artikel ini berbeda untuk setiap metode.

Dalam aplikasi, Anda mungkin memiliki alur pengguna yang memungkinkan pengguna untuk mendaftar, masuk, atau mengelola profil mereka. Anda dapat membuat beberapa alur pengguna dari berbagai jenis di penyewa Azure Active Directory B2C (Azure AD B2C) dan menggunakannya dalam aplikasi Anda sesuai kebutuhan. Alur pengguna dapat digunakan kembali di seluruh aplikasi.

Alur pengguna memungkinkan Anda menentukan bagaimana pengguna berinteraksi dengan aplikasi Anda saat mereka melakukan hal-hal seperti masuk, mendaftar, mengedit profil, atau mengatur ulang kata sandi. Dalam artikel ini, Anda akan mempelajari cara:

Kebijakan kustom adalah file konfigurasi yang menentukan perilaku penyewa Azure Active Directory B2C (Azure AD B2C) Anda. Dalam artikel ini, Anda akan mempelajari cara:

• Membuat alur pengguna untuk pendaftaran dan masuk
• Mengaktifkan pengaturan ulang kata sandi mandiri
• Membuat alur pengguna pengeditan profil

Penting

Kami telah mengubah cara kami mereferensikan versi alur pengguna. Sebelumnya, kami menawarkan versi V1 (siap produksi), dan versi V1.1 dan V2 (pratinjau). Sekarang, kami telah mengonsolidisasikan alur pengguna ke dalam dua versi: Alur pengguna yang direkomendasikan dengan fitur terbaru, dan alur pengguna Standar (Warisan). Semua alur pengguna pratinjau warisan (V1.1 dan V2) tidak digunakan lagi. Untuk selengkapnya, lihat Versi alur pengguna di Azure AD B2C. Perubahan ini hanya berlaku untuk cloud publik Azure. Lingkungan lain akan terus menggunakan versi aliran pengguna lama.

Prasyarat

• Jika Anda belum memilikinya, buat penyewa AAD B2C yang ditautkan ke langganan Azure Anda.
• Daftarkan aplikasi web, dan aktifkan peruntukan implisit ID token.

• Jika Anda belum memilikinya, buat penyewa AAD B2C yang ditautkan ke langganan Azure Anda.
• Daftarkan aplikasi web, dan aktifkan peruntukan implisit ID token.

Membuat alur pengguna untuk pendaftaran dan masuk

Alur pengguna pendaftaran dan masuk menangani pengalaman pendaftaran dan masuk dengan satu konfigurasi. Pengguna aplikasi Anda dituntun ke jalur yang benar tergantung pada konteksnya.

1. Masuk ke portal Azure.

2. Jika Anda memiliki akses ke beberapa penyewa, pilih ikon Pengaturan di menu atas untuk beralih ke penyewa Azure AD B2C Anda dari menu Direktori + langganan.

3. Di portal Microsoft Azure, cari dan pilih AAD B2C.

4. Di bawah Kebijakan, pilih Alur pengguna, lalu pilih Alur pengguna baru.

   

5. Pada laman Buat alur pengguna, pilih alur pengguna Daftar dan masuk.

   

6. Di bawah Pilih versi, pilih Direkomendasikan, lalu pilih Buat. (Pelajari lebih lanjut versi alur pengguna.)

   

7. Masukkan Nama untuk alur pengguna. Misalnya, signupsignin1.

8. Untuk Penyedia identitas, pilih Daftar melalui email.

9. Untuk Atribut pengguna dan klaim token, pilih klaim dan atribut yang ingin Anda kumpulkan dan kirim dari pengguna selama pendaftaran. Misalnya, pilih Perlihatkan lainnya, lalu pilih atribut dan klaim untuk Negara/Kawasan, Nama Tampilan, dan Kode Pos. Pilih OK.

   

10. Pilih Buat untuk menambahkan alur pengguna. Awalan B2C_1_ secara otomatis ditambahkan ke nama.

Menguji alur pengguna

1. Pilih alur pengguna yang Anda buat untuk membuka halaman gambaran umum.

2. Di bagian atas halaman gambaran umum alur pengguna, pilih Jalankan alur pengguna. Panel terbuka di sisi kanan halaman.

3. Untuk Aplikasi, pilih aplikasi web yang ingin Anda uji, seperti yang bernama webapp1. URL Balasan harus menunjukkan https://jwt.ms.

4. Pilih Jalankan alur pengguna, lalu pilih Daftar sekarang.

   

5. Masukkan alamat email yang valid, pilih Kirim kode verifikasi, masukkan kode verifikasi yang Anda terima, lalu pilih Verifikasi kode.

6. Masukkan kata sandi baru dan konfirmasi kata sandi itu.

7. Pilih negara dan wilayah Anda, masukkan nama yang ingin ditampilkan, masukkan kode pos, lalu pilih Buat. Token dikembalikan ke https://jwt.ms dan ditampilkan kepada Anda.

8. Sekarang Anda dapat menjalankan alur pengguna lagi dan Anda harus dapat masuk dengan akun yang Anda buat. Token yang dikembalikan mencakup klaim yang Anda pilih dari negara/wilayah, nama, dan kode pos.

Catatan

Pengalaman "Jalankan alur pengguna" saat ini tidak kompatibel dengan jenis URL balasan SPA yang menggunakan alur kode otorisasi. Untuk menggunakan pengalaman "Jalankan alur pengguna" dengan jenis aplikasi ini, daftarkan URL balasan dengan jenis "Web" dan aktifkan alur tersirat seperti yang dijelaskan di sini.

Mengaktifkan pengaturan ulang kata sandi mandiri

Untuk mengaktifkan pengaturan ulang kata sandi mandiri untuk alur pengguna mendaftar atau masuk:

1. Pilih alur pengguna mendaftar atau masuk yang Anda buat.
2. Di menu sebelah kiri di bawah Pengaturan, pilih Properti.
3. Pada Konfigurasi kata sandi, pilih Reset kata sandi mandiri.
4. Pilih Simpan.

Menguji alur pengguna

1. Pilih alur pengguna yang Anda buat untuk membuka halaman gambaran umumnya, lalu pilih Jalankan alur pengguna.
2. Untuk Aplikasi, pilih aplikasi web yang ingin Anda uji, seperti yang bernama webapp1. URL Balasan harus menunjukkan https://jwt.ms.
3. Pilih Jalankan alur pengguna.
4. Dari halaman pendaftaran atau masuk, pilih Lupa kata sandi Anda?.
5. Verifikasi alamat email akun yang sebelumnya Anda buat, lalu pilih Lanjutkan.
6. Anda sekarang memiliki kesempatan untuk mengubah kata sandi untuk pengguna. Ubah kata sandi dan pilih Lanjutkan. Token dikembalikan ke https://jwt.ms dan ditampilkan kepada Anda.

Membuat alur pengguna pengeditan profil

Jika Anda ingin memungkinkan pengguna mengedit profil mereka di aplikasi, Anda menggunakan alur pengguna pengeditan profil.

1. Di menu halaman gambaran umum penyewa Azure Active Directory B2C, pilih Alur pengguna, lalu pilih Alur pengguna baru.
2. Pada halaman Buat alur pengguna, pilih alur pengguna Pengeditan profil.
3. Di bawah Pilih versi, pilih Direkomendasikan, lalu pilih Buat.
4. Masukkan Nama untuk alur pengguna. Misalnya, profileediting1.
5. Untuk Penyedia identitas, di bawah Akun lokal, pilih Pendaftaran alamat email.
6. Untuk Atribut Pengguna, pilih atribut yang Anda inginkan agar dapat diedit oleh pelanggan di profil mereka. Misalnya, pilih Tampilkan lainnya, lalu pilih atribut dan klaim untuk Nama tampilan dan Jabatan. Pilih OK.
7. Pilih Buat untuk menambahkan alur pengguna. Awalan B2C_1_ secara otomatis ditambahkan ke nama.

Menguji alur pengguna

1. Pilih alur pengguna yang Anda buat untuk membuka halaman gambaran umum.
2. Di bagian atas halaman gambaran umum alur pengguna, pilih Jalankan alur pengguna. Panel terbuka di sisi kanan halaman.
3. Untuk Aplikasi, pilih aplikasi web yang ingin Anda uji, seperti yang bernama webapp1. URL Balasan harus menunjukkan https://jwt.ms.
4. Pilih Jalankan alur pengguna, lalu masuk dengan akun yang Anda buat sebelumnya.
5. Anda sekarang memiliki kesempatan untuk mengubah nama tampilan dan jabatan untuk pengguna. Pilih Lanjutkan. Token dikembalikan ke https://jwt.ms dan ditampilkan kepada Anda.

Tip

Artikel ini menjelaskan cara mengatur penyewa Anda secara manual. Anda dapat mengotomatiskan seluruh proses dari artikel ini. Pengotomatisan akan menerapkan paket pemula SocialAndLocalAccountsWithMFA Azure AD B2C, yang akan menyediakan perjalanan Daftar dan Masuk, Atur Ulang Kata Sandi, dan Pengeditan Profil. Untuk mengotomatiskan panduan di bawah ini, kunjungi Aplikasi Pengaturan IEF dan ikuti instruksinya.

Menambahkan kunci penandatanganan dan enkripsi untuk aplikasi IEF

1. Masuk ke portal Azure.
2. Jika Anda memiliki akses ke beberapa penyewa, pilih ikon Pengaturan di menu atas untuk beralih ke penyewa Azure AD B2C Anda dari menu Direktori + langganan.
3. Di portal Microsoft Azure, cari dan pilih AAD B2C.
4. Pada halaman gambaran umum, di bawah Kebijakan, pilih Kerangka Kerja Pengalaman Identitas.

Membuat kunci penandatanganan

1. Pilih Tombol Kebijakan, lalu pilih Tambahkan.
2. Untuk Opsi, pilih Generate.
3. Pada Nama,masukkan TokenSigningKeyContainer. Prefiks B2C_1A_ mungkin ditambahkan secara otomatis.
4. Untuk Jenis kunci, pilih RSA.
5. Untuk penggunaan Kunci, pilih Tanda tangan.
6. Pilih Buat.

Membuat kunci enkripsi

1. Pilih Tombol Kebijakan, lalu pilih Tambahkan.
2. Untuk Opsi, pilih Generate.
3. Pada Nama,masukkan TokenEncryptionKeyContainer. Prefiks B2C_1A_ mungkin ditambahkan secara otomatis.
4. Untuk Jenis kunci, pilih RSA.
5. Untuk Penggunaan kunci, pilih Enkripsi.
6. Pilih Buat.

Mendaftarkan aplikasi Identity Experience Framework

Azure AD B2C mengharuskan Anda mendaftarkan dua aplikasi yang digunakan untuk mendaftar dan masuk pengguna dengan akun lokal: IdentityExperienceFramework, API web, dan ProxyIdentityExperienceFramework, aplikasi asli dengan izin yang didelegasikan ke aplikasi IdentityExperienceFramework. Pengguna Anda dapat mendaftar dengan alamat email atau nama pengguna dan kata sandi untuk mengakses aplikasi yang terdaftar di penyewa Anda, yang membuat "akun lokal." Akun lokal hanya ada di penyewa Azure AD B2C Anda.

Anda perlu mendaftarkan kedua aplikasi ini di penyewa Azure AD B2C hanya sekali.

Mendaftarkan aplikasi IdentityExperienceFramework

Untuk mendaftarkan aplikasi di penyewa Azure AD B2C, Anda dapat menggunakan pengalaman Pendaftaran aplikasi.

1. Pilih Pendaftaran aplikasi, lalu pilih Pendaftaran baru.
2. Untuk Nama, masukkan IdentityExperienceFramework.
3. Di bawah Jenis akun yang didukung, pilih Hanya akun dalam direktori organisasi ini.
4. Di bawah URI Pengalihan, pilih Web, lalu masukkan https://your-tenant-name.b2clogin.com/your-tenant-name.onmicrosoft.com, di mana your-tenant-name adalah nama domain penyewa Azure AD B2C Anda.
5. Di bagian Izin, pilih kotak centang Beri persetujuan admin untuk openid dan offline_access.
6. Pilih Daftarkan.
7. Rekam ID Aplikasi (klien) untuk digunakan di langkah selanjutnya.

Selanjutnya, ekspos API dengan menambahkan cakupan:

1. Di menu sebelah kiri, di bawah Kelola, pilih Ekspos API.
2. Pilih Tambahkan cakupan, lalu pilih Simpan dan lanjutkan untuk menerima URI ID aplikasi default.
3. Masukkan nilai berikut untuk membuat cakupan yang memungkinkan eksekusi kebijakan kustom di penyewa Azure AD B2C Anda:
   • Nama cakupan: user_impersonation
   • Nama tampilan persetujuan admin: Access IdentityExperienceFramework
   • Deskripsi persetujuan admin: Allow the application to access IdentityExperienceFramework on behalf of the signed-in user.
4. Pilih Tambahkan cakupan

---

Mendaftarkan aplikasi ProxyIdentityExperienceFramework

1. Pilih Pendaftaran aplikasi, lalu pilih Pendaftaran baru.
2. Untuk Nama, masukkan ProxyIdentityExperienceFramework.
3. Di bawah Jenis akun yang didukung, pilih Hanya akun dalam direktori organisasi ini.
4. Di bawah URI Pengalihan, gunakan tarik-turun untuk memilih Klien publik/asli (seluler & desktop).
5. Untuk Pengalihan URI, masukkan myapp://auth.
6. Di bagian Izin, pilih kotak centang Beri persetujuan admin untuk openid dan offline_access.
7. Pilih Daftarkan.
8. Rekam ID Aplikasi (klien) untuk digunakan di langkah selanjutnya.

Selanjutnya, tentukan bahwa aplikasi harus diperlakukan sebagai klien publik:

1. Di menu sebelah kiri, di bagian Kelola, pilih Autentikasi.
2. Di bawah Pengaturan tingkat lanjut, di bagian Izinkan alur klien publik, atur Aktifkan alur seluler dan desktop berikut ini ke Ya.
3. Pilih Simpan.
4. Pastikan bahwa "allowPublicClient": true diatur dalam manifes aplikasi:
   1. Di menu sebelah kiri, di bagian Kelola, pilih Manifes untuk membuka manifes aplikasi.
   2. Cari kunci allowPublicClient dan pastikan nilainya diatur ke benar.

Sekarang, berikan izin ke cakupan API yang Anda ekspos sebelumnya dalam pendaftaran IdentityExperienceFramework:

1. Di menu sebelah kiri, di bagian Kelola, pilih Izin API.
2. Di Izin yang dikonfigurasi, pilih Tambahkan izin.
3. Pilih tab API Saya, lalu pilih aplikasi IdentityExperienceFramework.
4. Di bawah Izin, pilih cakupan user_impersonation yang Anda tentukan sebelumnya.
5. Pilih Tambahkan izin. Sesuai petunjuk, tunggu beberapa menit sebelum melanjutkan ke langkah berikutnya.
6. Pilih Beri persetujuan admin untuk <nama penyewa Anda)>.
7. Pilih Ya.
8. Pilih Refresh, lalu pastikan bahwa "Diberikan untuk..." muncul di Status untuk cakupan tersebut.

---

Paket pemula kebijakan kustom

Kebijakan kustom adalah set file XML yang Anda unggah ke penyewa Azure AD B2C untuk menentukan profil teknis dan perjalanan pengguna. Kami memberikan paket pemula dengan beberapa kebijakan bawaan agar Anda dapat memulai dengan cepat. Masing-masing paket pemula ini berisi sejumlah kecil profil teknis dan perjalanan pengguna yang diperlukan untuk mencapai skenario yang dijelaskan:

• LocalAccounts - Hanya memungkinkan penggunaan akun lokal.
• SocialAccounts - Hanya memungkinkan penggunaan akun sosial (atau federasi).
• SocialAndLocalAccounts - Memungkinkan penggunaan akun lokal dan sosial.
• SocialAndLocalAccountsWithMFA mengaktifkan opsi autentikasi sosial, lokal, dan multifaktor.

Setiap paket pemula berisi:

• File dasar - Beberapa modifikasi diperlukan untuk dasar. Contoh: TrustFrameworkBase.xml
• File pelokalan - File ini adalah tempat perubahan pelokalan dilakukan. Contoh: TrustFrameworkLocalization.xml
• File ekstensi - File ini adalah tempat sebagian besar perubahan konfigurasi dilakukan. Contoh: TrustFrameworkExtensions.xml
• File relying party - File khusus tugas yang dipanggil oleh aplikasi Anda. Contoh: SignUpOrSignin.xml, ProfileEdit.xml, PasswordReset.xml

Dalam artikel ini, Anda mengedit file kebijakan kustom XML di paket pemula SocialAndLocalAccounts. Jika Anda memerlukan editor XML, coba Visual Studio Code, editor lintas platform yang ringan.

Dapatkan paket pemula

Dapatkan paket pemula kebijakan kustom dari GitHub, lalu perbarui file XML di paket pemula SocialAndLocalAccountsWithMFA dengan nama penyewa AAD B2C Anda.

1. Unduh file .zip atau kloning repositori:

   git clone https://github.com/Azure-Samples/active-directory-b2c-custom-policy-starterpack
   

2. Di semua file di direktori SocialAndLocalAccounts, ganti string yourtenant dengan nama penyewa Azure AD B2C Anda.

   Misalnya, jika nama penyewa B2C Anda adalah contosotenant, semua instans yourtenant.onmicrosoft.com menjadi contosotenant.onmicrosoft.com.

Menambahkan ID aplikasi ke kebijakan kustom

Tambahkan ID aplikasi ke file ekstensi TrustFrameworkExtensions.xml.

1. Buka SocialAndLocalAccounts/TrustFrameworkExtensions.xml dan cari elemen <TechnicalProfile Id="login-NonInteractive">.
2. Ganti kedua instans IdentityExperienceFrameworkAppId dengan ID aplikasi dari aplikasi IdentityExperienceFramework yang Anda buat sebelumnya.
3. Ganti kedua instans ProxyIdentityExperienceFrameworkAppId dengan ID aplikasi dari aplikasi ProxyIdentityExperienceFramework yang Anda buat sebelumnya.
4. Simpan file.

Menambahkan Facebook sebagai penyedia identitas

Paket permulaan SocialAndLocalAccounts mencakup proses masuk media sosial Facebook. Facebook tidak diharuskan untuk menggunakan kebijakan kustom, tetapi kami menggunakannya di sini untuk menunjukkan bagaimana Anda dapat mengaktifkan proses masuk sosial gabungan dalam kebijakan kustom. Jika Anda tidak perlu mengaktifkan login sosial federasi, gunakan LocalAccounts paket pemula sebagai gantinya, dan lewati bagian Tambahkan Facebook sebagai bagian penyedia identitas.

Membuat aplikasi Facebook

Gunakan langkah-langkah yang diuraikan dalam Membuat aplikasi Facebook untuk mendapatkan ID Aplikasi dan Rahasia Aplikasi. Lompati prasyarat dan langkah selanjutnya dalam artikel Menyiapkan pendaftaran dan masuk dengan akun Facebook.

Membuat kunci Facebook

Tambahkan App Secret aplikasi Facebook Anda sebagai kunci kebijakan. Anda dapat menggunakan App Secret dari aplikasi yang Anda buat sebagai bagian dari prasyarat artikel ini.

1. Masuk ke portal Azure.
2. Jika Anda memiliki akses ke beberapa penyewa, pilih ikon Pengaturan di menu atas untuk beralih ke penyewa Azure AD B2C Anda dari menu Direktori + langganan.
3. Di portal Microsoft Azure, cari dan pilih AAD B2C.
4. Pada halaman gambaran umum, di bawah Kebijakan, pilih Kerangka Kerja Pengalaman Identitas.
5. Pilih Tombol Kebijakan, lalu pilih Tambahkan.
6. Untuk Opsi, pilih Manual.
7. Untuk Nama, masukkan FacebookSecret. Prefiks B2C_1A_ mungkin ditambahkan secara otomatis.
8. Di Secret,masukkan App Secret aplikasi Facebook Anda dari developers.facebook.com. Nilai ini adalah rahasia, bukan ID aplikasi.
9. Untuk penggunaan Kunci, pilih Tanda tangan.
10. Pilih Buat.

Memperbarui TrustFrameworkExtensions.xml dalam paket permulaan kebijakan kustom

Dalam file SocialAndLocalAccounts/TrustFrameworkExtensions.xml, ganti nilai client_id dengan ID aplikasi Facebook dan simpan perubahan.

<TechnicalProfile Id="Facebook-OAUTH">
  <Metadata>
  <!--Replace the value of client_id in this technical profile with the Facebook app ID"-->
    <Item Key="client_id">00000000000000</Item>

Mengunggah kebijakan

1. Pilih item menu Identity Experience Framework di penyewa B2C Anda di portal Microsoft Azure.
2. Pilih Unggah kebijakan kustom.
3. Dalam urutan ini, unggah file kebijakan:
   1. TrustFrameworkBase.xml
   2. TrustFrameworkLocalization.xml
   3. TrustFrameworkExtensions.xml
   4. SignUpOrSignin.xml
   5. ProfileEdit.xml
   6. PasswordReset.xml

Saat Anda mengunggah file, Azure menambahkan prefiks B2C_1A_ ke masing-masing file.

Tip

Jika editor XML Anda mendukung validasi, validasi file terhadap skema XML TrustFrameworkPolicy_0.3.0.0.xsd yang terletak di direktori akar dari paket pemula. Validasi skema XML mengidentifikasi kesalahan sebelum mengunggah.

Menguji kebijakan kustom

1. Di bawah Kebijakan kustom, pilih B2C_1A_signup_signin.
2. Untuk Pilih aplikasi pada halaman gambaran umum kebijakan kustom, pilih aplikasi web yang ingin Anda uji, seperti yang bernama webapp1.
3. Pastikan bahwa URL Balasan adalah https://jwt.ms.
4. Pilih Jalankan sekarang.
5. Mendaftar menggunakan alamat email.
6. Pilih Jalankan sekarang lagi.
7. Masuk dengan akun yang sama untuk mengonfirmasi bahwa Anda memiliki konfigurasi yang benar.
8. Pilih lagi Jalankan sekarang, dan pilih Facebook untuk masuk dengan Facebook dan menguji kebijakan kustom.

Langkah berikutnya

Di artikel ini, Anda telah mempelajari cara:

• Membuat alur pendaftaran dan masuk pengguna
• Membuat alur pengguna pengeditan profil
• Alur pengguna pengaturan ulang kata sandi

Selanjutnya, pelajari cara menggunakan Azure AD B2C untuk masuk dan mendaftar pengguna dalam aplikasi. Ikuti contoh aplikasi yang ditautkan di bawah ini:

• Mengonfigurasi contoh aplikasi web ASP.NET Core
• Mengonfigurasi contoh aplikasi web ASP.NET Core yang memanggil API web
• Mengonfigurasi autentikasi dalam contoh aplikasi web Phyton
• Mengonfigurasi contoh aplikasi satu halaman (SPA)
• Mengonfigurasi contoh aplikasi satu halaman Angular
• Mengonfigurasi contoh aplikasi ponsel Android
• Mengonfigurasi contoh aplikasi ponsel iOS
• Mengonfigurasi autentikasi dalam contoh aplikasi desktop WPF
• Mengaktifkan autentikasi di API web Anda
• Mengonfigurasi aplikasi SAML

Anda juga dapat mempelajari lebih lanjut di Azure AD B2C Architecture Deep Dive Series.