Bagikan melalui

Tutorial: Memasukkan pengguna ke aplikasi web Python Flask dengan menggunakan platform identitas Microsoft

Berlaku untuk: Lingkaran hijau dengan simbol tanda centang putih. Penyewa Workforce Lingkaran hijau dengan simbol tanda centang putih. Penyewa eksternal (pelajari lebih lanjut)

Tutorial ini memandu Anda mengamankan aplikasi Web Python Flask.

Di tutorial ini, Anda akan:

  • Membuat proyek Python Flask
  • Menginstal dependensi yang diperlukan
  • Mengonfigurasi aplikasi web Flask Anda untuk menggunakan platform identitas Microsoft untuk autentikasi
  • Menguji pengalaman masuk dan keluar di aplikasi web Flask Anda

Prasyarat

  • Penyewa dari kalangan tenaga kerja. Anda dapat menggunakan Direktori Default atau menyiapkan tenant baru.
  • Daftarkan aplikasi baru di pusat admin Microsoft Entra, dikonfigurasi hanya untuk Akun di direktori organisasi ini. Lihat Mendaftarkan aplikasi untuk detail selengkapnya. Rekam nilai berikut dari halaman Gambaran Umum aplikasi untuk digunakan nanti:
    • ID Aplikasi (klien)
    • ID Direktori (Penyewa)
  • Tambahkan rahasia klien ke pendaftaran aplikasi Anda. Jangan gunakan rahasia klien di aplikasi produksi. Gunakan sertifikat atau kredensial federasi sebagai gantinya. Untuk informasi selengkapnya, lihat menambahkan kredensial ke aplikasi Anda.

Membuat proyek Flask

  1. Buat folder untuk menghosting aplikasi Flask Anda, seperti flask-web-app.

  2. Buka jendela konsol, dan ubah ke direktori folder aplikasi web Flask Anda menggunakan perintah.

    cd flask-web-app

  3. Menyiapkan lingkungan virtual

    Bergantung pada sistem operasi Anda, jalankan perintah berikut untuk menyiapkan lingkungan virtual Anda dan mengaktifkannya:

    Untuk sistem operasi windows:

    py -m venv .venv
.venv\scripts\activate

    Untuk sistem operasi macOS atau Linux:

    python3 -m venv .venv
source .venv/bin/activate

Menginstal dependensi aplikasi

Untuk menginstal dependensi aplikasi, jalankan perintah berikut:

pip install flask
pip install python-dotenv
pip install requests
pip install "ms_identity_python[flask] @ git+https://github.com/azure-samples/ms-identity-python@0.9"

Pustaka ms_identity_python yang Anda instal secara otomatis menginstal Microsoft Authentication Library (MSAL) untuk Python sebagai dependensinya. MSAL Python adalah pustaka yang memungkinkan Anda mengautentikasi pengguna dan mengelola token akses mereka.

Setelah menginstal pustaka yang diperlukan, perbarui file persyaratan Anda dengan menjalankan perintah berikut:

pip freeze > requirements.txt

Menambahkan konfigurasi Anda

  1. Buat file .env* di folder akar Anda untuk menyimpan konfigurasi aplikasi Anda dengan aman. File .env Anda harus berisi variabel lingkungan berikut:

    CLIENT_ID="<Enter_your_client_id>"
CLIENT_SECRET="<Enter_your_client_secret>"
AUTHORITY="https://login.microsoftonline.com/<Enter_tenant_id>"
REDIRECT_URI="<Enter_redirect_uri>"

    Ganti tanda pengganti dengan nilai berikut:

    • Ganti <Enter_your_client_id> dengan ID Aplikasi (ID klien) dari aplikasi web klien yang Anda daftarkan.
    • Ganti <Enter_tenant_id> dengan ID Direktori (Penyewa) tempat Anda mendaftarkan aplikasi web.
    • Ganti <Enter_your_client_secret> dengan nilai rahasia Klien untuk aplikasi web yang Anda buat. Dalam tutorial ini, kami menggunakan rahasia untuk tujuan demonstrasi. Dalam produksi, gunakan pendekatan yang lebih aman seperti sertifikat atau kredensial identitas federasi.
    • Ganti <Enter_redirect_uri> dengan URI pengalihan yang Anda daftarkan sebelumnya. Tutorial ini mengatur jalur URI pengalihan ke http://localhost:3000/getAToken.

  2. Buat file app_config.py untuk membaca variabel lingkungan dan menambahkan konfigurasi lain yang Anda butuhkan.

    import os

AUTHORITY = os.getenv("AUTHORITY")
CLIENT_ID = os.getenv("CLIENT_ID")
CLIENT_SECRET = os.getenv("CLIENT_SECRET")
REDIRECT_URI = os.getenv("REDIRECT_URI")
SESSION_TYPE = "filesystem" # Tells the Flask-session extension to store sessions in the filesystem. Don't use in production apps.

