Django-03-用户管理

2018-06-22 本文已影响45人 JOooo_

Django 用户认证系统提供了一个内置的 User 对象，用于记录用户的用户名，密码等个人信息。对于 Django 内置的 User 模型，包含以下一些主要的属性：

username，即用户名
password，密码
email，邮箱
first_name，名
last_name，姓

这里我们直接用内置的User模型进行用户管理。

引入内置的 URL 模型

在项目的url.py中（mysite/url.py）添加：
path('projtrack/', include('django.contrib.auth.urls')),

这将包含以下的 URL 模式：

^users/login/$ [name='login']
^users/logout/$ [name='logout']
^users/password_change/$ [name='password_change']
^users/password_change/done/$ [name='password_change_done']
^users/password_reset/$ [name='password_reset']
^users/password_reset/done/$ [name='password_reset_done']
^users/reset/(?P<uidb64>[0-9A-Za-z_\-]+)/(?P<token>[0-9A-Za-z]{1,13}-[0-9A-Za-z]{1,20})/$ [name='password_reset_confirm']
^users/reset/done/$ [name='password_reset_complete']

设置模板路径

默认的登录视图函数渲染的是 registration/login.html 模板，为了页面好看一点，我们重写这个页面。因此在 templates/ 目录下新建一个 registration 文件夹，再在 registration/ 目录下新建 login.html 模板文件。此时目录结构为：

mysite/
    manage.py
    mysite/
        __init__.py
        settings.py
        urls.py
        wsgi.py
    projtrack/
        templates/
            projtrack/
                project.html
                schedule.html
            registration/
                login.html

编写登录模板

# projtrack/templates/registration/login.html

<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <title>登录</title>
    <link rel="stylesheet" href="https://unpkg.com/mobi.css/dist/mobi.min.css">
    <style>
        .errorlist {
            color: red;
        }
    </style>
</head>
<body>
<div class="flex-center">
    <div class="unit-1-1">
        <h3>登录</h3>
        <form class="form" action="{% url 'login' %}" method="post">
            {% csrf_token %}
            {{ form.non_field_errors }}
            {% for field in form %}
                 {{ field.label_tag }}
                 {{ field }}
                 {{ field.errors }}
                 {% if field.help_text %}
                     <p class="help text-small text-muted">{{ field.help_text|safe }}</p>
                 {% endif %}
             {% endfor %}
             <button type="submit" class="btn btn-primary btn-block">登录</button>
             <input type="hidden" name="next" value="{{ next }}"/>
         </form>
     </div>
</div>
</body>
</html>

现在打开开发服务器，在浏览器输入 http://127.0.0.1:8000/projtrack/login/，你将看到一个用户登陆表单。

如果用户登录成功，你会发现跳转到了 http://127.0.0.1:8000/accounts/profile/ 页面。由于我们没有写任何视图函数处理这个 URL，所以看到一个 404 错误。不过没有关系，我们目前只关注用户是否已经登录

如何在模板中判断用户是否已经登录

在模板中判断用户是否已经登录非常简单，使用 {% if user.is_authenticated %} 条件判断即可。现在在project.html和schedule.html中加上这个条件。

同时修改index.html页面，优化页面，增加导航栏及侧边栏，并添加登录，注销登录，修改密码等按钮。目前只有登录按钮会跳转到登录页面。

# projtrack/project.html 和 projtrack/schedule.html

{% extends "projtrack/index.html" %}
{% block body %}
{% if user.is_authenticated %}
...

# projtrack/index.html

