验证码生成案例

先创建static文件夹与项目工程App为兄弟关系,

在static里面创建 uploadefiles文件夹(随意起名)

再在uploadefiles里面创建一个文件夹 放一种书写字体,

settings配置:

MEDIA_ROOT=os.path.join(BASE_DIR,r'static/uploadefiles')
# 这里的uploadefiles是与之前起名的文件夹相对应

urls配置:

url(r'^uerslogin/', views.uerslogin),
    url(r'^douserlogin/', views.douserlogin),
    url(r'^getverifycode/', views.getverifycode),

views视图层配置:

def uerslogin(request):
​
    return render(request,"userlogin.html")
​
​
def make_color(): # 创建颜色（R,G,B）
    red = random.randrange(255)
    green = random.randrange(255)
    blue = random.randrange(255)
    return (red, green, blue)
​
​
def make_point(): #创建点（weight,height）
    weight = random.randrange(100)
    height = random.randrange(50)
    return (weight, height)
​
​
def getverifycode(request):
    # 创建画布
    size = (100, 50)
    color = make_color()
    image = Image.new("RGB", size, color)
​
    # 创建画笔
    imagedraw = ImageDraw.Draw(image, "RGB")
​
    # 记载字体
    imagefont = ImageFont.truetype("/home/xxx/PycharmProjects/day07/static/fonts/ADOBEARABIC-BOLD.OTF", 30)
​
    # 做一个源文件
    source = "qwertyuiopasdfghjklzxcvbnmQWERTYUIOPASDFGHJKLZXCVBNM0123456789"
​
    # 随机从source中取4个数据出来添加到verify
    verify = ''
    for i in range(4):
        verify += source[random.randrange(len(source))]
​
    request.session["verify_code"] = verify
​
    # 每一次循环,都去玩过图片上写一个verify中的一个元素
    for item in range(4):
        imagedraw.text((20 + item * 20, 10), verify[item], fill=make_color(), font=imagefont)
​
    for item in range(500):
        imagedraw.point(make_point(), fill=make_color())
​
    import io
    # 创造一个字节流的
    buf = io.BytesIO()
    # 将图片保存在IO流的缓冲区
    image.save(buf, 'png')
​
    # 通过响应返回IO流中的值
    return HttpResponse(buf.getvalue(), 'image/png')
​
def douserlogin(request):
    # 这个是表单提交上来的验证码
    verify = request.POST.get('username')
    # 这个是session给咱们的验证码
    verify_code = request.session.get("verify_code")
​
    if verify == verify_code:
        return HttpResponse("验证成功")
    return HttpResponse("验证码错误")

templates模板层配置渲染:

<form action="/App/douserlogin/" method="post">
​
    {% csrf_token %}
    <span>验证码:</span><input type="text" name="username" placeholder="请输入验证码">
    <br>
    <img id="verify_code"  src="/App/getverifycode/" alt="验证码" width="200px" height="100px">
​
    <br>
​
    <button>登录</button>
​
</form>