• django登录功能接口设计和代码实现,ajax,闭包,cookie,session,装饰器


    用户登录

    (1)  显示登录页面

    url

    视图函数名

    模板文件

    父模板文件

    /user/login/

    login

    login.html

    base.html

     

    (2)  用户登录的前端js校验。

    用户名和密码不可为空。

    $(function(){
    
        var error_name = false;
        var error_password = false;
        var error_check_password = false;
    
    
        $('#user_name').blur(function() {
            check_user_name();
    
        });
    
        $('#pwd').blur(function() {
            check_pwd();
        });
    
        $('#cpwd').blur(function() {
            check_cpwd();
        });
    
        function check_user_name(){
            var len = $('#user_name').val().length;
            if(len<5||len>20)
            {
                $('#user_name').next().html('请输入5-20个字符的用户名')
                $('#user_name').next().show();
                error_name = true;
            }
            else
            {
                $('#user_name').next().hide();
                error_name = false;
            }
        }
    
        function check_pwd(){
            var len = $('#pwd').val().length;
            if(len<8||len>20)
            {
                $('#pwd').next().html('密码最少8位,最长20位')
                $('#pwd').next().show();
                error_password = true;
            }
            else
            {
                $('#pwd').next().hide();
                error_password = false;
            }        
        }
        function check_cpwd(){
            var pass = $('#pwd').val();
            var cpass = $('#cpwd').val();
    
            if(pass!=cpass)
            {
                $('#cpwd').next().html('两次输入的密码不一致')
                $('#cpwd').next().show();
                error_check_password = true;
            }
            else
            {
                $('#cpwd').next().hide();
                error_check_password = false;
            }        
            
        }
    
        $('#reg_form2').submit(function() {
            check_user_name();
            check_pwd();
            check_cpwd();
    
            if(error_name == false && error_password == false && error_check_password == false)
            {
                return true;
            }
            else
            {
                return false;
            }
    
        });
    
    })

    (3)  输入用户名和密码,点击登录进行登录操作。Ajax

    url

    视图函数名

    模板文件

    父模板文件

    /user/login_check/

    login_check

    $(function () {
                $('#btnlogin').click(function () {
                    // 获取用户名和密码,csrf_tocon
                    username = $('#username').val()
                    password = $('#pwd').val()
                    csrf = $('input[name="csrfmiddlewaretoken"]').val()
                    // 传递给服务器的csrf名称为前端浏览器宣传后所生成的名称
    
                    // 记住用户名  结果为true 或 false
                    remember= $('input[name="remember"]').is(':checked')
    
                    temp = {'username':username, 'password':password, 'csrfmiddlewaretoken':csrf, 'remember':remember}
                    // ajax 发送请求到服务器,存在返回 res为1 否则为0
                    $.post('/user/login_check/', temp, function (data) {
                        if(data.res == 0)
                        {
                            // 用户名不存在, 默认隐藏的元素展示出来先试用show()
                            $('.user_error').show().text('用户或密码错误!')
                        }
                        else
                        {
                            // 登录成功跳转页面
                            // location.href = '/'
                            // 根据登录前浏览记录跳转
                            location.href = data.next
                        }
    
                    })
                })
    
            })


    接口设计

    login视图函数接口:

    接口名称

    login

    接口功能

    显示登录页面

    接口参数

    request

    url

    /user/login/

    访问方式

    任意

    返回值

    返回HttpResponse

    # /user/login/
    def login(request):
        # 实现记住用户名就能真正显示用户名的后台逻辑
        # 获取cookie   看user是否在其中
        if 'username' in request.COOKIES:
            username = request.COOKIES['username']
        else:
            username = ''
        return render(request, 'df_user/login.html', {'username': username})

    login_check视图函数接口:

    接口名称

    login_check

    接口功能

    进行用户登录,校验用户名和密码。

    接口参数

    request

    url

    /user/login_check /

    访问方式

    POST

    返回值

    返回json:

    登录成功:

      {'res':1}

    登录失败:

      {'res':0}

    # /user/login_check/
    def login_check(request):
        # 接收用户名和密码
        username = request.POST.get('username')
        password = request.POST.get('password')
        # 查找用户名和密码是否存, 使用命名参数容错能力更强
        passport = Passport.objects.get_one_passport(username=username, password=password)
        if passport:
            # 判断登录之前的地址是否需要记录, 只有登录成功才会有session记录,之外的session被flush了,所有必须下载登录成功的判断里
            if request.session.has_key('pre_url_path'):
                next = request.session['pre_url_path']
            else:
                # 首页地址
                next = '/'
            # 用户名密码正确
            jres = JsonResponse({'res': 1, 'next': next})
            # 获取是否需要记住用户名  返回结果为字符串类型的 true / false
            remember = request.POST.get('remember')
            if remember == 'true':
                jres.set_cookie('username', username, max_age=14 * 24 * 3600)
            # 记录登录状态
            request.session['islogin'] = True
            request.session['username'] = username
            # 登录账户的id
            request.session['passport_id'] = passport.id
            return jres
        else:
            return JsonResponse({'res': 0})
    View Code
    LESS IS MORE !
  • 相关阅读:
    板邓:php获取数组元素个数
    板邓:PHP解决Using $this when not in object context in【转】
    板邓:MYSQL distinct关键字查询重复值只显示一条记录
    板邓: php 过滤文章的html标签方法
    板邓:PHP使用mb_strimwidth截取中文字符串方法大全
    板邓:php str_replace单双引号的替换问题
    板邓:PHP下利用PHPMailer配合QQ邮箱下的域名邮箱发送邮件(转)
    板邓:wordpress自定义伪静态 WP_Rewrite
    板邓:wordpress获取当前页面的id、别名
    获取文件夹名
  • 原文地址:https://www.cnblogs.com/maxiaohei/p/7789290.html
Copyright © 2020-2023  润新知