标签：one ever jquer 字符 draw rip primary ima with
1.前端代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <script src="/static/jquery-3.3.1.js"></script> <link rel="stylesheet" href="/static/bootstrap-3.3.7-dist/css/bootstrap.css"> <title>Title</title> </head> <body> <div class="container-fluid"> <div class="row"> <div class="col-md-6 col-md-offset-3"> <form> <div class="form-group"> <label for="name">用户名</label> <input type="text" name="name" id="name" class="form-control"> </div> <div class="form-group"> <label for="password">密码</label> <input type="password" name="password" id="password" class="form-control"> </div> <div class="form-group"> <label for="valid_code">验证码</label> <div class="row"> <div class="col-md-6"> <input type="text" id="valid_code" class="form-control"> </div> {#写一个获取验证码的路由#} <img src="/get_valid_code/" alt="" height="34" width="200" id="img_code"> </div> </div> </form> <button class="btn btn-primary">提交</button> </div> </div> </div> </body> <script> $(‘#img_code‘).click(function () { $(‘#img_code‘)[0].src+=‘?‘; }) </script> </html>
2.后端代码
from django.shortcuts import render, HttpResponse, reverse, redirect # Create your views here. def login(request): if request.method == ‘GET‘: return render(request, ‘login.html‘) import random def get_random_color(): return (random.randint(0, 255), random.randint(0, 255), random.randint(0, 255)) from io import BytesIO from PIL import Image, ImageDraw, ImageFont def get_valid_code(request): # 第一种方式 # with open(‘static/img/315557.jpg‘, ‘rb‘) as f: # # 图片二进制 # data = f.read() # return HttpResponse(data) # 第二种方式，随机生成一张图片 # 第一个参数是模式：RGB，第二个参数是图片大小，第三个参数是图片颜色 # img = Image.new(‘RGB‘, (200, 34), color=get_random_color()) # # with open(‘valid_code.png‘, ‘wb‘) as f: # # Image已经把保存方式封装好了，直接这么用就行了，第一个参数是空文件，第二个参数图片格式 # img.save(f, ‘png‘) # with open(‘valid_code.png‘, ‘rb‘) as f: # data = f.read() # return HttpResponse(data) # 第三种方式 # 在内存中生成一个空文件 # img=Image.new(‘RGB‘,(200,34),color=get_random_color()) # f=BytesIO() # #把图片保存到f中，放到内存中，存取比较快，而且有自动清理 # img.save(f,‘png‘) # data=f.getvalue() # return HttpResponse(data) # # 第四种方式，在图片上写文字 # img = Image.new(‘RGB‘, (200, 34), get_random_color()) # img_draw = ImageDraw.Draw(img) # # img_draw第一个参数，xy的坐标(第一个是x坐标，正数则往右拉。第二个是y坐标，整数则往下拉),第二个参数：要写的文字，第三个参数：写文字的颜色,第四个参数:字体 # # 不同的字体是不同的ttf文件 # # 生成一个字体对象，第一个参数是字体文件的路径，第二个参数是字体的大小 # font = ImageFont.truetype(‘static/font/ss.TTF‘, size=22) # img_draw.text((0, 0), ‘python‘, get_random_color(), font=font) # f=BytesIO() # img.save(f,‘png‘) # data=f.getvalue() # return HttpResponse(data) #第五种方式，随机生成验证码 # 弄一个循环，循环5次，每次随机写一个（数字，大写，小写字母） font=ImageFont.truetype(‘static/font/ss.TTF‘,size=22) img=Image.new(‘RGB‘,(200,34),get_random_color()) img_draw=ImageDraw.Draw(img) for i in range(5): char_num = random.randint(0, 9) char_lower = chr(random.randint(97, 122)) char_upper = chr(random.randint(65, 90)) char_str = str(random.choice([char_num, char_upper, char_lower])) #每次循环，随机写出的字符都错开一些 img_draw.text((i*25+20,0),char_str,get_random_color(),font=font) f=BytesIO() img.save(f,‘png‘) data=f.getvalue() return HttpResponse(data)
标签：one ever jquer 字符 draw rip primary ima with
原文地址：https://www.cnblogs.com/xufengnian/p/10059772.html
