第四章在線教育平臺(用戶登錄注冊)

用戶登錄注冊界面

標簽： django

登錄

首頁與登陸界面配置

復制主頁及相關文件玩祟，其中包括靜態(tài)文件圣贸。

 
urls

"""edu_gmooc URL Configuration

The `urlpatterns` list routes URLs to views. For more information please see:
    https://docs.djangoproject.com/en/1.9/topics/http/urls/
Examples:
Function views
    1. Add an import:  from my_app import views
    2. Add a URL to urlpatterns:  url(r'^$', views.home, name='home')
Class-based views
    1. Add an import:  from other_app.views import Home
    2. Add a URL to urlpatterns:  url(r'^$', Home.as_view(), name='home')
Including another URLconf
    1. Import the include() function: from django.conf.urls import url, include
    2. Add a URL to urlpatterns:  url(r'^blog/', include('blog.urls'))
"""
from django.conf.urls import url
from django.contrib import admin
from django.views.generic import TemplateView
import xadmin

from users.views import user_login

urlpatterns = [
    url(r'^xadmin/', xadmin.site.urls),
    url('^$', TemplateView.as_view(template_name='index.html'), name='index'),
    url('^login/$', user_login, name='login'),
]


settings
# 自定義驗證規(guī)則
AUTHENTICATION_BACKED = (
    'users.views.CustmerBacked',
)
# 靜態(tài)文件
STATIC_URL = '/static/'
STATICFILES_DIRS = (
    os.path.join(BASE_DIR, 'static'),
)

views

# _*_ encoding:utf-8 _*_
from django.shortcuts import render
from django.contrib.auth import authenticate, login
from django.contrib.auth.backends import ModelBackend
from django.db.models import Q

from .models import UserProfile

# Create your views here.

#  郵箱驗證規(guī)則
class CustmerBacked(ModelBackend):
    def authenticate(self, username=None, password=None, **kwargs):
        try:
            user = UserProfile.objects.get(Q(username=username) | Q(email=username))
            if user.check_password(password):
                return user
        except Exception as e:
            return None


def user_login(request):
    if request.method == 'POST':
        user_name = request.POST.get('username')
        pass_word = request.POST.get('password')
        user = authenticate(username=user_name, password=pass_word)
        if user is not None:
            login(request, user)
            return render(request, 'index.html')
        else:
            return render(request, 'login.html', {'msg': '用戶名或密碼錯誤委粉！'})
    elif request.method == 'GET':
        return render(request, 'login.html')

index.html

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" >
    <title>課程機構列表 - 慕學在線網(wǎng)</title>
    <link rel="stylesheet" type="text/css" href="/static/css/reset.css">
    <link rel="stylesheet" type="text/css" href="/static/css/animate.css">
    <link rel="stylesheet" type="text/css" href="/static/css/style.css">
    
    <script src="/static/js/jquery.min.js" type="text/javascript"></script>
    <script src="/static/js/jquery-migrate-1.2.1.min.js" type="text/javascript"></script>

</head>
<body>
<section class="headerwrap ">
    <header>
        <div  class=" header">
        <!--登錄后跳轉-->
            <div class="top">
                <div class="wp">
                    <div class="fl"><p>服務電話：<b>33333333</b></p></div>
                    {% if request.user.is_authenticated %}
                        <div class="personal">
                            <dl class="user fr">
                                <dd>bobby<img class="down fr" src="/static/images/top_down.png"/></dd>
                                <dt><img width="20" height="20" src="/static/media/image/2016/12/default_big_14.png"/></dt>
                            </dl>
                            <div class="userdetail">
                                <dl>
                                    <dt><img width="80" height="80" src="/static/media/image/2016/12/default_big_14.png"/></dt>
                                    <dd>
                                        <h2>django</h2>
                                        <p>bobby</p>
                                    </dd>
                                </dl>
                                <div class="btn">
                                    <a class="personcenter fl" href="usercenter-info.html">進入個人中心</a>
                                    <a class="fr" href="/logout/">退出</a>
                                </div>
                            </div>
                        </div>
                        {% else %}
                            <a style="color:white" class="fr registerbtn" href="register.html">注冊</a>
                            <a style="color:white" class="fr loginbtn" href="/login/">登錄</a>
                    {% endif %}

                </div>
            </div>

            <div class="middle">
                <div class="wp">
                    <a href="index.html"><img class="fl" src="/static/images/logo.jpg"/></a>
                    <div class="searchbox fr">
                        <div class="selectContainer fl">
                            <span class="selectOption" id="jsSelectOption" data-value="course">
                                公開課
                            </span>
                            <ul class="selectMenu" id="jsSelectMenu">
                                <li data-value="course">公開課</li>
                                <li data-value="org">課程機構</li>
                                <li data-value="teacher">授課老師</li>
                            </ul>
                        </div>
                        <input id="search_keywords" class="fl" type="text" value="" placeholder="請輸入搜索內(nèi)容"/>
                        <img class="search_btn fr" id="jsSearchBtn" src="/static/images/search_btn.png"/>
                    </div>
                </div>
            </div>
            
            
            <nav>
                <div class="nav">
                    <div class="wp">
                        <ul>
                            <li class="active" ><a href="index.html">首頁</a></li>
                            <li >
                                <a href="course-list.html">
                                    公開課<img class="hot" src="/static/images/nav_hot.png">
                                </a>
                            </li>
                            <li >
                                <a href="teachers-list.html">授課教師</a>
                            </li>
                            <li ><a href="org-list.html">授課機構</a></li>
                        </ul>
                    </div>
                </div>
            </nav>
            
            </div>
    </header>
