Rumah  >  Artikel  >  pembangunan bahagian belakang  >  Cara Mengintegrasikan Kunci Laluan dalam Python (FastAPI)

Cara Mengintegrasikan Kunci Laluan dalam Python (FastAPI)

WBOY
WBOYasal
2024-08-31 14:43:03467semak imbas

pengenalan

Dalam panduan ini, kami akan membimbing anda melalui proses penyepaduan pengesahan kunci laluan ke dalam aplikasi web Python menggunakan rangka kerja FastAPI. Pelaksanaan ini memanfaatkan pakej web-js pertama kunci laluan Corbado, yang menyelaraskan penyepaduan dengan hujung belakang kunci laluan. Menjelang akhir tutorial ini, anda akan mempunyai apl FastAPI yang berfungsi dengan pengesahan berasaskan kunci laluan.

Baca tutorial asal penuh di sini

Prasyarat untuk Penyepaduan Kunci Laluan FastAPI

Untuk mengikuti tutorial ini, anda harus mempunyai pemahaman asas tentang Python, FastAPI, HTML dan JavaScript. 
Selain itu, anda memerlukan akaun Corbado untuk menggunakan perkhidmatan kunci laluan. Jom mulakan!

Struktur Projek FastAPI Passkey

Projek FastAPI anda akan mengandungi beberapa fail utama. Yang penting termasuk:

├── .env                 # Contains all environment variables
├── main.py              # Contains our webapplication (Handles routes)
└── templates
 ├── index.html       # Login page
 └── profile.html     # Profile page

Menyediakan Akaun Corbado Anda

