分类： Web开发
2015-05-20 09:28:04
26.用Django-Registration-Redux进行用户校验
Django中，有好多现成的应用提供了注册、登录、校验等功能，我们只要稍稍改动一下URL映射、视图和模板就可以使用它们。在这一章，我们将介绍用Django-Registration-Redux,顺便学习一下如何把外部的应用加到我们的项目中。
（1）安装Django-Registration-Redux
在Dos命令提示符下转到Python的Scripts文件夹，然后运行如下命令：
pip install django-registration-redux
正确安装的话会你看到“Successfully installed django-registration-redux”这样的提示。
（2）配置
打开settings.py文件，将INSTALLED_APPS改为：
rangoproject/settings.py：
INSTALLED_APPS = ( 'django.contrib.admin', 'django.contrib.auth', 'django.contrib.contenttypes', 'django.contrib.sessions', 'django.contrib.messages', 'django.contrib.staticfiles', 'rango', 'registration', # add in the registration package )
同时在settings.py文件尾部加入以下内容：
rangoproject/settings.py：
REGISTRATION_OPEN = True # 此项设置为True,用户方能注册 ACCOUNT_ACTIVATION_DAYS = 7 REGISTRATION_AUTO_LOGIN = True # 此项设置为True，用户可以自动登录 LOGIN_REDIRECT_URL = '/rango/' # 用户登录后转向的页面 LOGIN_URL = '/accounts/login/' # 用户未成功登录时转向的页面
(3)修改URL映射
修改rangoproject下的urls.py文件,改成下面这样：
rangoproject/urls.py:
urlpatterns = patterns('', url(r'^admin/', include(admin.site.urls)), url(r'^rango/', include('rango.urls')), url(r'^accounts/', include('registration.backends.simple.urls')), )
(4)设置模板
我们先来做登录模板.我们在templates下面新建一个叫registration的文件夹，下面说到的这些模板都放在这里。在这个文件夹下新建一个叫login.html的文件,加入如下内容：
templates/registration/login.html：
{% extends "base.html" %} {% block body_block %} <h1>登录h1> <form method="post" action="."> {% csrf_token %} {{ form.as_p }} <input type="submit" value="登录" /> <input type="hidden" name="next" value="{{ next }}" /> form> <p>还不是会员? <a href="{% url 'registration_register' %}">Registera>!p> {% endblock %}
接着我们来做注册模板，在registration文件夹下新建一个叫registration_form.html的文件,加入如下内容:
templates/registration/registration_form.html：
{% extends "base.html" %} {% block body_block %} <h1>注册h1> <form method="post" action="."> {% csrf_token %} {{ form.as_p }} <input type="submit" value="提交" /> form> {% endblock %}
我们接下来做注册完成模板，在registration文件夹下新建一个叫registration_complete.html的文件,加入如下内容:
templates/registration/registration_complete.html：
{% extends "base.html" %} {% block body_block %} <h1>注册成功h1> <p>您已成功注册！p> {% endblock %}
然后是注销模板，在registration文件夹下新建一个叫logout.html的文件,加入如下内容:
templates/registration/logout.html：
{% extends "base.html" %} {% block body_block %} <h1>注销h1> <p>您已退出当前登录.p> {% endblock %}
准备好上面这些，我们可以开始体验了。在浏览器地址栏中输入“”,感受一下全新的注册、登录、注销流程吧！
(5)修改链接
最后我们要调整一下base.html中的相关链接：
注意在注销链接中，我们加了一句”?next=/rango/"“，它的作用是在用户注销后，将其引导回Rango首页。
(6)修改注册流程
在当前的设置中，当用户完成注册时，程序会将其引导到”注册成功“页面。这样做感觉傻傻的，所以，我们来调整一下注册流程。
我们来重写一下”registration.backends.simple.views“提供的RegistrationView。
修改rangoproject下的urls.py文件,改成下面这样：
rangoproject/urls.py:
from django.conf.urls import patterns, include, url from django.contrib import admin from registration.backends.simple.views import RegistrationView # 创建一个新类，用来在用户登录成功时引导他回首页 class MyRegistrationView(RegistrationView): def get_success_url(selfself,request, user): return '/rango/' urlpatterns = patterns('', url(r'^admin/', include(admin.site.urls)), url(r'^rango/', include('rango.urls')), url(r'^accounts/register/$', MyRegistrationView.as_view(), name='registration_register'), url(r'^accounts/', include('registration.backends.simple.urls')), )
27.美化Django
在这一节，我们将讲解如何用Twitter Bootstrap toolkit来美化Django，我们不会讲Bootstrap背后的工作原理，并且，在讲解时我们会假定你对CSS有一定的了解。如果你从来没接触过CSS，甚至连CSS是什么都不知道，赶紧找度娘去恶补一下CSS的基础知识吧。
要学会使用Bootstrap,你可以访问Bootstrap的官方网站（），那里有一些例子可以学习。从这个网站可以看一些布局的范例（）。比如我们参考下面这个范例来设计Rango的样式（）。
我们可以直接将上面这个dashboard的页面源代码拿过来修改成base.html，具体改动的内容如下：
改好后的base.html会是下面这个样子：
templates/base.html：
DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<link rel="icon" href=">
<title>Rango - {% block title %}实战Django!{% endblock %}title>
<link href=" rel="stylesheet">
<link href=" rel="stylesheet">
head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigationspan>
<span class="icon-bar">span>
<span class="icon-bar">span>
<span class="icon-bar">span>
button>
<a class="navbar-brand" href="/rango/">Rangoa>
div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li><a href="{% url 'index' %}">首页a>li>
{% if user.is_authenticated %}
<li><a href="{% url 'restricted' %}">限制页面a>li>
<li><a href="{% url 'auth_logout' %}?next=/rango/">注销a>li>
<li><a href="{% url 'add_category' %}">新建分类a>li>
{% else %}
<li><a href="{% url 'registration_register' %}"> 注册a>li>
<li><a href="{% url 'auth_login' %}">登录a>li>
{% endif %}
<li><a href="{% url 'about' %}">关于a>li>
ul>
div>
div>
div>
<div class="container-fluid">
<div class="row">
<div class="col-sm-3 col-md-2 sidebar">
{% block side_block %}{% endblock %}
div>
<div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
<div>
{% block body_block %}{% endblock %}
div>
div>
div>
div>
<script src=">script>
<script src=">script>
<script src=">script>
<script src=">script>
body>
html>
有了这个基础模板，我们可以将这个新样式快速应用到其它模板中，比如我们来调整”关于“页面的模板：
templates/rango/about.html：
{% extends 'base.html' %} {% load staticfiles %} {% block title %}About{% endblock %} {% block body_block %} <div class="page-header"> <h1>关于Rangoh1> div> <div> <p>欢迎访问Rango！p> <p>点击这里返回<a href="{% url 'index' %}">首页a>。p> <p>这是一张Rango的图片！p> <img width="300" src="{% static "rango.jpg" %}" alt="Rango" /> div> {% endblock %}
接下来，让我们来搞定首页。
templates/rango/index.html：
{% extends 'base.html' %} {% load staticfiles %} {% block title %}Index{% endblock %} {% block body_block %} {% if user.is_authenticated %} <div class="page-header"> <h1>{{ user.username }}，欢迎来到Rango!h1> {% else %} <h1>欢迎来到Rango!h1> {% endif %} div> <div class="panel panel-primary"> <div class="panel-heading"> <h3 class="panel-title">分类h3> div> {% if categories %} <ul class="list-group"> {% for category in categories %} <li class="list-group-item"><a href="{% url 'category' category.slug %}">{{ category.name }}a>li> {% endfor %} ul> {% else %} <strong>目前还没有可用分类。strong> {% endif %} div> <div class="panel panel-primary"> <div class="panel-heading"> <h3 class="panel-title">页面h3> div> {% if pages %} <ul class="list-group"> {% for page in pages %} <li class="list-group-item"><a href="{{page.url}}">{{ page.title }}a>li> {% endfor %} ul> {% else %} <strong>目前还没有可用页面。strong> {% endif %} div> div> <p> 访问数: {{ visits }}p> {% endblock %}
接下来我们来搞定登录页面。在Bootstrap，他们已经有一个非常不错的登录例子（），我们可以参照这个例子来改写登录模板：
templates/registration/login.html：
{% extends "base.html" %} {% block body_block %} <link href=" rel="stylesheet"> <form class="form-signin" role="form" method="post" action="."> {% csrf_token %} <h2 class="form-signin-heading">请登录h2> <input class="form-control" placeholder="用户名" id="id_username" maxlength="254" name="username" type="text" required autofocus=""/> <input type="password" class="form-control" placeholder="密码" id="id_password" name="password" type="password" required /> <button class="btn btn-lg btn-primary btn-block" type="submit" value="Submit" />登录button> form> {% endblock %}
注册页面同样需要美化。编辑registration_form.html,改成下面这样：
templates/registration/registration_form.html：
{% extends "base.html" %} {% block body_block %} <form role="form" method="post" action="."> {% csrf_token %} <h2 class="form-signin-heading">注册h2> <div class="form-group" > <p class="required"> <label for="id_username">用户名:label>p> <p><input class="form-control-static" size="28" id="id_username" maxlength="30" name="username" type="text" placeholder="请输入用户名"/>p> div> <div class="form-group"> <p class="required"><label for="id_email">E-mail:label>p> <p><input class="form-control-static" size="28" id="id_email" name="email" type="email" placeholder="请输入邮箱" />p> div> <div class="form-group"> <p class="required"><label for="id_password1">密码:label>p> <p><input class="form-control-static" size="28" id="id_password1" name="password1" type="password" placeholder="请输入密码" />p> div> <div class="form-group"> <p class="required"><label for="id_password2">密码 (确认):label>p> <p><input class="form-control-static" size="28" id="id_password2" name="password2" type="password" placeholder="请再次输入密码" />p> div> <button type="submit" class="btn btn-default">提交button> form> {% endblock %}
再来看看其它的页面，比如“新建页面”模板，可以改成这样：
templates/rango/add_page.html：
{% extends 'base.html' %} {% block title %}添加页面{% endblock %} {% block body_block %} {% if category %} <form role="form" id="page_form" method="post" action="/rango/category/{{category.slug}}/add_page/"> <h2 class="form-signin-heading">添加页面到 <a href="/rango/category/{{category.slug}}/"> {{ category.name }}a>h2> {% csrf_token %} {% for hidden in form.hidden_fields %} {{ hidden }} {% endfor %} {% for field in form.visible_fields %} {{ field.errors }} {{ field.help_text }}<br/> {{ field }}<br/> {% endfor %} <br/> <button class="btn btn-primary" type="submit" name="submit">创建页面button> form> {% else %} <p>此分类不存在.p> {% endif %} {% endblock %}
我们可以用同样的方式来修改“新建分类”模板。剩下那些模板的调整，就由你自己来完成吧！
【未完待续】
本文版权归所有，欢迎转载，转载请注明作者和出处。谢谢！
作者：
首发：舍得学苑@博客园