</section>
<!--crumbs start-->



    <div class="banner">
            <div class="wp">
                <div class="fl">
                    <div class="imgslide">
                        <ul class="imgs">
                            
                            <li>
                                    <a >
                                        <img width="1200" height="478" src="/static/media/banner/2016/11/57a801860001c34b12000460.jpg" />
                                    </a>
                                </li>
                            
                            <li>
                                    <a >
                                        <img width="1200" height="478" src="/static/media/banner/2016/11/57aa86a0000145c512000460.jpg" />
                                    </a>
                                </li>
                            
                            <li>
                                    <a >
                                        <img width="1200" height="478" src="/static/media/banner/2016/11/57a801860001c34b12000460_z4Vb8zl.jpg" />
                                    </a>
                                </li>
                            
                            <li>
                                    <a >
                                        <img width="1200" height="478" src="/static/media/banner/2016/11/57aa86a0000145c512000460_nMwvoQD.jpg" />
                                    </a>
                                </li>
                            
                            <li>
                                    <a >
                                        <img width="1200" height="478" src="/static/media/banner/2016/11/57aa86a0000145c512000460_GXIBATC.jpg" />
                                    </a>
                                </li>
                            

                        </ul>
                    </div>
                    <div class="unslider-arrow prev"></div>
                    <div class="unslider-arrow next"></div>
                </div>

                </div>


            </div>
<!--banner end-->
<!--feature start-->
    <section>
        <div class="wp">
            <ul class="feature">
                <li class="feature1">
                    <img class="pic" src="/static/images/feature1.png"/>
                    <p class="center">專業(yè)權威</p>
                </li>
                <li class="feature2">
                    <img class="pic" src="/static/images/feature2.png"/>
                    <p class="center">課程最新</p>
                </li>
                <li class="feature3">
                    <img class="pic" src="/static/images/feature3.png"/>
                    <p class="center">名師授課</p>
                </li>
                <li class="feature4">
                    <img class="pic" src="/static/images/feature4.png"/>
                    <p class="center">數(shù)據(jù)真實</p>
                </li>
            </ul>
        </div>
    </section>
