Bagikan melalui

Skenario: Aplikasi Web (Aplikasi Server) memanggil API Web

Pelajari cara untuk membangun aplikasi web yang memungkinkan pengguna masuk, yang diautentikasi oleh AD FS 2019, dan mendapatkan token menggunakan pustaka MSAL untuk memanggil API web.

Sebelum membaca artikel ini, Anda harus terbiasa dengan konsep-konsep AD FS (Active Directory Federation Services) dan proses pemberian kode otorisasi.

Gambaran Umum

Gambaran Umum aplikasi web yang memanggil API web

Dalam alur ini, Anda menambahkan autentikasi ke Aplikasi Web (Aplikasi Server), yang karenanya dapat memasukkan pengguna dan memanggil API web. Dari aplikasi web, untuk memanggil API web, gunakan metode akuisisi token AcquireTokenByAuthorizationCode MSAL. Anda menggunakan alur kode Otorisasi, menyimpan token yang diperoleh dalam cache token. Kemudian pengontrol memperoleh token secara diam-diam dari cache saat diperlukan. MSAL memperbarui token jika diperlukan.

Web Apps yang memanggil API Web:

  • adalah aplikasi klien rahasia.
  • mendaftarkan sebuah rahasia (rahasia yang dibagikan oleh aplikasi, sertifikat, atau akun AD) dengan AD FS. Rahasia ini diteruskan saat pemanggilan ke AD FS untuk mendapatkan token.

Untuk mendaftarkan Aplikasi Web di Layanan Federasi Direktori Aktif dan mengonfigurasinya untuk memperoleh token untuk memanggil API Web, mari kita gunakan sampel yang tersedia di sini dan menelusuri langkah-langkah pendaftaran aplikasi dan konfigurasi kode.

Prasyarat

  • Alat klien GitHub
  • Layanan Federasi Direktori Aktif (AD FS) 2019 atau yang lebih baru sudah dikonfigurasi dan dijalankan
  • Visual Studio 2013 atau yang lebih baru

Pendaftaran Aplikasi di AD FS

Bagian ini menunjukkan cara mendaftarkan Aplikasi Web sebagai klien rahasia dan API Web sebagai Relying Party (RP) di Active Directory Federation Services (AD FS).

  1. Di Manajemen AD FS, klik kanan pada Grup Aplikasi dan pilih Tambahkan Grup Aplikasi.

  2. Pada Wizard Grup Aplikasi, untuk Nama masukkan WebAppToWebApi dan di bawah Aplikasi Client-Server pilih aplikasi Server yang mengakses templat API Web. Klik Berikutnya.

    Cuplikan layar dari halaman Selamat Datang Wizard Tambahkan Grup Aplikasi yang menunjukkan aplikasi Server sedang mengakses templat A P I web yang disorot.

  3. Salin nilai Pengidentifikasi Klien. Nilai digunakan nanti sebagai nilai untuk ida:ClientId dalam file Web.config aplikasi. Masukkan yang berikut ini untuk URI Pengalihan: - https://localhost:44326. Klik Tambahkan. Klik Berikutnya.

    Cuplikan layar halaman Aplikasi Server dari Wizard Tambah Grup Aplikasi memperlihatkan pengidentifikasi klien yang benar dan URI pengalihan.

  4. Pada layar Konfigurasikan Kredensial Aplikasi, beri tanda centang pada Hasilkan rahasia yang dibagikan dan salin rahasia tersebut. Rahasia ini digunakan nanti sebagai nilai untuk ida:ClientSecret dalam file web.config aplikasi. Klik Berikutnya.

    Cuplikan layar halaman Konfigurasikan aplikasi Kredensial Aplikasi dari Wizard Tambahkan Grup Aplikasi memperlihatkan opsi Buat rahasia bersama yang dipilih dan rahasia bersama yang dihasilkan diisi.

  5. Pada layar KonfigurasiKAN API Web, masukkan Pengidentifikasi:https://webapi. Klik Tambahkan. Klik Berikutnya. Nilai ini digunakan nanti untuk ida:GraphResourceId dalam file Web.config aplikasi.

    Cuplikan layar halaman Konfigurasi API Web dari Wizard Tambahkan Grup Aplikasi memperlihatkan pengidentifikasi yang benar.

  6. Pada layar Terapkan Kebijakan Kontrol Akses, pilih Izinkan semua orang dan klik Berikutnya.

    Cuplikan layar halaman Pilih Kebijakan Kontrol Akses dari Wizard Tambahkan Grup Aplikasi memperlihatkan opsi Izinkan semua orang disorot.

  7. Pada layar Konfigurasikan Izin Aplikasi, pastikan openid dan user_impersonation dipilih dan klik Berikutnya.

    Cuplikan layar halaman Konfigurasi Izin Aplikasi dari Wizard Tambah Grup Aplikasi yang menunjukkan opsi ID terbuka dan peniruan pengguna yang telah dipilih.

  8. Pada layar Ringkasan, klik Berikutnya.

  9. Pada layar Selesai, klik Tutup.

Konfigurasi Kode

Bagian ini menunjukkan cara mengonfigurasi ASP.NET Web App untuk masuk pengguna dan mengambil token untuk mengakses API Web.

  1. Unduh sampel dari sini

  2. Buka sampel menggunakan Visual Studio

  3. Buka file web.config. Ubah yang berikut ini:

    • ida:ClientId - masukkan nilai Pengidentifikasi Klien dari #3 di bagian Pendaftaran Aplikasi di Layanan Federasi Direktori Aktif.

    • ida:ClientSecret - masukkan nilai Rahasia dari #4 di bagian Registrasi Aplikasi di AD FS.

    • ida:RedirectUri - masukkan nilai URI Pengalihan dari #3 di bagian Pendaftaran Aplikasi di AD FS.

    • ida:Authority - masukkan https://[nama host AD FS Anda]/adfs. Misalnya, https://adfs.contoso.com/adfs

    • ida:Resource - masukkan nilai Pengidentifikasi dari #5 di bagian Pendaftaran Aplikasi di AD FS.

      Cuplikan layar file konfigurasi web memperlihatkan nilai yang dimodifikasi.

Uji sampel

Bagian ini menunjukkan cara menguji sampel yang dikonfigurasi.

  1. Setelah perubahan kode dilakukan, lakukan kompilasi ulang solusinya.

  2. Di bagian atas Visual Studio, pastikan Internet Explorer dipilih dan klik panah hijau.

    Cuplikan layar UI Visual Studio dengan opsi IIS Express (Internet Explorer) dipanggil.

  3. Pada Halaman Beranda, klik Masuk.

    Cuplikan layar Halaman Beranda dengan opsi Masuk dipanggil.

  4. Anda akan diarahkan ke halaman masuk AD FS. Silakan masuk.

    Cuplikan layar halaman Masuk.

  5. Setelah masuk, klik Token Akses.

    Cuplikan layar Halaman Beranda dengan opsi Token Akses yang disorot.

  6. Mengklik Token Akses mendapatkan info token akses dengan memanggil API Web.

    Cuplikan layar halaman Token Akses memperlihatkan info token akses.

Langkah berikutnya

Alur Ad FS OpenID Connect/OAuth dan Skenario Aplikasi