Django中实现随机验证码 

# 生成验证码
from PIL import Image,ImageDraw,ImageFont
from io import BytesIO
from .myutil import get_random_color

def get_confirm_code(req):

　　# 实例化画布
    img_size = (150,70)  #画布大小
    img_color = get_random_color()  #画布颜色
    img = Image.new('RGB',img_size,img_color)  #新建画布传入画布模式，大小，颜色

    # 实例化画笔
    draw = ImageDraw.Draw(img)  #确认画笔在哪块画布上画# 实例化一个字体
    font_path = os.path.join(settings.STATICFILES_DIRS[0],'fonts/ADOBEARABIC-BOLD.OTF')  #确认字体路径
    font_size = 30  #确认字体大小
    font = ImageFont.truetype(font_path,font_size)  #将字体传入到画布上


　　　# 在画布上生成四个随机字母
    source = 'qwertyuiopasdfghjklzxcvbnm1234567890QWERTYUIOPASDFGHJKLZXCVBNM'
    res = ''
    for i in range(4):
        code_color = get_random_color()
        index = random.randint(0,len(source))
        my_str = source[index]
        res += my_str
        draw.text((20+30*i,20),my_str,fill=code_color,font=font)  # 将字母画在画布上

　　# 在画布上随机生成200个颜色位置不确定的点
    for i in range(200):  
        x = random.randint(0,149)
        y = random.randint(0,69)
        draw.point((x,y),fill=get_random_color())

　　# 将生成的画布以二进制数据保存到内存中，并指定格式
    buf = BytesIO()  
    img.save(buf,'png')

    del draw  #删除保存后的画布

    # 保存到session，为了下一步可以取出作比较
    req.session['verify_code'] = res
    return HttpResponse(buf.getvalue(),content_type='image/png')  #以图片形式返回保存在内存中的值
get_confirm_code用到的工具类函数如下：
import randomdef get_random_color():
    r = random.randint(0,256)
    g = random.randint(0,256)
    b = random.randint(0,256)
    return (r,g,b)

包含验证码的验证页面

def login(req):
    if req.method == 'GET':
        return render(req,'login.html')
    else:
        code = req.POST.get('code')
        server_code = req.session.get('verify_code')
        if code and len(code)>0 and code.lower() == server_code.lower():
            return HttpResponse('ok')
        else:
            return HttpResponse('no ok')

　　前端页面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
    <script>
        $(function () {
            $('#myimg').click(function () {
                $(this).attr('src',"/app/get_confirm_code/"+Math.random())
            })
        })
    </script>
</head>
<body>
<form action="/app/login/" method="post">
    <img src="/app/get_confirm_code/" alt="" id="myimg"><br>
    <input type="text" name="code" placeholder="请输入验证码"><br>
    <input type="submit" value="验证">
</form>

</body>
</html>

　　

 
posted @ 2018-10-29 17:51  WuSir_ZJ  阅读(391)  评论(0)  编辑  收藏  举报