<!--feature end-->
<!--module1 start-->
    <section>
        <div class="module">
            <div class="wp">
                <h1>公開課程</h1>
                <div class="module1 eachmod">
                    <div class="module1_1 left">
                        <img width="228" height="614" src="/static/images/module1_1.jpg"/>
                        <p class="fisrt_word">名師授課<br/>專業(yè)權威</p>
                        <a class="more" href="course-list.html">查看更多課程 ></a>
                    </div>
                    <div class="right group_list">
                        <div class="module1_2 box">
                            <div class="imgslide2">
                                <ul class="imgs">
                                    
                                    <li>
                                        <a href="course-detail.html">
                                            <img width="470" height="300" src="/static/media/courses/2016/12/python文件處理.jpg" />
                                        </a>
                                    </li>
                                    
                                    <li>
                                        <a href="course-detail.html">
                                            <img width="470" height="300" src="/static/media/courses/2016/12/python面向對象.jpg" />
                                        </a>
                                    </li>
                                    
                                </ul>
                            </div>
                            <div class="unslider-arrow2 prev"></div>
                            <div class="unslider-arrow2 next"></div>
                        </div>
                            
                            <div class="module1_3 box">
                                <a href="course-detail.html">
                                    <img width="233" height="190" src="/static/media/courses/2016/11/mysql.jpg"/>
                                </a>
                                <div class="des">
                                    <a href="course-detail.html">
                                        <h2 title="django入門">django入門</h2>
                                    </a>
                                    <span class="fl">難度：<i class="key">初級</i></span>
                                    <span class="fr">學習人數(shù)：3</span>
                                </div>
                                <div class="bottom">
                                    <span class="fl" title="慕課網(wǎng)">慕課網(wǎng)</span>
                                    <span class="star fr">0</span>
                                </div>
                            </div>
                            
                            <div class="module1_4 box">
                                <a href="course-detail.html">
                                    <img width="233" height="190" src="/static/media/courses/2016/11/57035ff200014b8a06000338-240-135.jpg"/>
                                </a>
                                <div class="des">
                                    <a href="course-detail.html">
                                        <h2 title="java入門">java入門</h2>
                                    </a>
                                    <span class="fl">難度：<i class="key">中級</i></span>
                                    <span class="fr">學習人數(shù)：0</span>
                                </div>
                                <div class="bottom">
                                    <span class="fl" title="北京大學">北京大學</span>
                                    <span class="star fr">0</span>
                                </div>
                            </div>
                            
                            <div class="module1_5 box">
                                <a href="course-detail.html">
                                    <img width="233" height="190" src="/static/media/courses/2016/11/540e57300001d6d906000338-240-135.jpg"/>
                                </a>
                                <div class="des">
                                    <a href="course-detail.html">
                                        <h2 title="python入門">python入門</h2>
                                    </a>
                                    <span class="fl">難度：<i class="key">中級</i></span>
                                    <span class="fr">學習人數(shù)：0</span>
                                </div>
                                <div class="bottom">
                                    <span class="fl" title="南京大學">南京大學</span>
                                    <span class="star fr">0</span>
                                </div>
                            </div>
                            
                            <div class="module1_6 box">
                                <a href="course-detail.html">
                                    <img width="233" height="190" src="/static/media/courses/2016/11/57035ff200014b8a06000338-240-135_dHfj8Nq.jpg"/>
                                </a>
                                <div class="des">
                                    <a href="course-detail.html">
                                        <h2 title="java入門2">java入門2</h2>
                                    </a>
                                    <span class="fl">難度：<i class="key">高級</i></span>
                                    <span class="fr">學習人數(shù)：0</span>
                                </div>
                                <div class="bottom">
                                    <span class="fl" title="慕課網(wǎng)2">慕課網(wǎng)2</span>
                                    <span class="star fr">0</span>
                                </div>
                            </div>
                            
                            <div class="module1_7 box">
                                <a href="course-detail.html">
                                    <img width="233" height="190" src="/static/media/courses/2016/11/57035ff200014b8a06000338-240-135_0nFiBSI.jpg"/>
                                </a>
                                <div class="des">
                                    <a href="course-detail.html">
                                        <h2 title="java入門3">java入門3</h2>
                                    </a>
                                    <span class="fl">難度：<i class="key">初級</i></span>
                                    <span class="fr">學習人數(shù)：1</span>
                                </div>
                                <div class="bottom">
                                    <span class="fl" title="慕課網(wǎng)3">慕課網(wǎng)3</span>
                                    <span class="star fr">0</span>
                                </div>
                            </div>
                            
                            <div class="module1_8 box">
                                <a href="course-detail.html">
                                    <img width="233" height="190" src="/static/media/courses/2016/11/540e57300001d6d906000338-240-135_MSIqfvw.jpg"/>
                                </a>
                                <div class="des">
                                    <a href="course-detail.html">
                                        <h2 title="python入門2">python入門2</h2>
                                    </a>
                                    <span class="fl">難度：<i class="key">中級</i></span>
                                    <span class="fr">學習人數(shù)：0</span>
                                </div>
                                <div class="bottom">
                                    <span class="fl" title="慕課網(wǎng)666">慕課網(wǎng)666</span>
                                    <span class="star fr">0</span>
                                </div>
                            </div>
                            
                    </div>
                </div>
            </div>
        </div>
    </section>
    <section>
        <div class="module greybg">
            <div class="wp">
                <h1>課程機構</h1>
                <div class="module3 eachmod">
                    <div class="module3_1 left">
                        <img width="228" height="463" src="/static/images/module3_1.jpg"/>
                        <p class="fisrt_word">名校來襲<br/>權威認證</p>
                        <a class="more" href="org-list.html">查看更多機構 ></a>
                    </div>
                    <div class="right">
                        <ul>
                            
                                <li class="">
                                    <a href="org-detail-homepage.html">
                                        <div class="company">
                                            <img width="184" height="100" src="/static/media/org/2016/11/imooc.png"/>
                                            <div class="score">
                                                <div class="circle">
                                                    <h2>全國知名</h2>
                                                </div>
                                            </div>
                                        </div>
                                        <p><span class="key" title="慕課網(wǎng)">慕課網(wǎng)</span></p>
                                    </a>
                                </li>
                            
                                <li class="">
                                    <a href="org-detail-homepage.html">
                                        <div class="company">
                                            <img width="184" height="100" src="/static/media/org/2016/11/bjdx.jpg"/>
                                            <div class="score">
                                                <div class="circle">
                                                    <h2>全國知名</h2>
                                                </div>
                                            </div>
                                        </div>
                                        <p><span class="key" title="北京大學">北京大學</span></p>
                                    </a>
                                </li>
                            
                                <li class="">
                                    <a href="org-detail-homepage.html">
                                        <div class="company">
                                            <img width="184" height="100" src="/static/media/org/2016/11/qhdx-logo.png"/>
                                            <div class="score">
                                                <div class="circle">
                                                    <h2>全國知名</h2>
                                                </div>
                                            </div>
                                        </div>
                                        <p><span class="key" title="清華大學">清華大學</span></p>
                                    </a>
                                </li>
                            
                                <li class="">
                                    <a href="org-detail-homepage.html">
                                        <div class="company">
                                            <img width="184" height="100" src="/static/media/org/2016/11/njdx.jpg"/>
                                            <div class="score">
                                                <div class="circle">
                                                    <h2>全國知名</h2>
                                                </div>
                                            </div>
                                        </div>
                                        <p><span class="key" title="南京大學">南京大學</span></p>
                                    </a>
                                </li>
                            
                                <li class="five">
                                    <a href="org-detail-homepage.html">
                                        <div class="company">
                                            <img width="184" height="100" src="/static/media/org/2016/11/imooc_klgAUn5.png"/>
                                            <div class="score">
                                                <div class="circle">
                                                    <h2>全國知名</h2>
                                                </div>
                                            </div>
                                        </div>
                                        <p><span class="key" title="慕課網(wǎng)2">慕課網(wǎng)2</span></p>
                                    </a>
                                </li>
                            
                                <li class="">
                                    <a href="org-detail-homepage.html">
                                        <div class="company">
                                            <img width="184" height="100" src="/static/media/org/2016/11/imooc_Gn1sRjp.png"/>
                                            <div class="score">
                                                <div class="circle">
                                                    <h2>全國知名</h2>
                                                </div>
                                            </div>
                                        </div>
                                        <p><span class="key" title="慕課網(wǎng)3">慕課網(wǎng)3</span></p>
                                    </a>
                                </li>
                            
                                <li class="">
                                    <a href="org-detail-homepage.html">
                                        <div class="company">
                                            <img width="184" height="100" src="/static/media/org/2016/11/imooc_Y2Tonsq.png"/>
                                            <div class="score">
                                                <div class="circle">
                                                    <h2>全國知名</h2>
                                                </div>
                                            </div>
                                        </div>
                                        <p><span class="key" title="慕課網(wǎng)3">慕課網(wǎng)3</span></p>
                                    </a>
                                </li>
                            
                                <li class="">
                                    <a href="org-detail-homepage.html">
                                        <div class="company">
                                            <img width="184" height="100" src="/static/media/org/2016/11/imooc_OO2ykYP.png"/>
                                            <div class="score">
                                                <div class="circle">
                                                    <h2>全國知名</h2>
                                                </div>
                                            </div>
                                        </div>
                                        <p><span class="key" title="慕課網(wǎng)4">慕課網(wǎng)4</span></p>
                                    </a>
                                </li>
                            
                                <li class="">
                                    <a href="org-detail-homepage.html">
                                        <div class="company">
                                            <img width="184" height="100" src="/static/media/org/2016/11/imooc_V0TJOyb.png"/>
                                            <div class="score">
                                                <div class="circle">
                                                    <h2>全國知名</h2>
                                                </div>
                                            </div>
                                        </div>
                                        <p><span class="key" title="慕課網(wǎng)5">慕課網(wǎng)5</span></p>
                                    </a>
                                </li>
                            
                                <li class="five">
                                    <a href="org-detail-homepage.html">
                                        <div class="company">
                                            <img width="184" height="100" src="/static/media/org/2016/11/imooc_qEaMov1.png"/>
                                            <div class="score">
                                                <div class="circle">
                                                    <h2>全國知名</h2>
                                                </div>
                                            </div>
                                        </div>
                                        <p><span class="key" title="慕課網(wǎng)666">慕課網(wǎng)666</span></p>
                                    </a>
                                </li>
                            
                                <li class="">
                                    <a href="org-detail-homepage.html">
                                        <div class="company">
                                            <img width="184" height="100" src="/static/media/org/2016/12/bjdx.jpg"/>
                                            <div class="score">
                                                <div class="circle">
                                                    <h2>全國知名</h2>
                                                </div>
                                            </div>
                                        </div>
                                        <p><span class="key" title="慕學網(wǎng)">慕學網(wǎng)</span></p>
                                    </a>
                                </li>
                            
                                <li class="">
                                    <a href="org-detail-homepage.html">
                                        <div class="company">
                                            <img width="184" height="100" src="/static/media/org/2016/12/imooc_Gn1sRjp.png"/>
                                            <div class="score">
                                                <div class="circle">
                                                    <h2>全國知名</h2>
                                                </div>
                                            </div>
                                        </div>
                                        <p><span class="key" title="python培訓機構">python培訓機構</span></p>
                                    </a>
                                </li>
                            
                                <li class="">
                                    <a href="org-detail-homepage.html">
                                        <div class="company">
                                            <img width="184" height="100" src="/static/media/org/2016/12/bjdx_cCpdUw8.jpg"/>
                                            <div class="score">
                                                <div class="circle">
                                                    <h2>全國知名</h2>
                                                </div>
                                            </div>
                                        </div>
                                        <p><span class="key" title="vuejs培訓">vuejs培訓</span></p>
                                    </a>
                                </li>
                            
                                <li class="">
                                    <a href="org-detail-homepage.html">
                                        <div class="company">
                                            <img width="184" height="100" src="/static/media/org/2016/12/imooc_klgAUn5.png"/>
                                            <div class="score">
                                                <div class="circle">
                                                    <h2>全國知名</h2>
                                                </div>
                                            </div>
                                        </div>
                                        <p><span class="key" title="nodejs培訓">nodejs培訓</span></p>
                                    </a>
                                </li>
                            
                                <li class="five">
                                    <a href="org-detail-homepage.html">
                                        <div class="company">
                                            <img width="184" height="100" src="/static/media/org/2016/12/bjdx_bcd0m07.jpg"/>
                                            <div class="score">
                                                <div class="circle">
                                                    <h2>全國知名</h2>
                                                </div>
                                            </div>
                                        </div>
                                        <p><span class="key" title="慕學在線">慕學在線</span></p>
                                    </a>
                                </li>
                            
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </section>

