1:views视图代码

# 登录验证

def login(request):

    # 使用ajax请求可以使用判断

    # if request.is_ajax():

    if request.method == 'POST':

        user = request.POST.get('user')

        pwd = request.POST.get('pwd')

        code = request.POST.get('code')

        ret = {'status': False, 'msg': None}

        print(code)

        print(user, pwd)

        print(request.session.get('valid_code'))

        if request.session.get('valid_code').upper() == code.upper():

            user = auth.authenticate(username=user, password=pwd)

            if user:

                auth.login(request, user)

                ret['status'] = True

                ret['msg'] = '/index/'

            else:

                ret['msg'] = '用户名或密码错误'

        else:

            ret['msg'] = '验证码错误'

        return JsonResponse(ret)

    return render(request, 'login.html')

2:views视图中产生随机验证码

# 获取验证码

def get_valid_img(request):

    # 方法一

    # with open('hmbb.png','rb')as f:

    #     data = f.read()

    # 方法二

    import PIL

    from PIL import Image, ImageDraw, ImageFont

    import random

    # 获取随机颜色的函数

    def get_random_color():

        return random.randint(0, 255), random.randint(0, 255), random.randint(0, 255)

    # 生成一个图片对象

    image = Image.new('RGB', (250, 40), get_random_color())

    # 将生成的图片保存在磁盘上

    # f = open('valid_code.png','wb')

    # image.save(f,'png')

    #

    # with open('valid_code.png','rb')as f:

    #     data = f.read()

    # 生成一个图片画笔对象

    draw_obj = ImageDraw.Draw(image)

    '''

    draw.text()   向image中写内容

    draw.line()   向image中画线

    draw.point()   向image中画点

    '''

    # 加载字体文件， 得到一个字体对象

    font_obj = ImageFont.truetype('static/font/kumo.ttf', 28)

    # 开始生成随机字符串并且写到图片上

    tmp_list = []

    for i in range(5):

        # 生成大写字母

        u = chr(random.randint(65, 90))

        # 生成小写字母

        l = chr(random.randint(97, 122))

        # 生成数字

        n = str(random.randint(0, 9))

        tmp = random.choice([u, l, n])

        tmp_list.append(tmp)

        draw_obj.text((20 + 40 * i, 0), tmp, fill=get_random_color(), font=font_obj)

    # 加干扰线

    # width = 220  # 图片宽度（防止越界）

    # height = 35

    # for i in range(5):

    #     x1 = random.randint(0, width)

    #     x2 = random.randint(0, width)

    #     y1 = random.randint(0, height)

    #     y2 = random.randint(0, height)

    #     draw_obj.line((x1, y1, x2, y2), fill=get_random_color())

    #

    # # 加干扰点

    # for i in range(40):

    #     draw_obj.point((random.randint(0, width), random.randint(0, height)), fill=get_random_color())

    #     x = random.randint(0, width)

    #     y = random.randint(0, height)

    #     draw_obj.arc((x, y, x+4, y+4), 0, 90, fill=get_random_color())

    code = ''.join(tmp_list)

    # 添加session键值对,产生全局变量获取验证码判断

    request.session['valid_code'] = code

    from io import BytesIO

    f = BytesIO()

    # 将生成的图片数据保存在io对象中

    image.save(f, 'png')

    # 从io对象里面取上一步保存的数据

    data = f.getvalue()

    f.close()

    return HttpResponse(data)

3:HTML中的代码

<!DOCTYPE html>

<html lang="zh-CN">

<head>

    <meta http-equiv="content-Type" charset="UTF-8">

    <meta http-equiv="x-ua-compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>login</title>

    <link rel="stylesheet" href="/static/bootstrap/css/bootstrap.min.css">

    <link rel="stylesheet" href="/static/mystyle.css">

</head>

<body>

<div class="container">

    <div class="row">

        <div class="col-md-6 col-md-offset-3">

            <form action="/login/" class="login-form" method="post">

                {% csrf_token %}

                <div class="form-group">

                    <label for="username">用户名</label>

                    <input type="text" class="form-control" id="username" placeholder="username">

                </div>

                <div class="form-group">

                    <label for="pwd">密码</label>

                    <input type="password" class="form-control" id="pwd" placeholder="password">

                </div>

                <div class="form-group">

                    <label for="pwd">验证码</label>

                    <div class="row">

                        <div class="col-md-6">

                            <input type="text" class="form-control" id="code">

                        </div>

                        <div class="col-md-6">

                            <img width="" height="" id="valid_img" src="/get_valid_img/" alt="">

                        </div>

                    </div>

                </div>

                <div class="form-group">

                    <div class="row">

                         <div class="col-md-3">

                         <button type="button" id="d1" class="btn btn-info">登录</button>

                         </div>

                    <div class="col-md-6">

                        <span class="help-block login-error"></span>

                    </div>

                    </div>

                </div>

            </form>

        </div>

    </div>

</div>

<script src="/static/jquery-3.3.1.js"></script>

<script src="/static/bootstrap/js/bootstrap.min.js"></script>