Sebelum anda memulakan pengekodan, sediakan akaun Corbado. Ini akan membolehkan anda mengakses perkhidmatan kunci laluan mereka. Ikuti langkah ini:

  1. Daftar: Daftar pada panel pembangun Corbado.
  2. Buat Projek: Namakan projek anda dan pilih "Corbado Complete" semasa persediaan.
  3. Persediaan Persekitaran: Pilih "DEV" sebagai persekitaran anda dan "Apl Web" untuk jenis aplikasi.
  4. Pengurusan Sesi: Pilih "Pengurusan sesi Corbado" untuk mengendalikan kedua-dua pengesahan kunci laluan dan pengurusan sesi.
  5. Rangka Kerja Depan: Pilih "Vanilla JS" sebagai rangka kerja hadapan anda.
  6. Konfigurasi: Tetapkan URL Aplikasi anda (cth., http://localhost:8000) dan ID Pihak Bergantung (cth., localhost).

Selepas menyediakan, anda akan menerima coretan HTML/JavaScript yang akan anda sepadukan ke dalam projek FastAPI anda.

Memulakan Projek FastAPI

Mulakan dengan mencipta fail main.py jika anda belum melakukannya. Pasang FastAPI dan pakej lain yang diperlukan dengan:

pip install fastapi python-dotenv passkeys

Main.py anda akan mengendalikan logik aplikasi, termasuk menyediakan laluan dan menguruskan sesi.

Mengkonfigurasi Pembolehubah Persekitaran

Dalam akar projek anda, buat fail .env untuk menyimpan pembolehubah persekitaran anda:

PROJECT_ID=your_project_id
API_SECRET=your_api_secret

Muatkan pembolehubah ini ke dalam aplikasi anda menggunakan python-dotenv:

from dotenv import load_dotenv
import os

load_dotenv()
PROJECT_ID = os.getenv("PROJECT_ID")
API_SECRET = os.getenv("API_SECRET")

Mencipta Templat HTML dengan Pengurusan Sesi

Seterusnya, sediakan templat HTML anda. Dalam templat/ direktori, cipta login.html dan profile.html. Ini termasuk JavaScript yang diperlukan untuk menyepadukan komponen pengesahan Corbado.
Berikut ialah struktur asas untuk log masuk.html:

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="https://unpkg.com/@corbado/web-js@latest/dist/bundle/index.css" />
    <script src="https://unpkg.com/@corbado/web-js@latest/dist/bundle/index.js"></script>
</head>
<body>
    <script>
        (async () => {
            await Corbado.load({
                projectId: "{{ PROJECT_ID }}",
                darkMode: "off",
                setShortSessionCookie: "true",
            });
            Corbado.mountAuthUI(document.getElementById('corbado-auth'), {
                onLoggedIn: () => window.location.href = '/profile',
            });
        })();
    </script>
    <div id="corbado-auth"></div>
</body>
</html>

Untuk profile.html, masukkan elemen untuk memaparkan data pengguna dan butang log keluar:

<!DOCTYPE html>
<html>
  <head>
    <link
      rel="stylesheet"
      href="https://unpkg.com/@corbado/web-js@latest/dist/bundle/index.css"
      />
      <script src="https://unpkg.com/@corbado/web-js@latest/dist/bundle/index.js"></script>
    </head>
    <body>

      <!-- Define passkey-list div and logout button -->
    <h2>:/protected ?</h2>
    <p>User ID: {{USER_ID}}</p>
    <p>Name: {{USER_NAME}}</p>
    <p>Email: {{USER_EMAIL}}</p>
    <div id="passkey-list"></div>
    <button id="logoutButton">Logout</button>


    <!-- Script to load Corbado and mount PasskeyList UI -->
    <script>
 (async () => {
            await Corbado.load({
                projectId: "{{ PROJECT_ID }}",
                darkMode: "off",
                setShortSessionCookie: "true" // set short session cookie automatically
 }); 

            // Get and mount PasskeyList UI
            const passkeyListElement = document.getElementById("passkey-list"); // Element where you want to render PasskeyList UI
            Corbado.mountPasskeyListUI(passkeyListElement);

            // Get the logout button
            const logoutButton = document.getElementById('logoutButton');
            // Add event listener to logout button
 logoutButton.addEventListener('click', function() {
              Corbado.logout()
 .then(() => {
                        window.location.replace("/");
 })
 .catch(err => {
                        console.error(err);
 });
 });
 })();
    </script>


</body>
</html>

Menyediakan Pengawal FastAPI

Logik pengawal anda akan berada dalam fail main.py. Fail ini akan mengurus laluan untuk kedua-dua halaman log masuk dan profil. Laluan log masuk hanya akan menyuntik PROJECT_ID ke dalam templat, manakala laluan profil akan mengesahkan sesi dan mengambil data pengguna menggunakan SDK Python Corbado.

Contoh main.py:

from typing import List
from corbado_python_sdk.entities.session_validation_result import (
    SessionValidationResult,
)
from corbado_python_sdk.generated.models.identifier import Identifier

from fastapi import FastAPI, Request, Response
from fastapi.responses import HTMLResponse
from fastapi.templating import Jinja2Templates
from dotenv import load_dotenv
import os
from corbado_python_sdk import (
    Config,
    CorbadoSDK,
    IdentifierInterface,
    SessionInterface,
)

load_dotenv()

app = FastAPI()

templates = Jinja2Templates(directory="templates")

PROJECT_ID: str = os.getenv("PROJECT_ID", "pro-xxx")
API_SECRET: str = os.getenv("API_SECRET", "corbado1_xxx")

# Session config
short_session_cookie_name = "cbo_short_session"

# Config has a default values for 'short_session_cookie_name' and 'BACKEND_API'
config: Config = Config(
    api_secret=API_SECRET,
    project_id=PROJECT_ID,
)

# Initialize SDK
sdk: CorbadoSDK = CorbadoSDK(config=config)
sessions: SessionInterface = sdk.sessions
identifiers: IdentifierInterface = sdk.identifiers


@app.get("/", response_class=HTMLResponse)
async def get_login(request: Request):
    return templates.TemplateResponse(
        "login.html", {"request": request, "PROJECT_ID": PROJECT_ID}
    )


@app.get("/profile", response_class=HTMLResponse)
async def get_profile(request: Request):
    # Acquire cookies with your preferred method
    token: str = request.cookies.get(config.short_session_cookie_name) or ""
    validation_result: SessionValidationResult = (
        sessions.get_and_validate_short_session_value(short_session=token)
    )
    if validation_result.authenticated:

        emailList: List[Identifier] = identifiers.list_all_emails_by_user_id(
            user_id=validation_result.user_id
            or ""  # at this point user_id should be non empty string since user was authenticated
        )

        context = {
            "request": request,
            "PROJECT_ID": PROJECT_ID,
            "USER_ID": validation_result.user_id,
            "USER_NAME": validation_result.full_name,
            "USER_EMAIL": emailList[0].value,
        }
        return templates.TemplateResponse("profile.html", context)

    else:
        return Response(
            content="You are not authenticated or have not yet confirmed your email.",
            status_code=401,
        )


if __name__ == "__main__":
    import uvicorn

    uvicorn.run(app, host="127.0.0.1", port=8000)

Menjalankan Aplikasi FastAPI

Akhir sekali, untuk menjalankan aplikasi FastAPI anda, pasang Uvicorn:

pip install 'uvicorn[standard]'

Kemudian, mulakan pelayan anda:

uvicorn main:app --reload

Lawati http://localhost:8000 dalam penyemak imbas anda untuk melihat komponen UI dalam tindakan.

How to Integrate Passkeys in Python (FastAPI)

Kesimpulan

Tutorial ini menunjukkan cara untuk menyepadukan pengesahan kunci laluan ke dalam aplikasi FastAPI menggunakan pakej web-js Corbado. Persediaan ini menyediakan kaedah pengesahan yang selamat dan moden, di samping mengurus sesi pengguna dengan lancar. Untuk mendapatkan butiran lanjut tentang melanjutkan pelaksanaan ini atau menyepadukan dengan apl sedia ada, rujuk dokumentasi Corbado.

Atas ialah kandungan terperinci Cara Mengintegrasikan Kunci Laluan dalam Python (FastAPI). Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya:Jenis Casting Par-06Artikel seterusnya:Jenis Casting Par-06