<footer>
        <div class="footer">
            <div class="wp">
                <ul class="cont">
                    <li class="logo"><a href=""><img src="/static/images/footlogo.png"/></a></li>
                    <li class="code"><img src="/static/images/code.jpg"/><p class="center">掃描關注微信</p></li>
                    <li class="third"><img class="fl" src="/static/images/tell.png"/><p class="tell">33333333</p><p class="time">周一至周日 9:00-18:00</p></li>
                </ul>

            </div>
            <p class="line"></p>
            <div class="wp clear">
                <span class="fl">? 2016 www.projectsedu.com 慕學在線-在線學習交流平臺 保留所有權利</span>
                <span class="fr">copyright ? 2016 ICP備案證書號：蜀ICP備xxxxx號-1</span>
            </div>
        </div>
    </footer>

<section>
    <ul class="sidebar">
        <li class="qq">
            <a target="_blank" ></a>
        </li>
        <li class="totop"></li>
    </ul>
</section>
<script src="/static/js/selectUi.js" type='text/javascript'></script>
<script src="/static/js/deco-common.js" type='text/javascript'></script>
<script type="text/javascript" src="/static/js/plugins/laydate/laydate.js"></script>
<script src="/static/js/plugins/layer/layer.js"></script>
<script src="/static/js/plugins/queryCity/js/public.js" type="text/javascript"></script>
<script src="/static/js/unslider.js" type="text/javascript"></script>
<script src="/static/js/plugins/jquery.scrollLoading.js"  type="text/javascript"></script>
<script src="/static/js/deco-common.js"  type="text/javascript"></script>

    <script type="text/javascript" src="/static/js/index.js"></script>

</body>
</html>

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" >
    <title>慕學在線網(wǎng)登錄</title>
    <link rel="stylesheet" type="text/css" href="/static/css/reset.css">
    <link rel="stylesheet" type="text/css" href="/static/css/login.css">
</head>
<body>
<div class="dialog" id="jsDialog">
<!--提示彈出框-->
<div class="successbox dialogbox" id="jsSuccessTips">
    <h1>成功提交</h1>
    <div class="close jsCloseDialog"><img src="/static/images/dig_close.png"/></div>
    <div class="cont">
        <h2>您的需求提交成功氮昧！</h2>
        <p></p>
    </div>
</div>
<div  class="noactivebox dialogbox" id="jsUnactiveForm" >
    <h1>郵件驗證提示</h1>
    <div class="close jsCloseDialog"><img src="/static/images/dig_close.png"/></div>
    <div class="center">
        <img src="/static/images/send.png"/>
        <p>我們已經(jīng)向您的郵箱<span class="green" id="jsEmailToActive">12@13.com</span>發(fā)送了郵件赖阻，<br/>為保證您的賬號安全蝶押，請及時驗證郵箱</p>
        <p class="a"><a class="btn" id="jsGoToEmail" target="_blank" >去郵箱驗證</a></p>
        <p class="zy_success upmove"></p>
        <p style="display: none;" class="sendE2">沒收到，您可以查看您的垃圾郵件和被過濾郵件火欧，也可以再次發(fā)送驗證郵件（<span class="c5c">60s</span>）</p>
        <p class="sendE">沒收到棋电，您可以查看您的垃圾郵件和被過濾郵件，<br/>也可以<span class="c5c green" id="jsSenEmailAgin" style="cursor: pointer;">再次發(fā)送驗證郵件</span></p>
    </div>
