Flask - 图形验证码

自己绘制图形验证码

• 安装pillow : pip install pillow

import random

from PIL import Image, ImageFont, ImageDraw, ImageFilter


def get_random_color():
    return (random.randint(0, 255), random.randint(0, 255), random.randint(0, 255))


def generate_image(length):
    s = 'qwerQWERTYUIOtyuiopas123456dfghjklPASDFGHJKLZXCVBNMxcvbnm7890'
    # 指定图片的大小
    size = (130, 50)
    # 创建一个画布 , 需要三个参数, def new(mode, size, color=0):
    # model:使用的模式, size:图片大小, color:图片颜色
    im = Image.new('RGB', size, color=get_random_color())
    # 创建字体
    font = ImageFont.truetype('simkai.ttf', size=35)
    # 创建ImageDraw对象
    draw = ImageDraw.Draw(im)
    # 绘制验证码
    # 接收验证码
    code = ''
    for i in range(length):
        # 从字符串s中随机取出一个字符
        c = random.choice(s)
        code += c
        # 绘制
        # draw.text((x坐标,y坐标), text=绘制什么, file=字体颜色, font=字体)
        draw.text((5 + random.randint(4, 7) + 25 * i, 1),
                  text=c,
                  fill=get_random_color(),
                  font=font)
    im.show()


if __name__ == '__main__':
    generate_image(4)

绘制干扰线

# 绘制干扰线
for i in range(6):
    x1 = random.randint(0, 130)
    y1 = random.randint(0, 50/2)

    x2 = random.randint(0, 130)
    y2 = random.randint(0, 50 / 2)
    draw.line(((x1, y1), (x2, y2)))

im.show()

展示验证码

app.py

# 验证码
@app.route('/image', methods=['GET', 'POST'])
def get_image():
    # 创建验证码对象
    im, code = generate_image(4)
    # 把验证码转换为二进制
    buffer = BytesIO()
    # 把验证码保存在创建的二进制容器里面
    im.save(buffer, "JPEG")
    # 获取图片
    buf_bytes = buffer.getvalue()
    response = make_response(buf_bytes)
    # 读取图片需要指定Content-Type
    response.headers['Content-Type'] = 'image/jpg'
    return response

user.html

{# 验证码 #}
<p>{{ uform.recaptcha.label }}:{{ uform.recaptcha }} <img src="{{ url_for('get_image') }}"></p>
<input type="submit" value="Go">

javascript实现点击切换验证码

<script>
    $('#img').click(function () {
        $(this).attr('src', "{{ url_for('get_image') }}?ran="+Math.random())
    })
</script>

• 原理 : 修改src的值, 点击一次请求一下/image路由.
• 服务器会判断这一次的请求和上一次的请求是不是一样的. 如果是一样的就用上次请求的结果
• 在请求后面添加一个随机数, 就会避免了

验证验证码是否正确

思路

• 把验证码存到session里面

@app.route('/image', methods=['GET', 'POST'])
def get_image():
    # 创建验证码对象
    im, code = generate_image(4)
    # 把验证码存到session里面
    session['valid'] = code
   ....

• 在form类里面添加验证

# 验证码验证
def validate_recaptcha(self, data):
    input_code = data.data
    valid = session.get('valid')
    if input_code.lower() != valid.lower():
        raise ValidationError('验证码错误')