Bagikan melalui

Mengonfigurasi autentikasi dalam contoh aplikasi iOS Swift dengan menggunakan Azure AD B2C

Penting

Berlaku mulai 1 Mei 2025, Azure AD B2C tidak akan lagi tersedia untuk dibeli untuk pelanggan baru. Pelajari lebih lanjut di FAQ kami.

Artikel ini menggunakan contoh aplikasi iOS Swift untuk mengilustrasikan cara menambahkan autentikasi Azure Active Directory B2C (Azure AD B2C) ke aplikasi seluler Anda.

Gambaran Umum

OpenID Connect (OIDC) adalah protokol autentikasi yang dibangun di OAuth 2.0. Anda dapat menggunakan OIDC untuk memasukkan pengguna dengan aman ke aplikasi. Sampel aplikasi seluler ini menggunakan Microsoft Authentication Library (MSAL) dengan kode otorisasi OIDC alur Proof Key for Code Exchange (PKCE). MSAL adalah pustaka yang disediakan Microsoft yang menyederhanakan penambahan dukungan autentikasi dan otorisasi ke aplikasi seluler.

Alur masuk melibatkan langkah-langkah berikut:

  1. Pengguna membuka aplikasi dan memilih masuk.
  2. Aplikasi ini membuka browser sistem perangkat seluler dan memulai permintaan autentikasi ke Azure AD B2C.
  3. Pengguna mendaftar atau masuk, mengatur ulang kata sandi, atau masuk dengan akun sosial.
  4. Setelah pengguna berhasil masuk, Azure AD B2C mengembalikan kode otorisasi ke aplikasi.
  5. Aplikasi ini mengambil tindakan berikut:
    1. Ini menukar kode otorisasi ke token ID, token akses, dan token refresh.
    2. Ini membaca klaim token ID.
    3. Ini menyimpan token dalam cache di memori untuk keperluan di kemudian hari.

Ringkasan pendaftaran aplikasi

Untuk mengaktifkan aplikasi Anda untuk masuk dengan Azure AD B2C dan memanggil API web, daftarkan dua aplikasi di direktori Azure AD B2C:

  • Pendaftaran aplikasi seluler memungkinkan aplikasi Anda untuk masuk dengan Azure AD B2C. Selama pendaftaran aplikasi, tentukan URI pengalihan. URI pengalihan adalah titik akhir tempat pengguna dialihkan oleh Azure AD B2C setelah mereka mengautentikasi dengan Azure AD B2C. Proses pendaftaran aplikasi menghasilkan ID aplikasi, juga dikenal sebagai ID klien, yang secara unik mengidentifikasi aplikasi seluler Anda (misalnya, ID Aplikasi: 1).

  • Pendaftaran API web memungkinkan aplikasi Anda memanggil API web yang dilindungi. Pendaftaran memaparkan perizinan API web (cakupan). Proses pendaftaran aplikasi menghasilkan ID aplikasi, yang secara unik mengidentifikasi API web Anda (misalnya, ID Aplikasi: 2). Berikan izin aplikasi seluler Anda (ID Aplikasi: 1) ke cakupan API web (ID Aplikasi: 2).

Pendaftaran dan arsitektur aplikasi diilustrasikan dalam diagram berikut:

Diagram aplikasi seluler dengan pendaftaran dan token panggilan API web.

Memanggil API web

Setelah autentikasi selesai, pengguna berinteraksi dengan aplikasi, yang memanggil API web yang dilindungi. API web menggunakan autentikasi token pembawa. Token pembawa adalah token akses yang diperoleh aplikasi dari Azure AD B2C. Aplikasi mengirimkan token melalui header otorisasi dalam permintaan HTTPS.

Authorization: Bearer <access token>

Jika cakupan token akses tidak cocok dengan cakupan API web, pustaka autentikasi memperoleh token akses baru dengan cakupan yang benar.

Alur keluar sistem

Alur proses keluar meliputi langkah-langkah berikut:

  1. Pengguna keluar dari akun di aplikasi.
  2. Aplikasi menghapus objek sesinya, dan pustaka autentikasi menghapus cache tokennya.
  3. Aplikasi membawa pengguna ke endpoint sign-out Azure AD B2C untuk mengakhiri sesi Azure AD B2C.
  4. Pengguna dialihkan kembali ke aplikasi.

Prasyarat

Komputer yang menjalankan:

Langkah 1: Mengonfigurasi alur pengguna

Saat pengguna mencoba masuk ke aplikasi Anda, aplikasi memulai permintaan autentikasi ke titik akhir otorisasi melalui alur pengguna. Alur pengguna mendefinisikan dan mengontrol pengalaman pengguna. Setelah pengguna menyelesaikan alur pengguna, Azure Active Directory B2C membuat token dan kemudian mengarahkan pengguna kembali ke aplikasi Anda.