</div>
</div>
<div class="bg" id="dialogBg"></div>
<header>
    <div class="c-box fff-box">
        <div class="wp header-box">
            <p class="fl hd-tips">慕學在線網(wǎng)苇侵，在線學習平臺赶盔！</p>
            <ul class="fr hd-bar">
                <li>服務電話：<span>33333333</span></li>
                <li class="active"><a href="login.html">[登錄]</a></li>
                <li><a href="register.html">[注冊]</a></li>
            </ul>
        </div>
    </div>
</header>
<section>
    <div class="c-box bg-box">
        <div class="login-box clearfix">
            <div class="hd-login clearfix">
                <a class="index-logo" href="index.html"></a>
                <h1>用戶登錄</h1>
                <a class="index-font" href="index.html">回到首頁</a>
            </div>
            <div class="fl slide">
                <div class="imgslide">
                    <ul class="imgs">
                            <li><a href=""><img width="483" height="472" src="/static/images/mysql.jpg" /></a></li>
                            <li><a href=""><img width="483" height="472" src="/static/images/mysql.jpg" /></a></li>
                            <li><a href=""><img width="483" height="472" src="/static/images/mysql.jpg" /></a></li>
                    </ul>
                </div>
                <div class="unslider-arrow prev"></div>
                <div class="unslider-arrow next"></div>
            </div>
            <div class="fl form-box">
                <h2>帳號登錄</h2>
                <form action="/login/" method="post" autocomplete="off">
                    <input type='hidden' name='csrfmiddlewaretoken' value='mymQDzHWl2REXIfPMg2mJaLqDfaS1sD5' />
                    <div class="form-group marb20 ">
                        <label>用&nbsp;戶&nbsp;名</label>
                        <input name="username" id="account_l" type="text" placeholder="手機號/郵箱" />
                    </div>
                    <div class="form-group marb8 ">
                        <label>密&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;碼</label>
                        <input name="password" id="password_l" type="password" placeholder="請輸入您的密碼" />
                    </div>
                    <div class="error btns login-form-tips" id="jsLoginTips">{{ msg }}</div>
                     <div class="auto-box marb38">

                        <a class="fr" href="forgetpwd.html">忘記密碼？</a>
                     </div>
                     <input class="btn btn-green" id="jsLoginBtn" type="submit" value="立即登錄 > " />
                {% csrf_token %}
                </form>
                <p class="form-p">沒有慕學在線網(wǎng)帳號榆浓？<a href="register.html">[立即注冊]</a></p>
            </div>
        </div>
    </div>
</section>
<script src="/static/js/jquery.min.js" type="text/javascript"></script>
<script src="/static/js/unslider.js" type="text/javascript"></script>
<script src="/static/js/login.js"  type="text/javascript"></script>
</body>
</html>

類繼承方式實現(xiàn)url跳轉

from users.views import LoginView

urlpatterns = [
    url(r'^xadmin/', xadmin.site.urls),
    url('^$', TemplateView.as_view(template_name='index.html'), name='index'),
    url('^login/$', LoginView.as_view(), name='login'),
]

views

class LoginView(View):

    def get(self, request):
        return render(request, 'login.html')

    def post(self,request):
        user_name = request.POST.get('username')
        pass_word = request.POST.get('password')
        user = authenticate(username=user_name, password=pass_word)
        if user is not None:
            login(request, user)
            return render(request, 'index.html')
        else:
            return render(request, 'login.html', {'msg': '用戶名或密碼錯誤于未！'})

from 表單驗證

form

# _*_ encoding:utf-8 _*_

__author__ = 'wrj008'
__date__ = '2018/3/10 16:45'

from django import forms


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

from .forms import LoginForm
class LoginView(View):

    def get(self, request):
        return render(request, 'login.html')

    def post(self, request):
        login_form = LoginForm()
        if login_form.is_valid():
            user_name = request.POST.get('username')
            pass_word = request.POST.get('password')
            user = authenticate(username=user_name, password=pass_word)
            if user is not None:
                login(request, user)
                return render(request, 'index.html')
        else:
            return render(request, 'login.html', {'msg': '用戶名或密碼錯誤！'})

登陸提示

class LoginView(View):

    def get(self, request):
        return render(request, 'login.html')

    def post(self, request):
        login_form = LoginForm(request.POST)
        if login_form.is_valid():
            user_name = request.POST.get('username')
            pass_word = request.POST.get('password')
            user = authenticate(username=user_name, password=pass_word)
            if user is not None:
                login(request, user)
                return render(request, 'index.html')
            else:
                return render(request, 'login.html', {'msg': '用戶名或密碼錯誤陡鹃！'})
        else:
            return render(request, 'login.html', {'login_form': login_form})

<div class="fl form-box">
    <h2>帳號登錄</h2>
        <form action="/login/" method="post" autocomplete="off">
            <input type='hidden' name='csrfmiddlewaretoken' value='mymQDzHWl2REXIfPMg2mJaLqDfaS1sD5' />
            <div class="form-group marb20 {% if login_form.errors.username %} errorput{% endif %}">
                <label>用&nbsp;戶&nbsp;名</label>
                <input name="username" id="account_l" type="text" placeholder="手機號/郵箱" />
            </div>
            <div class="form-group marb8 {% if login_form.errors.password %}errorput{% endif %}">
                <label>密&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;碼</label>
                <input name="password" id="password_l" type="password" placeholder="請輸入您的密碼" />
            </div>
            <div class="error btns login-form-tips" id="jsLoginTips">{% for key,error in login_form.errors.items %}{{ error }}{% endfor %}{{ msg }}</div>
                <div class="auto-box marb38">

                 <a class="fr" href="forgetpwd.html">忘記密碼烘浦？</a>
                </div>
                <input class="btn btn-green" id="jsLoginBtn" type="submit" value="立即登錄 > " />
                {% csrf_token %}
        </form>
        <p class="form-p">沒有慕學在線網(wǎng)帳號？
            <a href="register.html">[立即注冊]</a>
        </p>
</div>

用戶注冊

用戶注冊

用戶注冊通過郵箱注冊界面注冊萍鲸，其中注冊過程需要用戶輸入驗證碼闷叉，采用django-simple-captcha,于此同時，用戶注冊成功脊阴，需要提供用戶郵箱激活握侧，這里采用郵箱發(fā)送激活鏈接，保證用戶操作嘿期。

<div class="tab-form">
    <form id="email_register_form" method="post" action="{% url 'register' %}" autocomplete="off">
        <input type='hidden' name='csrfmiddlewaretoken' value='gTZljXgnpvxn0fKZ1XkWrM1PrCGSjiCZ' />
        <div class="form-group marb20 {% if register_form.errors.email %} errorput {% endif %}">
            <label>郵&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;箱</label>
            <input  type="text" id="id_email" name="email" value="{{ register_form.email.value }}" placeholder="請輸入您的郵箱地址" />
        </div>
        <div class="form-group marb8 {% if register_form.errors.password %} errorput {% endif %}">
            <label>密&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;碼</label>
            <input type="password" id="id_password" name="password"  value="{{ register_form.password.value }}" placeholder="請輸入6-20位非中文字符密碼" />
        </div>
        <div class="form-group marb8 captcha1 {% if register_form.errors.captcha %} errorput {% endif %}">
            <label>驗&nbsp;證&nbsp;碼</label>
                {{ register_form.captcha }}
        </div>
        <div class="error btns" id="jsEmailTips">{% for key,error in register_form.errors.items %}{{ error }}{% endfor %}</div>
        <div class="auto-box marb8"></div>
            <input class="btn btn-green" id="jsEmailRegBtn" type="submit" value="注冊并登錄" />
                {% csrf_token %}
    </form>
</div>

class RegisterView(View):
    def get(self,request):
        register_form = RegisterForm()
        return render(request, 'register.html', {'register_form':register_form})

    def post(self,request):
        register_form = RegisterForm(request.POST)
        if register_form.is_valid():
            username = request.POST.get('email')
            password = request.POST.get('password')
            user_register = UserProfile()
            user_register.username = username
            user_register.email = username
            user_register.password = make_password(password)
            user_register.is_active = False
            user_register.save()

            send_email(username, 'register')
            return render(request, 'login.html', {'register_form': register_form})
        else:
            return render(request, 'register.html', {'register_form': register_form})

class RegisterForm(forms.Form):
    email = forms.EmailField(required=True)
    password = forms.CharField(required=True, min_length=5)
    captcha = CaptchaField(error_messages={'invalid': '驗證碼不正確'})

settings


INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'users',
    'course',
    'organization',
    'operation',
    'xadmin',
    'crispy_forms',
    'captcha'
]

# email setting
EMAIL_HOST = 'smtp.163.com'
EMAIL_PORT = 25
EMAIL_HOST_USER = '13083337152@163.com'
EMAIL_HOST_PASSWORD = '*****'
EMAIL_USE_TLS = False
EMAIL_FROM = '13083337152@163.com'

urls

urlpatterns = [
    url(r'^xadmin/', xadmin.site.urls),
    url('^$', TemplateView.as_view(template_name='index.html'), name='index'),
    url('^login/$', LoginView.as_view(), name='login'),
    url('^register/$', RegisterView.as_view(), name='register'),
    url(r'^captcha/', include('captcha.urls')),
    url(r'^active/(?P<active_code>.*)/$', ActiveView.as_view(), name='active')
]

email_utils

# _*_ encoding:utf-8 _*_

__author__ = 'wrj008'
__date__ = '2018/3/12 9:58'

from random import Random
from django.core.mail import send_mail

from users.models import EmailVerifyRecord
from edu_gmooc.settings import EMAIL_FROM


def random_code(randomlength=8):
    str = ''
    char = 'AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQqRrSsTtUuVvWwXxYyZz0123456789'
    length = len(char) - 1
    random = Random()
    for i in range(randomlength):
        str += char[random.randint(0, length)]
    return str


def send_email(email, send_type='register'):
    email_verify = EmailVerifyRecord()
    email_verify.email = email
    code = random_code(16)
    email_verify.code = code
    email_verify.send_type = send_type
    email_verify.save()

    email_title = ''
    email_body = ''
    if send_type == 'register':
        email_title = '用戶注冊'
        email_body = '點擊下面鏈接注冊：http://127.0.0.1:8000/active/{0}'.format(code)
        send_status = send_mail(email_title, email_body, EMAIL_FROM, [email])
        if send_status:
            pass

密碼找回

密碼找回

用戶進入密碼找回界面品擎，通過提交郵箱和驗證碼孵户，收到修改密碼地址满俗，通過生成的隨機修改密碼地址巷送，進行密碼修改祭芦，修改密碼需要隱藏用戶賬戶，驗證用戶修改密碼界面是夠有輸入錯誤贞让，如有錯誤則框全，錯誤提示，沒有錯誤則返回登錄界面瓣铣。

<div class="c-box bg-box">
        <div class="login-box clearfix">
            <div class="hd-login clearfix">
                <a class="index-logo" href="index.html"></a>
                <h1>忘記密碼</h1>
                <a class="index-font" href="index.html">回到首頁</a>
            </div>
            <div class="fl slide">
                <div class="imgslide">
                    <ul class="imgs">
                        <li><a href=""><img width="483" height="472" src="{% static 'images/57a801860001c34b12000460.jpg' %}" /></a></li>
                        <li><a href=""><img width="483" height="472" src="{% static 'images/57a801860001c34b12000460.jpg' %}" /></a></li>
                        <li><a href=""><img width="483" height="472" src="{% static 'images/57a801860001c34b12000460.jpg' %}" /></a></li>
                    </ul>
                </div>
                <div class="unslider-arrow prev"></div>
                <div class="unslider-arrow next"></div>
            </div>
            <div class="fl form-box">
                <h2>忘記密碼</h2>
                <form id="jsFindPwdForm" method="post" action="{% url 'forget_pwd' %}" autocomplete="off">
                    <div class="form-group marb20 {% if forgetpwd_form.errors.email %}errorput{% endif %} ">
                        <label>帳&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;號</label>
                        <input type="text" id="account" name="email" value="None" placeholder="郵箱" />
                    </div>
                    <div class="form-group captcha1 marb38">
                        <label>驗&nbsp;證&nbsp;碼</label>
                        {{ forgetpwd_form.captcha }}
                    </div>
                    <div class="error btns" id="jsForgetTips">{% for key,error in forgetpwd_form.errors.items %} {{ error }}{% endfor %}{{ msg }}</div>
                    <input type="hidden" name="sms_type" value="1">
                    <input class="btn btn-green" id="jsFindPwdBtn" type="submit" value="提交" />
                    <p class="form-p" style="bottom:40px;">您還可以<a href="login.html"> [直接登錄]</a></p>
                {% csrf_token %}
                </form>
            </div>
        </div>
    </div>


    urls
    url('^forgetpwd/$', ForgetPwdView.as_view(), name='forget_pwd'),
    
    
    froms
    
    class FogetPwdForm(forms.Form):
        email = forms.EmailField(required=True)
        captcha = CaptchaField(error_messages={'invalid': '驗證碼不正確'})
        
    email-send
    elif send_type == 'forget':
        email_title = '用戶密碼找回'
        email_body = '點擊下面鏈接重置密碼：http://127.0.0.1:8000/reset/{0}'.format(code)
        send_status = send_mail(email_title, email_body, EMAIL_FROM, [email])
        if send_status:
            pass
    
    views
    class ForgetPwdView(View):
    def get(self, request):
        forgetpwd_form = FogetPwdForm(request.POST)
        return render(request, 'forgetpwd.html',{'forgetpwd_form': forgetpwd_form})

    def post(self,request):
        forgetpwd_form = FogetPwdForm(request.POST)
        if forgetpwd_form.is_valid():
            email = request.POST.get('email')
            user = UserProfile.objects.get(email=email)
            if user is not None:
                send_email(email, 'forget')
                return render(request, 'common/mail_success.html')
            else:
                return render(request, 'forgetpwd.html', {'msg': '用戶不存在', 'forgetpwd_form': forgetpwd_form})
        else:
            return render(request, 'forgetpwd.html', {'forgetpwd_form': forgetpwd_form})

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
    <title>密碼修改</title>
    <link rel="stylesheet" type="text/css" href="/static/css/reset.css">
    <link rel="stylesheet" type="text/css" href="/static/css/animate.css">
    <link rel="stylesheet" type="text/css" href="/static/css/style.css">

<body>
<div class="wp">
    <div class="resetpassword" id="resetPwdForm">
        <h1>修改密碼</h1>
        <p>已經(jīng)通過驗證，請設置新密碼</p>
        <form id="reset_password_form" action="{% url 'modify_pwd' %}" method="post">
            <input type="hidden" name="email" value="{{ email }}">
            <ul>
                <li>
                    <span class="">新 密 碼 ：</span>
                    <input type="password" name="password1" id="pwd" placeholder="6-20位非中文字符">
                    <i></i>
                </li>
                <li>
                    <span class="">確定密碼：</span>
                    <input type="password" name="password2" id="repwd" placeholder="6-20位非中文字符">
                    <i></i>
                </li>
                <div class="error btns login-form-tips" id="jsLoginTips">{% for key,error in modifypwd_form.errors.items %}{{ error }}{% endfor %}{{ msg }}</div>
                <li class="button">
                     <input class="btn btn-green" id="jsLoginBtn" type="submit" value="提交" />
                </li>
            </ul>
            {% csrf_token %}
        </form>
    </div>
    <div class="resetpassword" id="reset_password_tips" style="display:none;">
        <h1>修改密碼成功,請重新登錄</h1>
        <img class="fl" src="/static/images/check2.png">
        <p class="successword">已經(jīng)成功修改密碼贷揽，請重新登錄</p>
    </div>
</div>
</body>
</html>

urls
    url(r'^reset/(?P<active_code>.*)/$', ResetPwdView.as_view(), name='reset'),
    url('^modify_pwd/$', ModifyPwdView.as_view(), name='modify_pwd'),


forms
class ModifyForm(forms.Form):
    password1 = forms.CharField(required=True, min_length=5)
    password2 = forms.CharField(required=True, min_length=5)

views
class ResetPwdView(View):
    def get(self, request, active_code):
        all_actives = EmailVerifyRecord.objects.filter(code=active_code)
        if all_actives:
            for active in all_actives:
                email = active.email
            return render(request, 'password_reset.html', {'email': email})
        else:
            return render(request, 'common/active_fail.html')


class ModifyPwdView(View):
    def post(self, request):
        modifypwd_form = ModifyForm(request.POST)
        if modifypwd_form.is_valid():
            email = request.POST.get('email')
            pwd1 = request.POST.get('password1', '')
            pwd2 = request.POST.get('password2', '')
            if pwd1 == pwd2:
                user = UserProfile.objects.get(email=email)
                user.password = make_password(pwd1)
                user.save()
                return render(request, 'login.html')
            else:
                return render(request, 'password_reset.html', {'msg': '密碼不一致', 'email': email})
        else:
            email = request.POST.get('email')
            return render(request, 'password_reset.html', {'email': email, 'modifypwd_form': modifypwd_form})

