主要实现功能

• 用户输入邮箱、密码和验证码，点注册按钮
• 如果输入的不正确，提示错误信息
• 如果正确，发送激活邮件，用户通过邮件激活后才能登陆
• 即使注册成功，没有激活的用户也不能登陆

初步视图

users/views.py

class RegisterView(View):
    '''用户注册'''
    def get(self,request):
        return render(request,'register.html')

用户以get方式，直接返回注册页面

路由设计

# MxOnline/urls.py

from users.views import RegisterView


    path('register/',RegisterView.as_view(),name = 'register'),

urls中。通过类的as_view方法，调用这个View类

模板修改

修改index.html

点 “注册 ”应该跳到用户注册页面

 <a style="color:white" class="fr registerbtn" href="/register/">注册</a>

 <a style="color:white" class="fr loginbtn" href="/login/">登录</a>

修改register.html中的静态文件地址

{% load staticfiles %}

<link rel="stylesheet" type="text/css" href="{% static 'css/reset.css' %}">
    <link rel="stylesheet" type="text/css" href="{% static 'css/login.css' %}">

.
.
.

<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/validateDialog.js' %}"  type="text/javascript"></script>
<script src="{% static 'js/login.js' %}"  type="text/javascript"></script>

测试一下从index界面点注册能不能跳到register界面

image

验证码

验证码库：django-simple-captcha，这里面有介绍这个第三方库的使用方法

安装：

pip install  django-simple-captcha

Add captcha to the INSTALLED_APPS in your settings.py

urlpatterns = [
    path('captcha/',include('captcha.urls')),
]

生成到数据库

python manage.py makemigrations

python manage.py migrate

可以看到数据库多了一张表

image

在注册页面显示验证码

定义我们的register form:

# users/forms.py

from captcha.fields import CaptchaField

class RegisterForm(forms.Form):
    '''注册验证表单'''    
    email = forms.EmailField(required=True)
    password = forms.CharField(required=True,min_length=5)
    # 验证码，字段里面可以自定义错误提示信息
    captcha = CaptchaField()

通过{{ register_form.captcha }}获取验证码

<div class="form-group marb8 captcha1 ">
     <label>验&nbsp;证&nbsp;码</label>
     {{ register_form.captcha }}
</div>

image image

完善注册的后台逻辑

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', None)
            # 如果用户已存在，则提示错误信息
            if UserProfile.objects.filter(email = user_name):
                return render(request, 'register.html', {'register_form':register_form,'msg': '用户已存在'})

            pass_word = request.POST.get('password', None)
            # 实例化一个user_profile对象
            user_profile = UserProfile()
            user_profile.username = user_name
            user_profile.email = user_name
            user_profile.is_active = False
            # 对保存到数据库的密码加密
            user_profile.password = make_password(pass_word)
            user_profile.save()
            send_register_eamil(user_name,'register')
            return render(request,'login.html')
        else:
            return render(request,'register.html',{'register_form':register_form})

说明：

• 如果是get请求，直接返回注册页面给用户
• 如果是post请求，先生成一个表单实例，并获取用户提交的所有信息（request.POST）
• is_valid()方法，验证用户的提交信息是不是合法
• 如果合法，获取用户提交的email和password
• 实例化一个user_profile对象，把用户添加到数据库
• 默认添加的用户是激活状态（is_active=1表示True），在这里我们修改默认的状态（改为is_active = False），只有用户去邮箱激活之后才改为True
  对密码加密，然后保存，发送邮箱，username是用户注册的邮箱，‘register’表明是注册
• 注册成功跳转到登录界面

发送激活邮件

在Python中已经内置了一个smtp邮件发送模块，Django在此基础上进行了简单地封装，让我们在Django环境中可以更方便更灵活的发送邮件。

所有的功能都在django.core.mail中。

首先settings里面设置

# settings.py

EMAIL_HOST = "smtp.qq.com"  # SMTP服务器主机
EMAIL_PORT = 25             # 端口
EMAIL_HOST_USER = "1184405959@qq.com"       # 邮箱地址
EMAIL_HOST_PASSWORD = "dwjybikexxxxxxxx"    # 密码
EMAIL_USE_TLS= True
EMAIL_FROM = "1184405959@qq.com"            # 邮箱地址

