تقنيات نور التعليمية تقنيات نور التعليمية

آخر الأخبار

جاري التحميل ...

🧩 الدرس السابع: نظام تسجيل الدخول والخروج داخل Dashboard مخصص

 نظام تسجيل الدخول والخروج داخل Dashboard مخصص

(Login – Logout – حماية الصفحات – Remember Me)

في هذا الدرس سنبني نظام Auth كامل بدون الاعتماد على Django Admin.

 

Dashboard


🎯 أهداف الدرس

بنهاية الدرس ستتعلم:

  • إنشاء صفحة تسجيل دخول مخصصة
  • تسجيل الخروج بشكل آمن
  • حماية جميع صفحات الـ Dashboard
  • تفعيل خيار "تذكرني"
  • إعادة التوجيه حسب الدور


🧱 هيكل الملفات

dashboard/
│── forms.py
│── views.py
│── urls.py
│── templates/
│   └── auth/
│       ├── login.html

🧠 1️⃣ إنشاء Login Form

dashboard/forms.py

from django import forms

class LoginForm(forms.Form):
    username = forms.CharField(label="اسم المستخدم")
    password = forms.CharField(
        widget=forms.PasswordInput,
        label="كلمة المرور"
    )
    remember_me = forms.BooleanField(
        required=False,
        label="تذكرني"
    )

🧠 2️⃣ منطق تسجيل الدخول

dashboard/views.py

from django.contrib.auth import authenticate, login, logout
from .forms import LoginForm

def login_view(request):
    if request.user.is_authenticated:
        return redirect("dashboard")

    form = LoginForm(request.POST or None)

    if request.method == "POST" and form.is_valid():
        user = authenticate(
            request,
            username=form.cleaned_data["username"],
            password=form.cleaned_data["password"]
        )

        if user:
            login(request, user)

            if not form.cleaned_data["remember_me"]:
                request.session.set_expiry(0)

            return redirect("dashboard")
        else:
            messages.error(request, "بيانات الدخول غير صحيحة")

    return render(request, "auth/login.html", {"form": form})


@login_required
def logout_view(request):
    logout(request)
    return redirect("login")

🌐 3️⃣ URLs تسجيل الدخول والخروج

dashboard/urls.py

from .views import login_view, logout_view

urlpatterns += [
    path("login/", login_view, name="login"),
    path("logout/", logout_view, name="logout"),
]

ولا تنسَ ضبط الإعدادات:

settings.py

LOGIN_URL = "login"
LOGIN_REDIRECT_URL = "dashboard"
LOGOUT_REDIRECT_URL = "login"

🎨 4️⃣ تصميم صفحة تسجيل الدخول

templates/auth/login.html

<!DOCTYPE html>
<html>
<head>
    <title>Login</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body class="bg-light">

<div class="container d-flex justify-content-center align-items-center vh-100">
    <form method="post" class="card p-4 shadow" style="width: 350px;">
        {% csrf_token %}
        <h4 class="mb-3 text-center">تسجيل الدخول</h4>

        {{ form.as_p }}

        <button class="btn btn-dark w-100">دخول</button>
    </form>
</div>

</body>
</html>

🔐 5️⃣ حماية الصفحات

كل Views الـ Dashboard محمية بالفعل باستخدام:

@login_required

وأي مستخدم غير مسجّل:
✔ يُعاد تلقائيًا لصفحة الدخول
✔ لا يستطيع رؤية أي محتوى


🧪 تمرين الدرس السابع

طبّق التالي:

  1. إعادة توجيه Editor لصفحة مختلفة
  2. عرض رسالة ترحيب حسب الدور
  3. منع الدخول للمستخدم المعطّل is_active=False

✅ حل تمرين الدرس السابع

(تسجيل الدخول المتقدم + إعادة التوجيه + حماية المستخدمين)

