路飞学成登录

用户的登陆认证

前端首页实现登陆状态的判断

Header.vue组件代码：

 

头部组件中实现退出登录

实现的思路：头部子组件是通过token值进行判断登录状态，所以当用户点击"退出登录"，则需要移出token的值，并使用elementUI里面的弹窗组件进行提示。

Header.vue组件代码：

​

 

 

在登录认证中接入极验验证

官网： https://www.geetest.com/first_page/

注册登录以后，即进入登录后台，选择行为验证。

 

 

 

接下来，就可以根据官方文档，把验证码集成到项目中了

 

''文档地址：https://docs.geetest.com/install/overview/start/

下载和安装验证码模块包。

git clone https://github.com/GeeTeam/gt3-python-sdk.git

安装依赖模块

pip install requests

 

把验证码模块放置到在libs目录中

users/views.py文件下方：

from rest_framework.views import APIView
from luffy.libs.geetest import GeetestLib
from django.conf import settings
import random
from rest_framework.response import Response
​
class CaptchaAPIView(APIView):
    """极验验证码"""
    def get(self,request):
        """提供生成验证码的配置信息"""
        user_id = '%06d' % random.randint(1,9999)
        gt = GeetestLib(settings.PC_GEETEST_ID, settings.PC_GEETEST_KEY)
        status = gt.pre_process(user_id)
        print(status)
​
        # 把这两段数据不要保存在session里面, 保存到redis里面
        request.session[gt.GT_STATUS_SESSION_KEY] = status
        request.session["user_id"] = user_id
​
        response_str = gt.get_response_str()
        return Response(response_str)
​
    def post(self,request):
        """进行二次验证"""
        pass

users/urls.py路由注册：

path(r'captcha/', views.CaptchaAPIView.as_view() ),

配置文件settings/dev.py代码：

PC_GEETEST_ID = '5f4ab1914455506edffaffd4da37fea5'
PC_GEETEST_KEY ='460e13a49d687e5e44e25c383f0473a6'

 

前端获取显示并校验验证码

把下载会哦图的验证码模块包中的gt.js放置到前端项目中，并在main.js中引入

// 导入gt极验
import '../static/globals/gt.js'

显示验证码