<!DOCTYPE html>
<html lang="zh-cn">
<title>Project Tracking System</title>
<head>
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<nav class="navbar navbar-inverse navbar-static-top">
    <div class="container-fluid">
        <div class="navbar-header">
            <a class="navbar-brand" href="{% url 'projtrack:index' %}">Project Tracking</a>
        </div>
        <div id="navbar" class="navbar-collapse collapse">
            <ul class="nav navbar-nav navbar-right">
                {% if user.is_authenticated %}
                <li><a href="#">Welcome: {{ user.username }}</a></li>
                <li><a href="#">Logout</a></li>
                <li><a href="#">Change Password</a></li>
            {% else %}
                <li><a href="{% url 'login' %}">Login</a></li>
            {% endif %}
            </ul>
        </div>
    </div>
</nav>
<div class="container-fluid">
<div class="row">
        <div class="col-sm-3 col-md-2 sidebar">
          <ul class="nav nav-sidebar">
            <li><a href="{% url 'projtrack:project' %}">项目</a></li>
          </ul>
        </div>
        <div class="col-sm-9 col-md-10 main">
        {% if user.is_authenticated %}
            {% block body %}{% endblock %}
        {% else %}
            <h3>Please login!</h3>
        {% endif %}
        </div>
</div>
</div>
</body>
</html>

注销登录

注销登录的默认视图为 logout，这里简单修改下注销按钮的href即可。
<li><a href="{% url 'logout' %}">Logout</a></li>

如果你已经登陆，就会看到一个注销登录的按钮，点击该按钮就会跳转到注销登录已成功地页面。再一次访问首页，你将看到登录、注册按钮，说明你已经成功注销登录状态了。

页面跳转

我们之前在登录、注册和注销的过程中发现：登录成功后会跳转到一个 404 页面，注销登录后跳转到了 Admin 后台的注销成功页面。对于一个网站来说，比较好的用户体验是登录、注销后跳转回用户之前访问的页面或首页。

在登录和注销的视图函数中，Django 已经为我们处理了跳转回用户之前访问页面的流程。其实现的原理是，在登录和注销的流程中，始终传递一个 next 参数记录用户之前访问页面的 URL。因此，我们需要做的就是在用户访问登录或者注销的页面时，在 URL 中传递一个 next 参数给视图函数，具体做法如下：

...
{% if user.is_authenticated %}
    <li><a href="#">Welcome: {{ user.username }}</a></li>
    <li><a href="{% url 'logout' %}?next={{ request.path }}">Logout</a></li>
    <li><a href="{% url 'password_change' %}?next={{ request.path }}">Change Password</a></li>

{% else %}
    <li><a href="{% url 'login' %}?next={% url 'projtrack:project' %}">Login</a></li>
{% endif %}
...

这里设定：注销和修改密码后返回之前的页面（页面逻辑其实会提示please login），登录后跳转到project页面。

修改密码

上面index.html代码中我们也已经添加了修改密码按钮，及其对应的url名称，以及修改成功后跳转到之前的页面。

修改密码的的视图函数默认渲染的模板名为 password_change_form.html，为了页面美观，我们重写页面。因此首先在 registration/ 下新建一个 password_change_form.html 文件，写入表单代码（几乎和登录页面一样）。

<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <title>修改密码</title>
    <link rel="stylesheet" href="https://unpkg.com/mobi.css/dist/mobi.min.css">
    <style>
        .errorlist {
            color: red;
        }
    </style>
</head>
<body>
<div class="flex-center">
    <div class="container">
        <div class="flex-center">
            <div class="unit-1-2">
                <h1><a href="{% url 'projtrack:index' %}">Project Tracking System</a></h1>
                <h3>修改密码</h3>
                <form class="form" action="{% url 'password_change' %}" method="post">
                    {% csrf_token %}
                    {{ form.non_field_errors }}
                    {% for field in form %}
                        {{ field.label_tag }}
                        {{ field }}
                        {{ field.errors }}
                        {% if field.help_text %}
                            <p class="help text-small text-muted">{{ field.help_text|safe }}</p>
                        {% endif %}
                    {% endfor %}
                    <button type="submit" class="btn btn-primary btn-block">确认修改</button>
                </form>
            </div>
        </div>
    </div>
</div>
</body>
</html>