一、将password_reset.html 和forgetpwd.html 放入template 目录并修改文件如下:
<!DOCTYPE html>
<html>
{% load staticfiles %}
<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/login.css' %}">
</head>
<body>
<!--提示弹出框-->
<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="resetpassbox dialogbox" id="jsSetNewPwd">
<h1>重新设置密码</h1>
<div class="close jsCloseDialog"><img src="{% static 'images/dig_close.png' %}"/></div>
<p class="green">请输入新密码</p>
<form id="jsSetNewPwdForm">
<div class="box">
<span class="word2">密 码</span>
<input type="password" name="password" id="jsResetPwd" placeholder="请输入新密码"/>
</div>
<div class="box">
<span class="word2">确 认 密 码</span>
<input type="password" name="password2" id="jsResetPwd2" placeholder="请再次输入新密码"/>
</div>
<div class="box">
<span class="word2">验 证 码</span>
<input type="text" name="code" id="jsResetCode" placeholder="请输入手机验证码"/>
</div>
<div class="error btns" id="jsSetNewPwdTips"></div>
<div class="button">
<input type="hidden" name="mobile" id="jsInpResetMobil" />
<input id="jsSetNewPwdBtn" type="button" value="提交" />
</div>
</form>
</div>
<div class="bg" id="dialogBg"></div>
<header>
<div class="c-box fff-box">
<div class="wp header-box">
<p class="fl hd-tips">慕学网,在线学习平台!</p>
<ul class="fr hd-bar">
<li>服务电话:<span>33333333</span></li>
<li><a href="login.html">[登录]</a></li>
<li class="active"><a href="/forgetpwd/">[忘记密码]</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/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' %}" autocomplete="off">
<div class="form-group marb20 {% if forget_form.errors.email %}errorsput{% endif %}">
<label>帐 号</label>
<input type="text" id="account" name="email" value="{{ forget_form.email.value }}" placeholder="邮箱" />
</div>
<div class="form-group captcha1 marb38">
<label>验 证 码</label>
{{ forget_form.captcha }}
{# <img src="/captcha/image/997454dc58799e806f18d21eac296581a8c6ef02/" alt="captcha" class="captcha" /> <input id="id_captcha_0" name="captcha_0" type="hidden" value="997454dc58799e806f18d21eac296581a8c6ef02" /> <input autocomplete="off" id="id_captcha_1" name="captcha_1" type="text" />#}
</div>
<div class="error btns" id="jsForgetTips"></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>
</section>
<input id="isLogin" type="hidden" value="False"/>
<script src="{% static 'js/jquery.min.js' %}" type="text/javascript"></script>
<script src="{% static 'js/unslider.js' %}" type="text/javascript"></script>
<script src="{% static 's/validateDialog.js' %}j" type="text/javascript"></script>
<script src="{% static 'js/login.js' %}" type="text/javascript"></script>
</body>
</html>
pasword_reset.html
<!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>已经通过验证,请设置新密码</p>
<form id="reset_password_form" action="{% url 'modify_pwd' %}" method="post">
<ul>
<li>
<div class="{% if modify_pwd.errors.password1 %}errorput{% endif %}">
<span class="">新 密 码 :</span>
<input type="password" name="password1" id="pwd" placeholder="6-20位非中文字符">
<i>{{ str }}{{ msg }}</i>
</div>
</li>
<input type="hidden" name = "email" value="{{ email }}">
<li>
<div class="{% if modify_pwd.errors.password2 %}errorput{% endif %}">
<span class="">确定密码:</span>
<input type="password" name="password2" id="repwd" placeholder="6-20位非中文字符">
<i >{{ str2 }}{{ msg }}</i>
</div >
</li>
<div class="error btns" id="jsEmailTips"></div>
<li class="button">
<input 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">已经成功修改密码,请重新登录</p>
</div>
</div>
</body>
</html>
二、users 新增forms如下:
# _*_encoding:utf-8_*_
__author__ = 'wuhuhuan'
__date__ = '2020/4/18 11:42'
from django import forms
from captcha.fields import CaptchaField
class LoginForm(forms.Form):
username = forms.CharField(required=True)
password = forms.CharField(required=True, min_length=5)
class RegisterForm(forms.Form):
email = forms.EmailField(required=True)
password = forms.CharField(required=True, min_length=5)
# 可以通过error_messages 修改无效的提示
captcha = CaptchaField(error_messages={"invalid": u"验证码错误!!!"})
# 新增忘记密码form
class ForgetPwdForm(forms.Form):
email = forms.EmailField(required=True)
captcha = CaptchaField(error_messages={"invalid": u"验证码错误!"})
# 新增修改密码form
class ModifyPwdForm(forms.Form):
password1 = forms.CharField(required=True, min_length=5)
password2 = forms.CharField(required=True, min_length=5)
三、users views.py 新增如下:
# _*_ coding: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 django.contrib.auth.hashers import make_password
# 导入view类
from django.views.generic.base import View
from .models import UserProfile, EmailVerifyRecord
from utils.email_send import send_register_email
# 导入loginForm 类
from users.forms import LoginForm, RegisterForm, ForgetPwdForm, ModifyPwdForm
# Create your views here.
class ActiveUserView(View):
def get(self, request, active_code):
all_records = EmailVerifyRecord.objects.filter(code=active_code)
if all_records:
for record in all_records:
email = record.email
user = UserProfile.objects.get(email=email)
user.is_active = True
user.save()
return render(request, "login.html")
else:
return render(request, "active_fail.html")
return render(request, "login.html")
# 新增registerView方法
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():
user_name = request.POST.get("email", "")
if UserProfile.objects.filter(email=user_name):
return render(request, "register.html", {'register_form': register_form, 'msg': '用户已注册'})
pass_word = request.POST.get("password", "")
user_profile = UserProfile()
user_profile.username = user_name
user_profile.email = user_name
user_profile.password = make_password(pass_word)
user_profile.save()
status = send_register_email(user_name, 'register')
if status:
return render(request, "login.html", {})
else:
return render(request, "register.html", {'msg': "注册失败"})
else:
return render(request, "register.html", {'register_form': register_form})
#新增定义 loginViw 方法继承View
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:
if user.is_active:
login(request, user)
return render(request, "index.html", {'nickname': user})
else:
return render(request, "login.html", {"msg": u"用户未激活"})
else:
return render(request, "login.html", {"msg": u"用户名或密码错误"})
else:
return render(request, "login.html", {"login_form": login_form})
class CustomBackend(ModelBackend):
def authenticate(self, request, 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", {'nickname': user})
else:
return render(request, "login.html", {'msg': u"用户名或密码错误!"})
elif request.method == 'GET':
return render(request, 'login.html', {})
class ForgetPwdView(View):
def get(self, request):
forget_form = ForgetPwdForm()
return render(request, "forgetpwd.html", {"forget_form": forget_form})
def post(self, request):
forget_form = ForgetPwdForm(request.POST)
if forget_form.is_valid():
email = request.POST.get("email", "")
send_register_email(email, "forget")
return render(request, "send_success.html", {})
else:
return render(request, "forgetpwd.html", {"forget_form": forget_form})
# 新增重置密码view
class ResetUserView(View):
def get(self, request, active_code):
all_records = EmailVerifyRecord.objects.filter(code=active_code)
if all_records:
for record in all_records:
email = record.email
return render(request, "password_reset.html", {'email': email})
else:
return render(request, "active_fail.html")
return render(request, "login.html")
# 新增修改密码view
class ModifyPwdView(View):
def post(self, request):
modify_pwd = ModifyPwdForm(request.POST)
email = request.POST.get("email", "")
if modify_pwd.is_valid():
pwd1 = request.POST.get("password1", "")
pwd2 = request.POST.get("password2", "")
if pwd1 != pwd2:
return render(request, 'password_reset.html', {'email': email, 'msg': "密码不一致"})
user = UserProfile.objects.get(email=email)
user.password = make_password(pwd2)
user.save()
return render(request, "login.html", {})
else:
str = modify_pwd.errors['password1'][0]
str2 = modify_pwd.errors['password2'][0]
return render(request, 'password_reset.html', {'email': email, 'str': str,'str2': str2, 'modify_pwd': modify_pwd})
四、testdjango 项目urls.py 新增如下
#_*_encoding:utf-8_*_
# xadmin的依赖
import xadmin
from xadmin.plugins import xversion
from django.conf.urls import url, include
from django.views.generic import TemplateView
from users.views import user_login
# 导入LoginView 类
from users.views import LoginView, RegisterView, ActiveUserView, ForgetPwdView, ResetUserView, ModifyPwdView
xadmin.autodiscover()
# version模块自动注册需要版本控制的 Model
xversion.register_models()
urlpatterns = [
url(r'^adminx/', xadmin.site.urls),
url(r'^$', TemplateView.as_view(template_name="index.html"), name='index'),
# 修改调用LoginView.as_view()
url(r'^login/$', LoginView.as_view(), name="login"),
url(r'^register/$', RegisterView.as_view(), name="register"),
url(r'^captcha/', include('captcha.urls')),
# (?P<active_code>.*)提取active路径后面的参数 http://127.0.0.1:8000/active/F0SNBhzlMRSHtsBA 获取F0SNBhzlMRSHtsBA 并返回给active_code
url(r'^active/(?P<active_code>.*)/$', ActiveUserView.as_view(), name="active"),
url(r'^forget', ForgetPwdView.as_view(), name="forget"),
# 新增忘记密码如下2个页面url
url(r'^reset/(?P<active_code>.*)/$', ResetUserView.as_view(), name="reset_pwd"),
url(r'^modify_pwd/$', ModifyPwdView.as_view(), name="modify_pwd")
]
五、utils email_send.py新增发送验证码逻辑
#_*_encoding:utf-8_*_
__author__ = 'wuhuhuan'
__date__ = '2020/4/19 9:32'
from random import Random
from users.models import EmailVerifyRecord
from django.core.mail import send_mail
from testdjango.settings import EMAIL_FROM
def send_register_email(email, send_type='register'):
email_record = EmailVerifyRecord()
code = random_str(16)
email_record.code = code
email_record.email = email
email_record.send_type = send_type
email_record.save()
email_title = ""
email_body = ""
if send_type == "register":
email_title = u"激活在线激活链接"
email_body = u"请点击下面的链接激活你的账号: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
#新增 forget 发送验证码逻辑
elif send_type == "forget":
email_title = "在线网注册密码重置1"
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
def random_str(randomlength=8):
str = ''
chars = 'AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQqRrSsTtUuVvWwXxYyZz0123456789'
length = len(chars) - 1
random = Random()
for i in range(randomlength):
str += chars[random.randint(0, length)]
return str
六、验证