Jika Anda belum melakukannya, buat alur pengguna atau kebijakan kustom. Ulangi langkah-langkah tersebut untuk membuat tiga alur pengguna terpisah sebagai berikut:

  • Gabungan alur pengguna daftar dan masuk, seperti susi. Alur pengguna ini juga mendukung pengalaman Lupa kata sandi Anda.
  • Alur Pengeditan Profil pengguna, seperti .
  • Alur pengguna untuk mengatur ulang kata sandi, seperti .

Azure AD B2C menambahkan B2C_1_ ke nama alur pengguna. Misalnya, susi menjadi B2C_1_susi.

Langkah 2: Mendaftarkan aplikasi seluler

Buat aplikasi seluler dan pendaftaran aplikasi API web, dan tentukan cakupan API web Anda.

Langkah 2.1: Daftarkan aplikasi API web

Untuk membuat pendaftaran aplikasi API web (ID Aplikasi: 2), ikuti langkah-langkah berikut:

  1. Masuk ke portal Azure.

  2. Pastikan Anda menggunakan direktori yang berisi Azure AD B2C tenant Anda. Pilih ikon Direktori + langganan di bilah alat portal.

  3. Pada Setelan portal | Direktori + langganan, temukan direktori Azure AD B2C Anda di daftar Nama direktori, lalu pilih Beralih.

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

  5. Pilih Pendaftaran aplikasi, lalu pilih Pendaftaran baru.

  6. Untuk Nama, masukkan nama untuk aplikasi (misalnya, my-api1). Biarkan nilai default untuk URI Pengalihan dan Jenis akun yang didukung.

  7. Pilih Daftarkan.

  8. Setelah pendaftaran aplikasi selesai, pilih Ringkasan.

  9. Catat nilai ID Aplikasi (klien) untuk digunakan nanti, saat Anda mengonfigurasi aplikasi web.

    Cuplikan layar menunjukkan cara mendapatkan ID aplikasi A P I web.

Langkah 2.2: Mengonfigurasi cakupan aplikasi API web

  1. Pilih aplikasi my-api1 yang Anda buat (ID Aplikasi: 2) untuk membuka halaman Ringkasannya.

  2. Di bawah Kelola, pilih Ekspos API.

  3. Di samping URI ID Aplikasi, pilih tautan Set. Ganti nilai default (GUID) dengan nama yang unik (misalnya, tasks-api ), kemudian pilih Simpan .

    Ketika aplikasi web Anda meminta token akses untuk API, ia harus menambahkan URI ini sebagai awalan bagi setiap cakupan yang Anda tentukan untuk API.

  4. Di bawah Cakupan yang ditentukan oleh API ini, pilih Tambahkan cakupan.

  5. Untuk membuat ruang lingkup yang menentukan akses baca ke API:

    1. Untuk Nama cakupan, masukkan tasks.read.
    2. Untuk Nama tampilan persetujuan admin, ketikkan Akses baca ke API tugas.
    3. Untuk Deskripsi perizinan admin, masukkan Izinkan akses baca ke API tugas.

  6. Pilih Tambahkan cakupan.

  7. Pilih Tambahkan cakupan, lalu tambahkan cakupan yang menentukan akses tulis ke API:

    1. Untuk Nama cakupan, masukkan tasks.write.
    2. Untuk Nama tampilan perizinan admin, masukkan Hak akses menulis ke API tugas.
    3. Untuk Deskripsi perizinan admin, masukkan Izinkan akses tulis ke API tugas.

  8. Pilih Tambahkan cakupan.

Langkah 2.3: Mendaftarkan aplikasi seluler

Untuk membuat pendaftaran aplikasi seluler, lakukan hal berikut:

  1. Masuk ke portal Azure.
  2. Pilih Pendaftaran aplikasi, lalu pilih Pendaftaran baru.
  3. Di bawah Nama, masukkan nama untuk aplikasi (misalnya, iOs-app1).
  4. Di bawah Jenis akun yang didukung, pilih Akun-akun di penyedia identitas atau direktori organisasi apa pun (untuk mengautentikasi pengguna melalui alur pengguna).
  5. Di bawah URI Pengalihan, pilih Klien publik/asli (seluler & desktop) lalu, di kotak URL, masukkan msauth.com.microsoft.identitysample.MSALiOS://auth.
  6. Pilih Daftarkan.
  7. Setelah pendaftaran aplikasi selesai, pilih Ringkasan.
  8. Rekam ID Aplikasi (klien) untuk digunakan nanti, saat Anda mengonfigurasi aplikasi seluler. Cuplikan layar menyoroti ID aplikasi seluler.

Langkah 2.4: Berikan izin aplikasi seluler untuk API web

