django 前台登陆退出页手机号api接入后台登陆中间件 a标签使用js代码提交表单

最新推荐文章于 2024-11-22 19:28:02 发布

原创最新推荐文章于 2024-11-22 19:28:02 发布 · 249 阅读

0 ·

CC 4.0 BY-SA版权

python 同时被 3 个专栏收录

36 篇文章

订阅专栏

web后端

27 篇文章

订阅专栏

django

27 篇文章

订阅专栏

本文详细介绍了如何使用Django框架实现后台管理系统的登录与注册功能，包括自定义中间件进行登录状态检测、表单数据验证、密码加密处理、短信验证码发送与验证等关键步骤。

1 ,首先在应用下，创建AdminMiddleware.py模块

AdminMiddleware.py

from django.shortcuts import render
from django.http import HttpResponse
import re
# 简单介绍逻辑    判断，如过访问的路径中带/myadmin/内部文件，那么就检测有没有登陆，如果没有登陆，便让其登陆
class AdminLoginMiddleware:
    def __init__(self, get_response):
        self.get_response = get_response
        # One-time configuration and initialization.

    def __call__(self, request):
        # 用户的请求路径# /myadmin/cate/index/
        path = request.path
        # 定义允许访问的路径,
        arr = ['/myadmin/login/','/myadmin/dologin/','/myadmin/verifycode/']
        # 检测用户是否访问后台,并且不是进入登录页面,
        if re.match('/myadmin/',path) and path not in arr:
            # 检测是否已经登录
            AdminUser = request.session.get('AdminUser',None)
            if not AdminUser:
                # 没有登录
                return HttpResponse('<script>alert("请先登录");location.href="/myadmin/login/"</script>')


        response = self.get_response(request)
        return response

2，在settings.py模块中添加自己创建的中间件

settings.py

MIDDLEWARE = [
    'django.middleware.security.SecurityMiddleware',
    'django.contrib.sessions.middleware.SessionMiddleware',
    'django.middleware.common.CommonMiddleware',
    'django.middleware.csrf.CsrfViewMiddleware',
    'django.contrib.auth.middleware.AuthenticationMiddleware',
    'django.contrib.messages.middleware.MessageMiddleware',
    'django.middleware.clickjacking.XFrameOptionsMiddleware',
    # 自定义登录检测的中间件
    'myadmin.AdminMiddleware.AdminLoginMiddleware',
]

注册页

<div class="normalInput cycode-box fieldInput" >
    <div class="cycode-selectbox">
        <input class="ipt-account inp-focus" name="nikename" required maxlength="50"
        placeholder="昵称" autocomplete="off">
    </div>
</div>
<div class="normalInput cycode-box fieldInput" id="cycode-box">
    <div class="cycode-selectbox">
        <input class="ipt-account inp-focus" name="phone" id="account" required maxlength="50"
        placeholder="手机号" autocomplete="off">
    </div>
</div>
<div class="normalInput fieldInput passwd-box">
    <input class="inp-focus" name="password" id="password" required maxlength="16"
    placeholder="密码" autocomplete="off" type="password">
</div>
<div class="normalInput fieldInput passwd-box" style="position: relative;">
    <input class="inp-focus" name="vcode"  required maxlength="16"
    placeholder="手机验证码" autocomplete="off" type="text">
    <button type="button" id="SendMsg" style="position: absolute;top:10px;right:2px;height: 30px;line-height: 30px;">发送短信</button>
</div>
        <!-- 底部区域 E -->
        <script type="text/javascript">
            // 绑定单击事件,获取手机号,发送短信验证
            $('#SendMsg').click(function(){
                // 获取手机号
                var phone = $('#account').val()
                // 验证手机号是否正确
                reg = /^\d{11}$/
                if(reg.test(phone)){
                    // 发送短信验证码
                    $.get('{% url 'myhome_sendMsg' %}',{'phone':phone},function(data){
                        // console.log(data)
                        // 设置按钮不可点击,倒计时
                    
                    },'json')
                }
            })
            $('#nextStep').click(function(){
                // 获取当前元素的父级 表单
                $(this).parents('form').submit()
            })
        </script>

from django.shortcuts import render
from django.http import HttpResponse,JsonResponse
from django.contrib.auth.hashers import make_password, check_password
from myadmin.models import Users

# Create your views here.

# 显示登录页面
def myhome_login(request):
    # 加载页面
    return render(request,'myhome/login/login.html')

# 执行登录
def myhome_dologin(request):
    # 验证手机号 用户是否存在
    try:
        ob = Users.objects.get(phone=request.POST['phone'])
        # 验证密码
        res =  check_password(request.POST['password'],ob.password)
        if res:
            # 验证成功
            request.session['VipUser'] = {'uid':ob.id,'nikename':ob.nikename,'phone':ob.phone,'pic_url':ob.pic_url}
            return HttpResponse('<script>alert("登录成功");location.href="/";</script>')
            
    except:
        pass

    return HttpResponse('<script>alert("手机号或密码不正确");location.href="/login/";</script>')