本篇博客原視頻博主[慕課在線教育平臺]
本篇博客撰寫人: XiaoJinZi 轉載請注明出處
學生能力有限附上郵箱: 986209501@qq.com 不足以及誤處請大佬指責

?著作權歸作者所有,轉載或內(nèi)容合作請聯(lián)系作者

人面猴
序言：七十年代末棠笑，一起剝皮案震驚了整個濱河市，隨后出現(xiàn)的幾起案子禽绪，更是在濱河造成了極大的恐慌蓖救，老刑警劉巖洪规，帶你破解...
沈念sama閱讀 219,188評論 6贊 508
死咒
序言：濱河連續(xù)發(fā)生了三起死亡事件，死亡現(xiàn)場離奇詭異循捺，居然都是意外死亡斩例，警方通過查閱死者的電腦和手機，發(fā)現(xiàn)死者居然都...
沈念sama閱讀 93,464評論 3贊 395
救了他兩次的神仙讓他今天三更去死
文/潘曉璐我一進店門从橘，熙熙樓的掌柜王于貴愁眉苦臉地迎上來念赶，“玉大人，你說我怎么就攤上這事恰力〔婷眨” “怎么了？”我有些...
開封第一講書人閱讀 165,562評論 0贊 356
道士緝兇錄：失蹤的賣姜人
文/不壞的土叔我叫張陵踩萎，是天一觀的道長停局。經(jīng)常有香客問我，道長香府，這世上最難降的妖魔是什么董栽？我笑而不...
開封第一講書人閱讀 58,893評論 1贊 295
?港島之戀（遺憾婚禮）
正文為了忘掉前任，我火速辦了婚禮企孩，結果婚禮上裆泳，老公的妹妹穿的比我還像新娘。我一直安慰自己柠硕，他們只是感情好工禾，可當我...
茶點故事閱讀 67,917評論 6贊 392
惡毒庶女頂嫁案：這布局不是一般人想出來的
文/花漫我一把揭開白布。她就那樣靜靜地躺著蝗柔，像睡著了一般闻葵。火紅的嫁衣襯著肌膚如雪。梳的紋絲不亂的頭發(fā)上癣丧，一...
開封第一講書人閱讀 51,708評論 1贊 305
城市分裂傳說
那天槽畔，我揣著相機與錄音，去河邊找鬼胁编。笑死厢钧，一個胖子當著我的面吹牛，可吹牛的內(nèi)容都是我干的嬉橙。我是一名探鬼主播早直，決...
沈念sama閱讀 40,430評論 3贊 420
雙鴛鴦連環(huán)套：你想象不到人心有多黑
文/蒼蘭香墨我猛地睜開眼，長吁一口氣：“原來是場噩夢啊……” “哼市框！你這毒婦竟也來了霞扬？” 一聲冷哼從身側響起，我...
開封第一講書人閱讀 39,342評論 0贊 276
萬榮殺人案實錄
序言：老撾萬榮一對情侶失蹤，失蹤者是張志新（化名）和其女友劉穎喻圃，沒想到半個月后萤彩，有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體，經(jīng)...
沈念sama閱讀 45,801評論 1贊 317
?護林員之死
正文獨居荒郊野嶺守林人離奇死亡斧拍，尸身上長有42處帶血的膿包…… 初始之章·張勛以下內(nèi)容為張勛視角年9月15日...
茶點故事閱讀 37,976評論 3贊 337
?白月光啟示錄
正文我和宋清朗相戀三年雀扶，在試婚紗的時候發(fā)現(xiàn)自己被綠了。大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片肆汹。...
茶點故事閱讀 40,115評論 1贊 351
活死人
序言：一個原本活蹦亂跳的男人離奇死亡愚墓，死狀恐怖，靈堂內(nèi)的尸體忽然破棺而出县踢，到底是詐尸還是另有隱情转绷，我是刑警寧澤，帶...
沈念sama閱讀 35,804評論 5贊 346
?日本核電站爆炸內(nèi)幕
正文年R本政府宣布硼啤，位于F島的核電站议经，受9級特大地震影響，放射性物質(zhì)發(fā)生泄漏谴返。R本人自食惡果不足惜煞肾，卻給世界環(huán)境...
茶點故事閱讀 41,458評論 3贊 331
男人毒藥：我在死后第九天來索命
文/蒙蒙一、第九天我趴在偏房一處隱蔽的房頂上張望嗓袱。院中可真熱鬧籍救，春花似錦、人聲如沸渠抹。這莊子的主人今日做“春日...
開封第一講書人閱讀 32,008評論 0贊 22
一樁弒父案，背后竟有這般陰謀
文/蒼蘭香墨我抬頭看了看天上的太陽梧却。三九已至奇颠，卻和暖如春，著一層夾襖步出監(jiān)牢的瞬間放航，已是汗流浹背烈拒。一陣腳步聲響...
開封第一講書人閱讀 33,135評論 1贊 272
情欲美人皮
我被黑心中介騙來泰國打工，沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留广鳍，地道東北人荆几。一個月前我還...
沈念sama閱讀 48,365評論 3贊 373
代替公主和親
正文我出身青樓，卻偏偏與公主長得像赊时，于是被迫代替她去往敵國和親吨铸。傳聞我的和親對象是個殘疾皇子，可洞房花燭夜當晚...
茶點故事閱讀 45,055評論 2贊 355

第四章 在線教育平臺(用戶登錄注冊)

用戶登錄注冊界面

首頁與登陸界面配置

類繼承方式 實現(xiàn)url跳轉

推薦閱讀更多精彩內(nèi)容

第四章在線教育平臺(用戶登錄注冊)

類繼承方式實現(xiàn)url跳轉