Untuk memberi izin kepada aplikasi Anda (ID Aplikasi: 1), ikuti langkah-langkah berikut:

  1. Pilih Pendaftaran aplikasi, lalu pilih aplikasi yang Anda buat (ID Aplikasi: 1).

  2. Di bagian Kelola, pilih Izin API.

  3. Di Izin yang dikonfigurasi, pilih Tambahkan izin.

  4. Pilih tab API Saya.

  5. Pilih API (ID Aplikasi: 2) yang aplikasi webnya akan diberi akses. Contohnya, masukkan my-api1.

  6. Di bagian Izin, luaskan tugas, lalu pilih cakupan yang Anda tentukan sebelumnya (misalnya, tasks.read dan tasks.write).

  7. Pilih Tambahkan izin.

  8. Pilih Beri persetujuan admin untuk <nama penyewa Anda>.

  9. Pilih Ya.

  10. Pilih Refresh, kemudian pastikan bahwa Diberikan untuk ... muncul di bawah Status untuk kedua ruang lingkup.

  11. Dari daftar Izin akses yang dikonfigurasi, pilih cakupan Anda, lalu salin nama lengkap cakupan.

    Cuplikan layar panel izin akses yang dikonfigurasi, yang memperlihatkan pemberian izin akses baca.

Langkah 3: Mengonfigurasi API web sampel

Sampel ini memperoleh token akses dengan cakupan relevan yang dapat digunakan aplikasi seluler untuk API web. Untuk memanggil API web dari kode, lakukan hal berikut:

  1. Gunakan API web yang sudah ada, atau buat yang baru. Untuk informasi selengkapnya, lihat Mengaktifkan autentikasi di API web Anda sendiri dengan menggunakan Azure AD B2C.
  2. Ubah kode sampel untuk memanggil API web.
  3. Setelah Anda mengonfigurasi API web, salin URI titik akhir API web. Anda akan menggunakan titik akhir API web di langkah berikutnya.

Petunjuk / Saran

Jika Anda tidak memiliki API web, Anda masih dapat menjalankan sampel ini. Dalam hal ini, aplikasi mengembalikan token akses tetapi tidak akan dapat memanggil API web.

Langkah 4: Dapatkan sampel aplikasi seluler iOS

  1. Unduh file .zip, atau kloning aplikasi web sampel dari repositori GitHub.

    git clone https://github.com/Azure-Samples/active-directory-b2c-ios-swift-native-msal

  2. Gunakan CocoaPods untuk menginstal pustaka MSAL. Di jendela terminal, buka folder akar proyek. Folder ini berisi file podfile . Jalankan perintah berikut:

    pod install

  3. MSALiOS.xcworkspace Buka ruang kerja dengan Xcode.

Langkah 5: Mengonfigurasi contoh aplikasi seluler

Buka file ViewController.swift. Anggota ViewController kelas pemrograman berisi informasi tentang penyedia identitas Azure AD B2C Anda. Aplikasi seluler menggunakan informasi ini untuk membangun hubungan kepercayaan dengan Azure AD B2C, memasukkan dan keluar pengguna, memperoleh token, dan memvalidasinya.

Perbarui anggota kelas berikut:

Kunci Nilai
kTenantName Nama lengkap penyewa Azure AD B2C Anda (misalnya, ).
kOtoritasNama Host Bagian pertama dari nama penyewa Azure AD B2C Anda (misalnya, contoso.b2clogin.com).
kClientID ID aplikasi seluler dari langkah 2.3.
kRedirectUri Aplikasi seluler mengalihkan URI dari langkah 2.3, msauth.com.microsoft.identitysample.MSALiOS://auth.
kKebijakanDaftarAtauMasuk Alur pengguna pendaftaran atau masuk atau kebijakan kustom yang Anda buat di langkah 1.
kEditProfilePolicy Alur edit profil pengguna atau kebijakan khusus yang Anda buat di langkah 1.
kGraphURI (Opsional) Titik akhir API web yang Anda buat di langkah 3 (misalnya, https://contoso.azurewebsites.net/hello).
kLingkup Cakupan API web yang Anda buat di langkah 2.4.

Langkah 6: Jalankan dan uji aplikasi seluler

  1. Bangun dan jalankan proyek dengan simulator perangkat iOS yang terhubung.

  2. Pilih Masuk, lalu daftar atau masuk dengan akun lokal atau sosial Azure AD B2C Anda.

    Cuplikan layar yang menyoroti cara memulai alur masuk.

  3. Setelah autentikasi berhasil, Anda akan melihat nama tampilan Anda di bilah navigasi.

    Cuplikan layar menyoroti token akses Azure AD B2C dan ID pengguna.

Langkah selanjutnya

Pelajari cara: