Home-theater-designers
django-allauth היא חבילת Django המאפשרת לך לבנות מערכת אימות עבור אפליקציות ה-Django שלך במהירות ובקלות. יש לו תבניות מובנות כדי לאפשר לך להתמקד בחלקים חשובים אחרים של האפליקציה שלך.
סרטון היום של MUO גלול כדי להמשיך עם התוכן
למרות שהתבניות המובנות מועילות, תרצה לשנות אותן כי אין להן את ממשק המשתמש הטוב ביותר.
כיצד להתקין ולהגדיר django-allauth
על ידי ביצוע מספר שלבים פשוטים, אתה יכול להתקין בצורה חלקה django-allauth בפרויקט Django שלך.
- אתה יכול להתקין django-allauth חבילה באמצעות מנהל החבילות Pip:
pip install django-allauth - בקובץ ההגדרות של הפרויקט שלך, הוסף את האפליקציות האלה ליישומים המותקנים שלך:
INSTALLED_APPS = [
"""
Add your other apps here
"""
# Djang-allauth configuration apps
'django.contrib.sites',
'allauth',
'allauth.account',
'allauth.socialaccount', # add this if you want to enable social authentication
] - הוסף קצה עורפי של אימות לקובץ ההגדרות שלך:
AUTHENTICATION_BACKENDS = [
'django.contrib.auth.backends.ModelBackend',
'allauth.account.auth_backends.AuthenticationBackend',
] - הוסף מזהה אתר לפרויקט שלך:
SITE_ID = 1 - הגדר את כתובות האתרים עבור django-allauth:
from django.urls import path, include
urlpatterns = [
# Djang-allauth url pattern
path('accounts/', include('allauth.urls')),
]
אם תבצע את התצורות הנ'ל כהלכה, אתה אמור לראות תבנית כזו כשאתה מנווט אליה http://127.0.0.1:8000/accounts/signup/ :
תוכל לראות את רשימת כתובות האתרים הזמינות על ידי ניווט אל http://127.0.0.1:8000/accounts/ עם DEBUG=נכון בקובץ ההגדרות שלך.
כיצד לעקוף את תבנית הכניסה ב-django-allauth
ראשית, עליך להגדיר את תבניות תיקייה אם לא עשית זאת. פתח את קובץ ההגדרות שלך ונווט אל תבניות רשימה. בתוכו, אתר את DIRS רשימה, ושנה אותה כך:
'DIRS': [BASE_DIR/'templates'],
ודא שיש לך א תבניות תיקיה בספריית השורש של הפרויקט שלך. אתה יכול לעקוף את תבנית ההתחברות המוגדרת כברירת מחדל ב-django-allauth על ידי ביצוע השלבים הבאים.
שלב 1: צור את קובצי התבנית שלך
אצלך תבניות תיקיה, צור תיקיה חדשה בשם חֶשְׁבּוֹן להחזיק את התבניות הקשורות ל-django-allauth.
תבניות הרישום והכניסה צריכות להיות signup.html ו login.html בהתאמה. אתה יכול לקבוע את שם התבנית הנכון על ידי פתיחת שלך סביבה וירטואלית של Python ומנווט אל Lib > חבילות אתר > allauth > תבניות > חשבון תיקייה כדי למצוא את התבניות. כדאי לעבור על הקוד כדי להבין איך התבניות עובדות. לדוגמה, תבנית ההתחברות כוללת את הקוד הזה:
שלב 2: הוסף קוד HTML לקובצי התבניות שלך
לאחר יצירת הקבצים שלך, עליך להוסיף את קוד ה-HTML המותאם אישית עבור התבנית שלך. לדוגמה, כדי לעקוף את תבנית ההתחברות למעלה, אולי תרצה להעתיק הכל מה- {% אחר %} בלוק, המכיל את הטופס וכפתור השליחה, והוסיפו אותו לתבנית המותאמת אישית שלך. הנה דוגמה:
{% extends 'base.html' %}
{% block content %}
<p>If you have not created an account yet, then please
<a href="{{ signup_url }}">sign up</a> first.</p>
<form class="login" method="POST" action="{% url 'account_login' %}">
{% csrf_token %}
{{ form.as_p }}
{% if redirect_field_value %}
<input type="hidden" name="{{ redirect_field_name }}" value="{{ redirect_field_value }}" />
{% endif %}
<a class="button secondaryAction" href="{% url 'account_reset_password' %}">Forgot password?</a>
<button class="primaryAction" type="submit">SIgn in</button>
</form>
{% endblock content %}
הקוד לעיל משתמש ירושת התבנית של ג'נגו לרשת תכונות מה base.html תבנית. ודא שאתה מסיר תגים מיותרים כגון {% blocktrans %} תָג. אם עשית זאת, דף הכניסה שלך צריך להיות דומה לזה:
הכותרת העליונה והתחתונה בתמונה למעלה יהיו שונים משלך.
שלב 3: הוסף סגנונות מותאמים אישית לטופס שלך
בשלב הקודם, טופס הכניסה מוצג כפסקה באמצעות ה- {{ form.as_p }} תָג. כדי להוסיף סגנונות לטופס שלך, עליך לדעת את הערך של ה- שֵׁם תכונה הקשורה לכל שדה קלט.
אין מספיק מקום בדיסק
אתה יכול לבדוק את הדף שלך כדי לקבל את הערכים שאתה צריך.
התמונה למעלה מציגה את תכונת השם המשויכת ל- אימייל שדה של הטופס.
כעת, אתה יכול להוסיף את שדות הטופס בנפרד לפרוייקט שלך. לדוגמה, אתה יכול להוסיף את שדה האימייל כך:
{{ form.login }}
<label for="{{form.login.id_for_label}}">Email</label>
{{ form.login.errors|safe }}
אתה יכול השתמש ב-Bootstrap עם פרויקט ה-Django שלך כדי לעצב בקלות את הטופס שלך. הנה דוגמה:
<div class="form-floating form-group">
{{ form.login }}
<label for="{{form.login.id_for_label}}">Email</label>
{{ form.login.errors|safe }}
</div>
הקוד לעיל מוסיף לטופס שיעורי טופס Bootstrap. כעת, אתה יכול להוסיף את השדות האחרים שאתה צריך ולעצב אותם לפי העדפתך. אם אתה לא נהנה להשתמש ב-Bootstrap לסטיילינג, django-crispy-forms הוא חלופה לעיצוב הטפסים שלך . הדוגמה שלהלן משתמשת ב- Bootstrap לסטיילינג.
<div class="container d-flex justify-content-center align-items-center vh-100">
<form method="post" class="login" id="signup_form" action="{% url 'account_login' %}">
<div class="text-center mb-4">
<h1 class="h3 mb-3 font-weight-normal">Sign in</h1>
</div>
{{ form.non_field_errors | safe }}
{% csrf_token %}
<div class="row g-3">
<div class="col-12">
<div class="form-floating form-group">
{{ form.login }}
<label for="{{form.login.id_for_label}}">Email</label>
{{ form.login.errors|safe }}
</div>
</div>
<div class="col-12">
<div class="form-floating form-group my-3">
{{ form.password }}
<label for="{{form.password.id_for_label}}">Password</label>
{{ form.password.errors|safe }}
</div>
</div>
<div class="col-12">
<div class="form-check">
<label for="{{form.remember.id_for_label}}" class="form-check-label">Remember me</label>
{{ form.remember }}
</div>
</div>
<div class="col-6">
{% if redirect_field_value %}
<input type="hidden" name="{{ redirect_field_name }}" value="{{ redirect_field_value }}" />
{% endif %}
<button class="btn btn-primary w-100 py-3 bg-accent" type="submit">Sign in</button>
<a class="button secondaryAction text-accent" href="{% url 'account_reset_password' %}">Forgot
Password?</a>
</div>
</div>
</form>
</div>
בלוק הקוד שלמעלה יפיק פלט דומה לתמונה הבאה:
אתה יכול ללמוד עוד על טפסים ב-django-allauth על ידי קריאת ה תיעוד רשמי .
עוקף כל תבנית ב-django-allauth
django-allauth מכיל תבניות ברירת מחדל רבות שאתה יכול לעקוף. עם השלבים במדריך זה, אתה יכול לעקוף כל תבנית ב-django-allauth. עליך לשקול להשתמש בחבילה זו כדי לטפל במערכת האימות שלך, כדי שתוכל להתמקד בבניית התכונות החשובות האחרות של היישום שלך.