{#<script src="/static/setupajax.js"></script>#}

4:ajax请求代码

　　1:ajax请求,返回响应并将错误添加页面

　　2:当input框获得焦点,移除错误信息

　　3:点击验证码,会重新请求获得验证码(刷新)

<script>

    $('#d1').on('click', function () {

        $.ajax({

            url: '/login/',

            type: 'post',

            data: {

                user: $('#username').val(),

                pwd: $('#pwd').val(),

                code: $('#code').val(),

                'csrfmiddlewaretoken': $('[name="csrfmiddlewaretoken"]').val()

            },

            success: function (data) {

                if (data.status) {

                    location.href = data.msg

                } else {

                    $(".login-error").text(data.msg)

                }

            }

        })

    });

    // 获得光标事件清空错误

    $("#username,#pwd").focus(function () {

        $('.login-error').text('')

    });

    // 刷新验证码

    $('#valid_img').click(function () {

        $(this)[0].src +='?';

    })

</script>

Django框架登录验证及产生随机验证码的实例的更多相关文章

  1. django框架--登录注册功能（ajax）

    注册 实现一个注册功能 编写 html 内容 input 标签 csrf_token ajax 路由 视图: 提供页面 负责处理业务,返回响应 接收到   post   请求传递的参数 写库 返回   ...

  2. Django学习系列之重写User模型和登录验证

    重写User模型 Django内置的User模型可能不适合某些项目,我们可能要基于内置的添加一些字段 创建users app startapp users 修改settings.py配置文件,覆盖默认 ...

  3. ThinkPHP之登录验证

    验证方面写的不是很完整,正在完善当中 <?php /** * Created by dreamcms. * User: Administrator * Date: 2016/9/5 * Time ...

  4. Django之路 - 实现登录随机验证码

    登录验证码是每个网站登录时的基本标配,网上也有很多相应的文章, 但是从生成验证码到 应用到自己的网站上的全步骤,并没有看到很多, 为了节约大家的时间,我把整体步骤写下来, 即拿即用哈 1. 生成随机验 ...

  5. Django登录(含随机生成图片验证码)注册实例

    登录,生成随机图片验证码 一.登录 - 随机生成图片验证码 1.随机生成验证码 Python随机生成图片验证码,需要使用PIL模块,安装方式如下: pip3 install pillow 1)创建图片 ...

  6. Django之实现登录随机验证码

    登录验证码是每个网站登录时的基本标配,网上也有很多相应的文章, 但是从生成验证码到 应用到自己的网站上的全步骤,并没有看到很多, 为了节约大家的时间,我把整体步骤写下来, 即拿即用哈 1. 生成随机验 ...

  7. python笔记-20 django进阶 （model与form、modelform对比，三种ajax方式的对比，随机验证码，kindeditor）

    一.model深入 1.model的功能 1.1 创建数据库表 1.2 操作数据库表 1.3 数据库的增删改查操作 2.创建数据库表的单表操作 2.1 定义表对象 class xxx(models.M ...

  8. Django框架之验证码生成示例

    一.生成随机颜色的图片 1)前端代码展示 <!DOCTYPE html> <html lang="en"> <head> <meta ch ...

  9. 如何使用Django实现用户登录验证

    最初开始搞用户登录验证的时候感觉没什么难的,不就是增删改查中的查询数据库么,但是还是遇到许多小问题,而且感觉在查询数据库的时候,要把前端的数据一条一条的进行比对,会导致我的代码很丑,而且方式很不智,所 ...

随机推荐

  1. 针对老式浏览器（主要是IE6、7、8）的css3-mediaqueries.js自适应布局

    <meta name="viewport" content="width=device-width, initial-scale=1" /> vie ...

  2. 15分钟构建超低成本数据大屏：DataV + DLA

    第一步:准备低成本存储的业务数据和DLA表 OSS(https://www.aliyun.com/product/oss)是云上低成本数据存储的优选方案 DLA(https://www.aliyun. ...

  3. 正则中使用ASCII码，取值范围

    [^\x00-\xFF]  : 表示匹配Ascii码大于255的那些字符 基于浏览器的工具: https://regexr.com/

  4. C# 基础才是重中之重~对象的生与死

    为何要写 之所以写这篇文章,完全是因为学生们在实际开发中遇到的问题,一个对象占用的内存空间总不被释放,导致系统内存不断攀升,其最主要原因是我们对“对象的生与死”不清楚,或者从来没有认真去考虑过这件事, ...

  5. 基于LSTM对西储大学轴承故障进行分析

    这篇文章是小萌新对西储大学轴承故障进行分析,固定特征为故障直径为0.007,电机转速为1797,12k驱动端故障数据(Drive_End)即DE-time.故障类型y值:滚动体故障,内圈故障,3时,6 ...

  6. Windows 调用OpenProcess失败

    OpenProcess 打开|获得进程句柄 函数原型: HANDLE OpenProcess(DWORD dwDesiredAccess,BOOL bInheritHandle,DWORD dwPro ...

  7. loadrunner11录制为空的解决办法（win7+chrome最新版本）

    参考:https://www.cnblogs.com/zhang-zhi/archive/2018/09/10/9622605.html loadrunner11在win7中,使用chrome浏览器的 ...

  8. JS---案例：拖曳对话框

    案例:拖曳对话框 ps: 实际没有要拖曳登录框的需求,只是演示拖曳的这个效果 1. 获取超链接,注册点击事件,显示登陆框和遮挡层 2. 获取关闭,注册点击事件,隐藏登陆框和遮挡层 3. 按下鼠标,移动 ...

  9. 超线程（Hyper-Threading）

    运行方式 每个单位时间内,一个CPU只能处理一个线程(操作系统:thread),以这样的单位进行,如果想要在一单位时间内处理超过一个线程是不可能的,除非是有两个CPU的实体单元.双核心技术是将两个一样 ...

  10. python 常规字符匹配