实现用户注册与登录、登出（一）

最新推荐文章于 2024-05-05 13:47:43 发布

原创最新推荐文章于 2024-05-05 13:47:43 发布 · 2.8k 阅读

1 ·

CC 4.0 BY-SA版权

-----Django 专栏收录该内容

29 篇文章

订阅专栏

这篇博客详细介绍了如何实现用户注册与登录的基本流程，包括登录页面的设计与功能验证，以及登出操作。内容覆盖了从用户输入到验证登录信息的整个过程，确保了用户在系统中的安全交互。

实现登录功能

(只实现了从登录页面登录，admin后台退出的页面)

F

from django import forms

class LoginForm(forms.Form):
        username = forms.CharField()
        password = forms.CharField()

V

from django.shortcuts import render, Http404, HttpResponse, redirect
from website.models import Video
from django.core.paginator import Paginator, EmptyPage, PageNotAnInteger
from django.contrib.auth import authenticate, login
from website.form import LoginForm

# Create your views here.
def listing(request, cate=None):
    context = {}
    if cate is None:
        vids_list = Video.objects.all()
    if cate == 'editors':
        vids_list = Video.objects.filter(editors_choice=True)
    else:
        vids_list = Video.objects.all()
    page_robot = Paginator(vids_list, 9)
    page_num = request.GET.get('page')
    try:
        vids_list = page_robot.page(page_num)
    except EmptyPage:
        vids_list = page_robot.page(page_robot.num_pages)
        #raise Http404('EmptyPage')
    except PageNotAnInteger:
        vids_list = page_robot.page(1)
    context['vids_list'] = vids_list
    return render(request, 'listing.html', context)

def index_login(request):
    context = {}
    if request.method == "GET":
        form = LoginForm
    if request.method == "POST":
        form = LoginForm(request.POST)
        if form.is_valid():
            username = form.cleaned_data['username']
            password = form.cleaned_data['password']
            user = authenticate(username=username, password=password)
            if user:
                login(request, user)
                return redirect(to='list')
            else:
                return HttpResponse('<h1>Not A USER!</h1>')
    context['form'] = form
    return render(request, 'register_login.html', context)

U

from django.conf.urls import url
from django.contrib import admin
from website.views import listing, index_login
from django.conf import settings
from django.conf.urls.static import static

urlpatterns = [
    url(r'^admin/', admin.site.urls),
    url(r'^list/$', listing, name='list'),
    url(r'^list/(?P<cate>[A-Za-z]+)$', listing, name='list'),
    url(r'^login/$', index_login, name='login'),
]

if settings.DEBUG:
    urlpatterns += static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
    urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
#在本地运行时使用

T

listing.html
判断列表页面显示名字还是默认

<div class="right menu">
            {% if request.user.is_authenticated %}
                <div class="item">
                    <h5 class="ui inverted header">
                        <span style="margin-right:20px;">{{ request.user.username }}</span>
                        <div class="ui mini circular image">
                            <img src="http://semantic-ui.com/images/avatar/small/matt.jpg" alt="" />
                        </div>
                    </h5>
                </div>
                <div class="item">
                    <a href="#" class="ui inverted circular button">Logout</a>
                </div>
            {% else %}
                <div class="item">
                    <h5 class="ui inverted header">
                    <span style="margin-right:20px">{{ request.user.username }}</span>
                    <div class="ui mini circular image">
                        <img src="http://semantic-ui.com/images/avatar/small/matt.jpg" alt="" />
                    </div>
                </h5>
                </div>
                <div class="item">
                    <a href="#" class="ui inverted circular button">Signup/Login</a>
                </div>
            {% endif %}
        </div>

{% load staticfiles %}

<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <meta charset="utf-8">
    <title></title>
    <link rel="stylesheet" href="{% static 'css/semantic.css' %}" media="screen" title="no title" charset="utf-8">
    <link rel="stylesheet" href="{% static  'css/list_custom.css' %}" media="screen" title="no title" charset="utf-8">

</head>

