（项目）在线教育平台（四）

六、注册功能

1、注册页面配置

　　将注册页面register.html前端文件拷贝到项目的templates文件夹内。

　　然后修改注册页面register.html初始文件中的静态文件访问路径，修改成{% static '静态文件路径' %}的形式,如下：

　　在index.html文件中修改跳转到注册页面的url：

2、第三方工具验证码的配置

　　在邮箱注册时，需要生成图片验证码，这就需要借助第三方库django-simple-captcha来实现。

2.1 安装

　　在虚拟环境中直接pip install django-simple-captcha

2.2 在setting.py中配置这个库

INSTALLED_APPS = [ 2     'captcha',
]

2.3 在urls.py中配置验证码的url

urlpatterns = [
    path('captcha/', include('captcha.urls')),  # 验证码
]

2.4 生成数据库中的表

　　执行迁移数据库的命令，生成如下一张表：

2.5 在注册页面显示验证码

　　首先在form.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 }}来显示验证码的图片：

　　现在刷新注册页面，点击验证码图片后会刷新验证码图片。

3、后端用户注册接口

3.1 编写注册接口

　　在users/views.py文件中编写登录的接口：

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():
            #  form表单验证通过，从request请求中获取邮箱
            user_name = request.POST.get('email', None)

            # 从UserProfile表中查询邮箱是否存在
            if UserProfile.objects.filter(email=user_name):
                return render(request, 'register.html', {'register_form': register_form, 'msg': '用户已注册'})

            # 从request中获取密码
            pass_word = request.POST.get('password', None)
            # 将注册信息保存数据库
            user_profile = UserProfile()
            user_profile.username = user_name
            user_profile.email = user_name
            user_profile.is_active = False  # 账户现在是未激活状态，需要邮件激活后才能变为True
            # 注意，这里密码存储的时候需要加密存储，通过django的make_password方法进行加密
            user_profile.password = make_password(pass_word)
            user_profile.save()

            # 注册完成，返回登录页面
            return render(request, 'login.html')
        else:
            return render(request, 'register.html', {'register_form': register_form})

3.2 添加注册的url

from users.views import RegisterView

urlpatterns = [
    path('register/', RegisterView.as_view(), name='register'),  # 注册
]

3.3 发送激活邮件

　　通过django的邮件发送模块来发送激活邮件，首先需要在settings.py文件中设置邮件发送服务器：

# 发送邮件配置
EMAIL_HOST = "smtp.qq.com"  # SMTP服务器主机
EMAIL_PORT = 25             # 端口
EMAIL_HOST_USER = "779060694@qq.com"       # 邮箱地址
EMAIL_HOST_PASSWORD = "dhjuveakiuqibeje"    # 密码
EMAIL_USE_TLS= True
EMAIL_FROM = "779060694@qq.com"            # 邮箱地址

　　以QQ邮箱为例，作为发送邮件的服务器，EMAIL_HOST_PASSWORD的密码是通过下面的生成授权码生成的，设置如下：

　　然后编写邮件代码，在apps下新建包utils，在该包下新建send_email.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 x in range(random_length):
        str += chars[random.randint(0, length)]
    return str


def send_register_email(email, send_type='register'):
    """发送注册邮件"""
    # 发送之前先保存到数据库，需要查询链接是否存在
    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 = '知能网注册激活链接'
        email_body = '请点击下面的链接激活你的账号：http://127.0.0.1:8000/active/{}'.format(code)

        # 发送邮件
        send_status = send_mail(email_title, email_body, EMAIL_FROM, [email])
        if send_status:
            pass

　　在发送邮件之前，需要修改注册接口，在注册数据保存之后，发送邮件：

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():
            #  form表单验证通过，从request请求中获取邮箱
            user_name = request.POST.get('email', None)

            # 从UserProfile表中查询邮箱是否存在
            if UserProfile.objects.filter(email=user_name):
                return render(request, 'register.html', {'register_form': register_form, 'msg': '用户已注册'})

            # 从request中获取密码
            pass_word = request.POST.get('password', None)
            # 将注册信息保存数据库
            user_profile = UserProfile()
            user_profile.username = user_name
            user_profile.email = user_name
            user_profile.is_active = False  # 账户现在是未激活状态，需要邮件激活后才能变为True
            # 注意，这里密码存储的时候需要加密存储，通过django的make_password方法进行加密
            user_profile.password = make_password(pass_word)
            user_profile.save()

            # 发送注册激活邮件
            send_register_email(user_name, 'register')

            # 注册完成，返回登录页面
            return render(request, 'login.html')
        else:
            return render(request, 'register.html', {'register_form': register_form})

　　现在，就可以在注册时，发送注册激活链接了。

3.4 激活用户

　　我们需要新建一个激活失败需要返回的页面，在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>

　　用户在注册之后，不能直接登录，需要点击邮件中的激活链接连激活账号，需要在users/views.py文件中编写激活账户的接口：

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:
                # 获取对应的邮箱和其用户，将is_active置为True
                email = record.email
                user = UserProfile.objects.get(email=email)
                user.is_active = True
                user.save()
        else:
            # 不存在，返回失败页面
            return render(request, 'active_fail.html')
        # 激活成功，返回登录页面
        return render(request, 'login.html')

　　然后配置激活链接的url：

from users.views import ActiveUserView

urlpatterns = [
    re_path('active/(?P<active_code>.*)/', ActiveUserView.as_view(), name='user_active'),  # 激活用户
]

　　现在就可以注册成功了，在登录的时候需要加一个条件，也就是激活账户才能登录：

class LoginView(View):
    """登录"""
    def get(self, request):
        return render(request, 'login.html')

    def post(self, request):
        # form实例化
        login_form = LoginForm(request.POST)
        if login_form.is_valid():
            # form验证通过,获取用户提交的用户名和密码
            user_name = request.POST.get('username', None)
            pass_word = request.POST.get('password', None)

            # 通过django的authenticate方法获取user对象，也就是验证用户是否存在
            user = authenticate(username=user_name, password=pass_word)

            if user is not None:
                if user.is_active:
                    # 只有激活用户才能登录
                    # 验证通过，通过django的login方法去登录，然后返回首页
                    login(request, user)
                    return render(request, 'index.html')
                else:
                    # 验证不通过，返回登录页面,并将错误信息返回去显示
                    return render(request, 'login.html', {'msg': '用户名或密码错误', 'login_form': login_form})
            else:
                # 验证不通过，返回登录页面,并将错误信息返回去显示
                return render(request, 'login.html', {'msg': '用户名或密码错误', 'login_form': login_form})
        else:
            return render(request, 'login.html', {'login_form': login_form})

4、前端错误提示信息修改

　　注册失败后，前端需要有错误信息提示，register.html修改地方如下：