# 退出登录
def myhome_logout(request):
	#删除session
    del request.session['VipUser']
    return HttpResponse('<script>alert("退出登录");location.href="/";</script>')
    


# 显示注册页面
def myhome_register(request):
    # 加载页面
    return render(request,'myhome/login/register.html')

# 执行注册
def myhome_doregister(request):
    try:
        # 接收表单注册的数据
        data = request.POST.dict()
        data.pop('csrfmiddlewaretoken')

        # 验证手机短信验证码是否正确
        msgcode = request.session['msgcode']
        if data['vcode'] == msgcode['code'] and data['phone'] == msgcode['phone']:
            # 删除表单中的 vcode
            data.pop('vcode')
            # # 验证手机号是否存在
            # res = Users.objects.filter(phone=data['phone']).count()
            # if res:
            #     # 手机号已存在
            #     return HttpResponse('<script>alert("手机号已存在");history.back(-1);</script>')
            # 密码进行加密处理
            data['password'] = make_password(data['password'], None, 'pbkdf2_sha256')

            # 执行注册 ,数据的添加
            ob = Users(**data)
            ob.save()
            return HttpResponse('<script>alert("注册成功,请登录");location.href="/login/";</script>')

        else:
            return HttpResponse('<script>alert("手机验证码错误");history.back(-1);</script>')
        
    except:
        pass

    return HttpResponse('<script>alert("注册失败,请联系管理员");location.href="/register/";</script>')


# 短信发送...
def myhome_sendMsg(request):
    import random
    # 接收手机号码
    phone = request.GET.get('phone')
    # 随机验证码
    code = str(random.randint(10000,99999))
    # 把验证码存入session
    request.session['msgcode'] = {'code':code,'phone':phone}

    # 调用方法 发送短信验证
    res = hywx_send(phone,code)
    # 返回json数据
    return JsonResponse(res)
# 执行请求接口
def hywx_send(mobile,code):
    #接口类型：互亿无线触发短信接口，支持发送验证码短信、订单通知短信等。
    #账户注册：请通过该地址开通账户http://user.ihuyi.com/register.html
    #注意事项：
    #（1）调试期间，请用默认的模板进行测试，默认模板详见接口文档；
    #（2）请使用 用户名 及 APIkey来调用接口，APIkey在会员中心可以获取；
    #（3）该代码仅供接入互亿无线短信接口参考使用，客户可根据实际需要自行编写；
      
    # import urllib2
    import urllib
    import urllib.request
    import json
 
    #用户名 查看用户名请登录用户中心->验证码、通知短信->帐户及签名设置->APIID
    account  = "C38835596" 
    #密码 查看密码请登录用户中心->验证码、通知短信->帐户及签名设置->APIKEY
    password = "b51ce646656d57b3b3a6051e4aaa1a8a"
    # mobile = request.GET.get('phone')
  
    text = "您的验证码是："+code+"。请不要把验证码泄露给其他人。"
    data = {'account': account, 'password' : password, 'content': text, 'mobile':mobile,'format':'json' }
    req = urllib.request.urlopen(
        url= 'http://106.ihuyi.com/webservice/sms.php?method=Submit',
        data= urllib.parse.urlencode(data).encode('utf-8')
    )
    获取接口响应的内容
    content = req.read()
    res = json.loads(content.decode('utf-8'))

    # res = {'code':2,'msg':'提交成功','id':'1111','yzm':code}
    return res

登陆页使用a表签，提交表单
login.html


   <form action="{% url 'myhome_dologin' %}" method="post" id="mainForm" class="main-form">
       {% csrf_token %}
       <div class="tab-title">
           <a class="linkAGray" id="toAccountLogin" href="javascript:void(0);">
               账号登录
           </a>
       </div>
       <div class="normalInput cycode-box fieldInput" id="cycode-box">
           <div class="cycode-selectbox">
               <input class="ipt-account inp-focus" name="phone" id="account" required maxlength="50"
               placeholder="手机号" autocomplete="off">
           </div>
       </div>
       <div class="normalInput fieldInput passwd-box">
           <input class="inp-focus" name="password" id="password" required maxlength="16"
           placeholder="密码" autocomplete="off" type="password">
       </div>
       <a id="register" class="fullBtnBlue">
           登录
       </a>
       <div class="transferField">
           <a class="go2forgetpwd linkABlue rememberFieldForA" href="#">
               忘记密码?
           </a>
           <a class="go2register linkABlue" href="{% url 'myhome_register' %}" id="toRegister">
               注册
           </a>
       </div>
   </form>
        <!-- 主内容区域 E-->

        <!-- 底部区域 E -->
   <script type="text/javascript">
		//此处写的是js代码，提交a标签表单
       $('#register').click(function(){
           // 获取当前元素的父级 表单 
           $(this).parents('form').submit()
       })
   </script>