<body>
    <div class="ui inverted top fixed menu borderless red menu">
        <div class="header item">
            <div class="ui image">
                <img src="{% static 'images/tenlogo.png' %}" alt="">
            </div>
        </div>

        <div class="right menu">
            {% if request.user.is_authenticated %}
                <div class="item">
                    <h5 class="ui inverted header">
                        <span style="margin-right:20px;">{{ request.user.username }}</span>
                        <div class="ui mini circular image">
                            <img src="http://semantic-ui.com/images/avatar/small/matt.jpg" alt="" />
                        </div>
                    </h5>
                </div>
                <div class="item">
                    <a href="#" class="ui inverted circular button">Logout</a>
                </div>
            {% else %}
                <div class="item">
                    <h5 class="ui inverted header">
                    <span style="margin-right:20px">{{ request.user.username }}</span>
                    <div class="ui mini circular image">
                        <img src="http://semantic-ui.com/images/avatar/small/matt.jpg" alt="" />
                    </div>
                </h5>
                </div>
                <div class="item">
                    <a href="#" class="ui inverted circular button">Signup/Login</a>
                </div>
            {% endif %}
        </div>
    </div>
    <div class="ui inverted segment container nav">
        <div class="ui  three borderless  item  menu">
            <a class="item" >
                All
            </a>
            <a class="item">
                New
            </a>
            {% if 'editors' in request.path %}
                <a class="active item" href="{% url 'list' %}editors">
                Editor's
            </a>
            {% else %}
                <a class="item" href="{% url 'list' %}editors">
                Editor's
            </a>
            {% endif %}
        </div>
    </div>


    <div class="ui basic segment container content">

        <div class="ui three column grid">
            {% for article in vids_list %}
            <div class="column">
                <a class="ui fluid card" href="{% url 'list' %}">
                    <div class="image">
                        {% if article.cover %}
                            <img src="/upload/{{ article.cover }}" alt="" style="height:200px;object-fit: cover;">
                        {% else %}
                            <img src="{{ article.url_image }}" alt="" style="height:200px;object-fit: cover;">
                        {% endif %}
                    </div>
                </a>

                <div class="title header" href="{% url 'list' %}">{{ article.title }}</div>

                <i class="icon grey unhide"></i>
                <span style="color:#bbbbbb">{{ article.views }}</span>

                <span class="" style="color:rgb(226, 226, 226)">|</span>

                <i class="icon grey checkmark"></i>
                <span style="color:#bbbbbb"> {{ article.favs }} people got it</span>

            </div>
            {% endfor %}
        </div>
    </div>

    <div class="ui center aligned very padded vertical segment container">
        <div class="ui pagination menu">
            {% if vids_list.has_previous %}
                <a href="?page={{ vids_list.previous_page_number }}" class="item">
                    <i class="icon red left arrow"></i>
                </a>
            {% else %}
                <a href="?page={{ vids_list.start_index }}" class="disabled item">
                    <i class="icon left arrow"></i>
                </a>
            {% endif %}

            {% if vids_list.has_next %}
                <a href="?page={{ vids_list.next_page_number }}" class="item">
                    <i class="icon red right arrow"></i>
                </a>
            {% else %}
                <a href="?page={{ vids_list.end_index }}" class="disabled item">
                    <i class="icon right arrow"></i>
                </a>
            {% endif %}

        </div>
    </div>
</body>

</html>

登录页面
register_login.html

<!DOCTYPE html>
{% load staticfiles %}
<html>
<head>
    <meta charset="UTF-8">
    <title>Login</title>
    <link rel="stylesheet" href="{% static 'css/semantic.css' %}" media="screen" title="no title" charset="utf-8">
    <link rel="stylesheet" href="{% static 'css/list_custom.css' %}" media="screen" title="no title" charset="utf-8">
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Oswald|Raleway">
    <style type="text/css">
        body {
            background: url({% static 'images/super_blur_back2.jpg' %});
            background-size: cover;
        }
        .ui.grid.divided.segment.container {
            min-height: 400px;
            width: 600px !important;
            border: rgba(255, 0, 0, 0);
            position: absolute;
            left: 50%;
            top: 40%;
            transform: translate(-50%, -50%);
        }
        .five.wide.column {
            background: url({% static 'images/red_regi.jpg' %});
            background-size: cover;
            background-position: 60% 0%;
        }
        form {
            margin-top: 60px;
        }
        h1,h3,h4 {
            font-family: 'Play', sans-serif !important;
        }
    </style>
</head>
<body>
    <div class="ui grid divided segment container">
        <div class="five wide column">
            <h4 class="ui inverted header">
                <i class="angle left icon"></i>
            </h4>
            <h1 class="ui inverted center aligned header" style="font-size: 40px;margin-top:55px">
                <p class="sub header">Welcome to</p>GeekHome
            </h1>
        </div>
        <div class="eleven wide column">
            <h4 class="ui inverted right aligned header">
                <a href="#" style="color:#ff695e;">or LOGIN</a>
            </h4>
            <form class="ui form error" method="post">
                {% if form.errors %}
                    <div class="ui error message">
                        {{ form.errors }}
                    </div>
                    {% for field in form %}
                        <div class="{{ field.errors|yesno:'error, ' }} field">
                            {{ field.label }}
                            {{ field }}
                        </div>
                    {% endfor %}
                {% else %}
                    {% for field in form %}
                        <div class="field">
                            {{ field.label }}
                            {{ field }}
                        </div>
                    {% endfor %}
                {% endif %}
                {% csrf_token %}
                <button class="ui inverted red circular right floated button" type="submit">Done</button>
            </form>
        </div>
    </div>
</body>
</html>