说明：

EMAIL_HOST = "smtp.qq.com"

EMAIL_HOST_PASSWORD = "dwjybikexxxxxxxx"

要想用qq邮箱作为服务器发送邮件，必须先开启SMTP，方法如下：

1）登录邮箱，找到“设置”-->>“用户”

image

2）往下拉找到SMTP服务，点开启，然后点“生成授权码”

image

3）可以看到授权码，“EMAIL_HOST_PASSWORD”里面填写的就是下面生成的授权码，而不是你的邮箱密码

image

在apps目录新建package utils,然后新建一个email_send.py文件

image

# apps/utils/email_send.py

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

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

# 生成随机字符串
def random_str(random_length=8):
    str = ''
    # 生成字符串的可选字符串
    chars = 'AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQqRrSsTtUuVvWwXxYyZz0123456789'
    length = len(chars) - 1
    random = Random()
    for i in range(random_length):
        str += chars[random.randint(0, length)]
    return str

# 发送注册邮件
def send_register_eamil(email, send_type="register"):
    # 发送之前先保存到数据库，到时候查询链接是否存在
    # 实例化一个EmailVerifyRecord对象
    email_record = EmailVerifyRecord()
    # 生成随机的code放入链接
    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 = "NBA注册激活链接"
        email_body = "请点击下面的链接激活你的账号: http://127.0.0.1:8000/active/{0}".format(code)

        # 使用Django内置函数完成邮件发送。四个参数：主题，邮件内容，发件人邮箱地址，收件人（是一个字符串列表）
        send_status = send_mail(email_title, email_body, EMAIL_FROM, [email])
        # 如果发送成功
        if send_status:
            pass

激活用户

根据邮箱找到对应的用户，然后设置is_active = True来实现

# 激活用户
class ActiveUserView(View):
    def get(self, request, active_code):
        # 查询邮箱验证记录是否存在
        all_record = EmailVerifyRecord.objects.filter(code = active_code)

        if all_record:
            for record in all_record:
                # 获取到对应的邮箱
                email = record.email
                # 查找到邮箱对应的user
                user = UserProfile.objects.get(email=email)
                user.is_active = True
                user.save()
         # 验证码不对的时候跳转到激活失败页面
        else:
            return render(request,'active_fail.html')
        # 激活成功跳转到登录页面
        return render(request, "login.html", )

在templates目录下创建 active_fail.html,代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <p style="color: red;">链接失效</p>
</body>
</html>

激活邮箱的邮件如下：

image

修改login视图

添加一个判断，用户注册的后，等激活才能登陆

image

修改register.html

 <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 login_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 login_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 login_form.errors.captchal %}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 %}
                            {{ msg }}
                        </div>
                        <div class="auto-box marb8">
                        </div>
                        <input class="btn btn-green" id="jsEmailRegBtn" type="submit" value="注册并登录" />
                    <input type='hidden' name='csrfmiddlewaretoken' value='5I2SlleZJOMUX9QbwYLUIAOshdrdpRcy' />
                    {% csrf_token %}
                    </form>

修改的地方说明：

• value="{{ register_form.email.value }}
• value="{{ register_form.password.value }} 注册的用户不用再手动输入一遍邮箱和密码了
• {% if login_form.errors.email %}errorput{% endif %}
• {% if login_form.errors.password %}errorput{% endif %}
• {% if login_form.errors.captchal %}errorput{% endif %} 提示错误信息并显示红框框
• {{ register_form.captcha }} 显示验证码

添加邮件激活的url

# MxOnline/urls.py

import xadmin

from django.urls import path,include,re_path

from django.views.generic import TemplateView
from users.views import LoginView,RegisterView,ActiveUserView


urlpatterns = [
    path('xadmin/', xadmin.site.urls),
    path('', TemplateView.as_view(template_name='index.html'),name='index'),
    path('login/',LoginView.as_view(),name = 'login'),
    path('register/',RegisterView.as_view(),name = 'register'),
    path('captcha/',include('captcha.urls')),
    re_path('active/(?P<active_code>.*)/',ActiveUserView.as_view(),name='user_active'),
]