برنامه نویسی

“ورود با کلیدهای عبور” را به برنامه جنگو خود اضافه کنید

کلیدهای عبور، کلیدهای عبور، کلیدهای عبور! همه در مورد آنها صحبت می کنند. با انتشار رمز عبور آمازون در سال گذشته و تشویق کاربران توسط گوگل به تبدیل آنها به روش احراز هویت پیش فرض، این سوال مطرح می شود: چگونه آنها را به برنامه خود اضافه کنم؟

کلیدهای عبور چگونه کار می کنند؟

اگر فقط به اجرای آنها علاقه دارید، می توانید از این بخش صرف نظر کنید. توهین نشده 😉

اعتبار چند دستگاهی FIDO2 که اغلب به عنوان “کلیدهای عبور” شناخته می شود استانداردی است که توسط اتحاد FIDO معرفی شده است. این یک روش بسیار قدرتمند برای استفاده از رمزنگاری کلید عمومی برای تأیید هویت کاربر بدون رمز عبور، چند عاملی و غیره است.

برای کسب اطلاعات بیشتر در مورد نحوه عملکرد دقیق کلیدهای عبور و احراز هویت، مقاله Secure By Design Hub در مورد کلیدهای عبور را بررسی کنید.

چگونه آن را در آن بسازم؟

در این آموزش، می‌خواهیم از صفحات میزبانی شده Pangea AuthN استفاده کنیم تا بتوانیم به سرعت کلیدهای عبور را پیکربندی کنیم، بدون اینکه تمام مشکلات رمزنگاری را از ابتدا ایجاد کنیم. برای اثبات اینکه اضافه کردن کلیدهای عبور به هر برنامه ای در چند دقیقه آسان است، می خواهم با یک برنامه جدید جنگو شروع کنم و کلیدهای عبور را تنها در چند مرحله پیاده سازی کنم.

مرحله 1: یک برنامه جنگو جدید ایجاد کنید و وابستگی های مورد نیاز را نصب کنید

python -m pip install django
django-admin startproject mysite
cd mysite
python manage.py startapp authme
pip install python-dotenv pangea-django
python manage.py migrate
وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

برویم به mysite/mysite/settings.py به برنامه ما اجازه می دهد از این بسته ها استفاده کند.

ما باید بتوانیم:

  1. بارگذاری a .env فایل

  2. دسترسی به pangea-django میان افزار

  3. صفحات HTML ما را از یک مکان مشخص بارگیری کنید templates پوشه

from dotenv import load_dotenv
import os
from pathlib import Path

load_dotenv()

# Skip down to the middlware declaration. 
# Comment or remove the default django middleware. 
# Add Pangea's Auth Middleware

MIDDLEWARE = [
    "django.middleware.security.SecurityMiddleware",
    "django.contrib.sessions.middleware.SessionMiddleware",
    "django.middleware.common.CommonMiddleware",
    "django.middleware.csrf.CsrfViewMiddleware",
    #"django.contrib.auth.middleware.AuthenticationMiddleware",
    "pangea_django.PangeaAuthMiddleware",
    "django.contrib.messages.middleware.MessageMiddleware",
    "django.middleware.clickjacking.XFrameOptionsMiddleware",
]

# Replace the default configuration with the templates below
# templates folder is where we will keep our html

TEMPLATES = [
    {
        "BACKEND": "django.template.backends.django.DjangoTemplates",
        "DIRS": [os.path.join(BASE_DIR, "templates")],
        "APP_DIRS": True,
        "OPTIONS": {
            "context_processors": [
                "django.template.context_processors.debug",
                "django.template.context_processors.request",
                "django.contrib.auth.context_processors.auth",
                "django.contrib.messages.context_processors.messages",
            ],
        },
    },
]
وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

مرحله 2: یک حساب کاربری در pangea.cloud ایجاد کنید

به pangea.cloud بروید و یک حساب کاربری رایگان ایجاد کنید. سپس در کنسول توسعه دهنده، سرویس “AuthN” را فعال کنید و توکن های زیر را بگیرید.

این نشانه‌ها در فایل پیکربندی .env شما مانند شکل زیر جای‌گذاری می‌شوند. این نشانه ها را ایجاد و اضافه کنید mysite/.env فایل مانند این:

PANGEA_AUTHN_TOKEN=
PANGEA_DOMAIN=
PANGEA_HOSTED_LOGIN=
وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

مرحله 3: اجزای Pangea Auth را به برنامه جدید جنگو اضافه کنید

اکنون ما خود را ویرایش می کنیم mysite/authme/views.py فایل با pangea_django بسته ای که زمینه و وضعیت احراز هویت را در سراسر برنامه حفظ می کند.

پس ما authme/views.py فایل باید به شکل زیر باشد:

from django.shortcuts import render, redirect
from django.contrib.auth.decorators import login_required
from pangea_django import PangeaAuthentication, generate_state_param
import os

# Create your views here.

def landing(request):
    if request.user.is_authenticated:
        return redirect("/home")

    hosted_login = os.getenv("PANGEA_HOSTED_LOGIN")
    redirect_url = hosted_login + "?state=" + generate_state_param(request)

    return redirect(redirect_url)

def login_success(request):
    user = PangeaAuthentication().authenticate(request=request)
    if user:
        return redirect("/home")
    return redirect("/")

@login_required(login_url="/")
def logout(request):
    user = PangeaAuthentication().logout(request)
    return redirect("/logout")

@login_required(login_url="/")
def home(request):
    context = {}
    context["user"] = request.user
    return render(request, "home.html", context)
وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

بعد باید این نماها را به مسیرها ترسیم کنیم. ما این کار را در mysite/mysite/urls.py

from django.urls import path
import authme

urlpatterns = [
    path('', authme.views.landing),
    path('home', authme.views.home),
    path('login_success', authme.views.login_success),
    path('logout', authme.views.logout),
]
وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

برنامه باید بتواند دسترسی داشته باشد mysite/authme/views.py از جانب mysite/mysite/urls.py. این خط را به mysite/authme/__init__.py

from . import views
وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

در نهایت ما به صفحه ای نیاز داریم تا این احراز هویت به آن رندر شود. روشی که ما در جنگو صفحات می سازیم با ایجاد یک پوشه templates با صفحات html است. از آنجا که authme.view.home در حال مسیریابی به /home، باید با صفحه خود تماس بگیریم mysite/templates/home.html




 charset="UTF-8">
 name="viewport" content="width=device-width, initial-scale=1">

body,h1,h2,h3,h4,h5,h6 {font-family: "Lato", sans-serif;}
body, html {
  height: 100%;
  color: #b47b00;
  line-height: 1.8;
  background-color: antiquewhite;
}
table {
  margin: 0px auto;
  background-color: white;
  padding: 25px;
}
tr {
  font-family: Verdana, Tahoma, sans-serif;
  font-size: 20px;
  color: #rgb(158, 108, 0);
}
td {
  padding: 2px;
}



  
  
  
  
    
ID: {{ user.id }}
Email: {{ user.email }}
First Name: {{ user.first_name }}
Last Name: {{ user.last_name }}
Last Login: {{ user.last_login }}
وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

مرحله 4: Redirect را اضافه کنید و کلیدهای عبور را در کنسول Pangea فعال کنید

ما باید یک تغییر مسیر مجاز اضافه کنیم، تا صفحات میزبانی شده AuthN Pangea با موفقیت ما را به http://127.0.0.1:8000/home هدایت کنند، زمانی که یک کاربر احراز هویت انجام شد.

پس ابتدا بیایید به زیر برویم General > Redirect (Callback) Settings و http://127.0.0.1:8000/home را به عنوان تغییر مسیر اضافه کنید و ذخیره کنید.

در اینجا آخرین مرحله فرا می رسد، بیایید Passkeys را فعال کنیم! سر به Single Sign On > Passkeys و آن را فعال کنید. به صورت اختیاری می‌توانید انتخاب کنید که گزینه‌های احراز هویت مجدد بر اساس تجربه کاربری مورد نظرتان فعال شود.

در اینجا یک ویدیوی سریع در مورد نحوه فعال کردن آن در تنظیمات وجود دارد:

بیایید آن را امتحان کنیم! می توانید کد را در Github پیدا کنید و نسخه ی نمایشی را در زیر مشاهده کنید.


اگر به دنبال اضافه کردن AuthN به سایر زبان ها یا فریم ورک ها هستید، این آموزش ها را دنبال کنید:

نوشته های مشابه

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

دکمه بازگشت به بالا