Mengonfigurasi titik akhir aplikasi

Pada tahap ini, Anda membuat titik akhir aplikasi web dan menambahkan logika bisnis ke aplikasi Anda.

  1. Buat file bernama app.py di folder akar Anda.

  2. Impor dependensi yang diperlukan di bagian atas file app.py.

    import os
import requests
from flask import Flask, render_template
from identity.flask import Auth
import app_config

  3. Inisialisasi aplikasi Flask Anda dan konfigurasikan untuk menggunakan jenis penyimpanan sesi yang Anda tentukan dalam file app_config.py Anda.

    app = Flask(__name__)
app.config.from_object(app_config)

  4. Inisialisasi klien aplikasi. Aplikasi web Flask adalah klien rahasia. Kami meneruskan rahasia klien karena klien yang bersifat rahasia dapat menyimpannya dengan aman. Di balik layar, pustaka identitas memanggil kelas ConfidentialClientApplication dari pustaka MSAL.

    auth = Auth(
    app,
    authority=app.config["AUTHORITY"],
    client_id=app.config["CLIENT_ID"],
    client_credential=app.config["CLIENT_SECRET"],
    redirect_uri=app.config["REDIRECT_URI"]
)

  5. Tambahkan titik akhir yang diperlukan ke aplikasi Flask Anda. Aplikasi web menggunakan alur kode otorisasi untuk masuk ke pengguna. Pustaka pembungkus MSAL ms_identity_python membantu dalam interaksi dengan pustaka MSAL, sehingga mempermudah penambahan fitur masuk log dan keluar log ke dalam aplikasi Anda. Kami menambahkan halaman indeks dan melindunginya menggunakan dekorator login_required yang disediakan oleh pustaka ms_identity_python. Dekorator login_required memastikan bahwa hanya pengguna yang diautentikasi yang dapat mengakses halaman indeks.

    @app.route("/")
@auth.login_required
def index(*, context):
    return render_template(
        'index.html',
        user=context['user'],
        title="Flask Web App Sample",
    )

    Pengguna dijamin akan hadir karena kami menghias tampilan ini dengan @login_required.

Membuat templat aplikasi

Buat folder yang disebut templat di folder akar Anda. Di folder templat, buat file yang disebut index.html. Ini adalah beranda aplikasi. Tambahkan kode berikut ke file index.html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{{ title }}</title>
</head>
<body>
    <h1>{{ title }}</h1>
    <h2>Welcome {{ user.get("name") }}!</h2>

    <img src="https://github.com/Azure-Samples/ms-identity-python-webapp-django/raw/main/static/topology.png" alt="Topology">

    <ul>
    {% if api_endpoint %}
        <!-- If an API endpoint is declared and scopes defined, this link will show. We set this in the call an API tutorial. For this tutorial, we do not define this endpoint. -->
        <li><a href='/call_api'>Call an API</a></li>
    {% endif %}

    <li><a href="{{ url_for('identity.logout') }}">Logout</a></li>
    </ul>

    <hr>
    <footer style="text-align: right">{{ title }}</footer>
</body>
</html>

Menjalankan dan menguji sampel aplikasi web

  1. Di terminal Anda, jalankan perintah berikut:

    python3 -m flask run --debug --host=localhost --port=3000

    Anda dapat menggunakan port pilihan Anda. Port ini harus mirip dengan port URI pengalihan yang Anda daftarkan sebelumnya.

  2. Buka browser Anda, lalu buka http://localhost:3000. Anda melihat halaman masuk.

  3. Masuk dengan akun Microsoft Anda dengan mengikuti langkah-langkahnya. Anda diminta untuk memberikan alamat email dan kata sandi untuk masuk.

  4. Jika aplikasi memerlukan cakupan apa pun, layar persetujuan ditampilkan. Aplikasi meminta izin untuk mempertahankan akses ke data yang Anda izinkan aksesnya dan untuk masuk. Pilih Terima. Layar ini tidak muncul jika tidak ada cakupan yang ditentukan.

Setelah masuk atau mendaftar, Anda dialihkan kembali ke aplikasi web. Anda melihat halaman yang terlihat mirip dengan cuplikan layar berikut:

Cuplikan layar sampel aplikasi web flask setelah autentikasi berhasil.

Pilih Keluar untuk keluar dari aplikasi. Anda diminta untuk memilih akun yang ingin Anda keluar dari. Pilih akun yang Anda gunakan untuk masuk.

Menggunakan domain URL kustom (Opsional)

Penyewa tenaga kerja tidak mendukung domain URL kustom.