✔ المطلوب في التمرين:

  1. إعادة توجيه Editor لصفحة مختلفة
  2. عرض رسالة ترحيب حسب الدور
  3. منع تسجيل دخول المستخدم المعطّل is_active = False


🧱 1️⃣ تحديث منطق تسجيل الدخول (Views)

dashboard/views.py

from django.contrib.auth import authenticate, login, logout
from django.contrib import messages
from django.shortcuts import render, redirect
from .forms import LoginForm

def login_view(request):
    if request.user.is_authenticated:
        return redirect("dashboard")

    form = LoginForm(request.POST or None)

    if request.method == "POST" and form.is_valid():
        username = form.cleaned_data["username"]
        password = form.cleaned_data["password"]

        user = authenticate(request, username=username, password=password)

        # ❌ بيانات خاطئة
        if user is None:
            messages.error(request, "اسم المستخدم أو كلمة المرور غير صحيحة")
            return render(request, "auth/login.html", {"form": form})

        # ❌ حساب معطّل
        if not user.is_active:
            messages.error(request, "تم تعطيل هذا الحساب، تواصل مع الإدارة")
            return render(request, "auth/login.html", {"form": form})

        # ✅ تسجيل الدخول
        login(request, user)

        # Remember me
        if not form.cleaned_data.get("remember_me"):
            request.session.set_expiry(0)

        # 🎯 إعادة التوجيه حسب الدور
        if user.groups.filter(name="Admin").exists():
            messages.success(request, "مرحبًا بك أيها المدير 👑")
            return redirect("dashboard")

        if user.groups.filter(name="Editor").exists():
            messages.success(request, "مرحبًا بك أيها المحرر ✍️")
            return redirect("editor_home")

        # مستخدم بدون دور
        messages.info(request, "تم تسجيل الدخول")
        return redirect("dashboard")

    return render(request, "auth/login.html", {"form": form})

🧱 2️⃣ إنشاء صفحة خاصة بالمحرر (Editor)

dashboard/views.py

from django.contrib.auth.decorators import login_required

@login_required
def editor_home(request):
    if not request.user.groups.filter(name="Editor").exists():
        return redirect("dashboard")

    return render(request, "dashboard/editor_home.html")

🌐 3️⃣ تحديث URLs

dashboard/urls.py

path("editor/", editor_home, name="editor_home"),

🎨 4️⃣ صفحة المحرر (Editor Dashboard)

dashboard/templates/dashboard/editor_home.html

{% extends "dashboard/base.html" %}

{% block content %}
<h2>لوحة المحرر</h2>

<div class="alert alert-info mt-3">
    مرحبًا {{ request.user.username }} 👋  
    يمكنك تعديل المحتوى المسموح لك به فقط.
</div>
{% endblock %}

🎨 5️⃣ تحسين صفحة تسجيل الدخول (رسائل التنبيه)

templates/auth/login.html

أضف هذا السطر داخل الـ <form>:

{% if messages %}
    {% for message in messages %}
        <div class="alert alert-warning">{{ message }}</div>
    {% endfor %}
{% endif %}

🔐 ماذا تحقق الآن؟

✔ منع دخول الحسابات المعطلة
✔ إعادة توجيه ذكي حسب الدور
✔ تجربة مستخدم احترافية
✔ نظام Auth كامل خارج Django Admin
✔ جاهز للتوسعة (صلاحيات – Logs – Activity)


🏁 الخلاصة

بهذا الدرس:

  • اكتمل نظام الدخول والخروج
  • أصبح المشروع جاهزًا للإنتاج

عن الكاتب

Tamer Ahmed

التعليقات


اتصل بنا

إذا أعجبك محتوى مدونتنا نتمنى البقاء على تواصل دائم ، فقط قم بإدخال بريدك الإلكتروني للإشتراك في بريد المدونة السريع ليصلك جديد المدونة أولاً بأول ، كما يمكنك إرسال رساله بالضغط على الزر المجاور ...

جميع الحقوق محفوظة

تقنيات نور التعليمية