Django实现图片验证码

1.验证码的作用

• 防恶意破解密码：防止，使用程序或机器人恶意去试密码．为了提高用户的体验，用户输入错误以后，才会要求输入验证码．
• 有效防止注册，以防，使用程序或机器人去无限制注册账号．
• 防止一些投票网站的恶意刷票

验证码原理

2.任务逻辑

前端功能

• 点击按钮Ajax调用发送验证码功能
• 输完验证码后Ajax调用验证功能

后端功能

• 发送验证码功能
  • 生成指定长度验证码
  • 使用Redis代替session缓存, 存储数据! 设置过期时间(1.60秒内无法重新发送短信，2. 设置短信验证码的有效时间)
• 验证码检查

以下是用django2.2版本实现的，默认你已经创建好项目，验证码为下图所示样子：

1. 首先在项目的应用下插入一个生成验证码的文件captcha.py。这是生成验证码的一个文件已经封装好啦，直接调用就可以了。代码如下:
   “”"
   图片验证码
   “”"
   import os
   import random

   from io import BytesIOfrom PIL import Image
   from PIL import ImageFilter
   from PIL.ImageDraw import Draw
   from PIL.ImageFont import truetypeclass Bezier:"""贝塞尔曲线"""def __init__(self):self.tsequence = tuple([t / 20.0 for t in range(21)])self.beziers = {}def make_bezier(self, n):"""绘制贝塞尔曲线"""try:return self.beziers[n]except KeyError:combinations = pascal_row(n - 1)result = []for t in self.tsequence:tpowers = (t ** i for i in range(n))upowers = ((1 - t) ** i for i in range(n - 1, -1, -1))coefs = [c * a * b for c, a, b in zip(combinations,tpowers, upowers)]result.append(coefs)self.beziers[n] = resultreturn resultclass Captcha:"""验证码"""def __init__(self, width, height, fonts=None, color=None):self._image = Noneself._fonts = fonts if fonts else \[os.path.join(os.path.dirname(__file__), 'fonts', font)for font in ['Arial.ttf', 'Georgia.ttf', 'Action.ttf']]self._color = color if color else random_color(0, 200, random.randint(220, 255))self._width, self._height = width, height@classmethoddef instance(cls, width=200, height=75):prop_name = f'_instance_{width}_{height}'if not hasattr(cls, prop_name):setattr(cls, prop_name, cls(width, height))return getattr(cls, prop_name)def _background(self):"""绘制背景"""Draw(self._image).rectangle([(0, 0), self._image.size],fill=random_color(230, 255))def _smooth(self):"""平滑图像"""return self._image.filter(ImageFilter.SMOOTH)def _curve(self, width=4, number=6, color=None):"""绘制曲线"""dx, height = self._image.sizedx /= numberpath = [(dx * i, random.randint(0, height))for i in range(1, number)]bcoefs = Bezier().make_bezier(number - 1)points = []for coefs in bcoefs:points.append(tuple(sum([coef * p for coef, p in zip(coefs, ps)])for ps in zip(*path)))Draw(self._image).line(points, fill=color if color else self._color, width=width)def _noise(self, number=50, level=2, color=None):"""绘制扰码"""width, height = self._image.sizedx, dy = width / 10, height / 10width, height = width - dx, height - dydraw = Draw(self._image)for i in range(number):x = int(random.uniform(dx, width))y = int(random.uniform(dy, height))draw.line(((x, y), (x + level, y)),fill=color if color else self._color, width=level)def _text(self, captcha_text, fonts, font_sizes=None, drawings=None, squeeze_factor=0.75, color=None):"""绘制文本"""color = color if color else self._colorfonts = tuple([truetype(name, size)for name in fontsfor size in font_sizes or (65, 70, 75)])draw = Draw(self._image)char_images = []for c in captcha_text:font = random.choice(fonts)c_width, c_height = draw.textsize(c, font=font)char_image = Image.new('RGB', (c_width, c_height), (0, 0, 0))char_draw = Draw(char_image)char_draw.text((0, 0), c, font=font, fill=color)char_image = char_image.crop(char_image.getbbox())for drawing in drawings:d = getattr(self, drawing)char_image = d(char_image)char_images.append(char_image)width, height = self._image.sizeoffset = int((width - sum(int(i.size[0] * squeeze_factor)for i in char_images[:-1]) -char_images[-1].size[0]) / 2)for char_image in char_images:c_width, c_height = char_image.sizemask = char_image.convert('L').point(lambda i: i * 1.97)self._image.paste(char_image,(offset, int((height - c_height) / 2)),mask)offset += int(c_width * squeeze_factor)@staticmethoddef _warp(image, dx_factor=0.3, dy_factor=0.3):"""图像扭曲"""width, height = image.sizedx = width * dx_factordy = height * dy_factorx1 = int(random.uniform(-dx, dx))y1 = int(random.uniform(-dy, dy))x2 = int(random.uniform(-dx, dx))y2 = int(random.uniform(-dy, dy))warp_image = Image.new('RGB',(width + abs(x1) + abs(x2), height + abs(y1) + abs(y2)))warp_image.paste(image, (abs(x1), abs(y1)))width2, height2 = warp_image.sizereturn warp_image.transform((width, height),Image.QUAD,(x1, y1, -x1, height2 - y2, width2 + x2, height2 + y2, width2 - x2, -y1))@staticmethoddef _offset(image, dx_factor=0.1, dy_factor=0.2):"""图像偏移"""width, height = image.sizedx = int(random.random() * width * dx_factor)dy = int(random.random() * height * dy_factor)offset_image = Image.new('RGB', (width + dx, height + dy))offset_image.paste(image, (dx, dy))return offset_image@staticmethoddef _rotate(image, angle=25):"""图像旋转"""return image.rotate(random.uniform(-angle, angle),Image.BILINEAR, expand=1)def generate(self, captcha_text='', fmt='PNG'):"""生成验证码(文字和图片)"""self._image = Image.new('RGB', (self._width, self._height), (255, 255, 255))self._background()self._text(captcha_text, self._fonts,drawings=['_warp', '_rotate', '_offset'])self._curve()self._noise()self._smooth()image_bytes = BytesIO()self._image.save(image_bytes, format=fmt)return image_bytes.getvalue()def pascal_row(n=0):"""生成毕达哥拉斯三角形（杨辉三角）"""result = [1]x, numerator = 1, nfor denominator in range(1, n // 2 + 1):x *= numeratorx /= denominatorresult.append(x)numerator -= 1if n & 1 == 0:result.extend(reversed(result[:-1]))else:result.extend(reversed(result))return resultdef random_color(start=0, end=255, opacity=255):"""获得随机颜色"""red = random.randint(start, end)green = random.randint(start, end)blue = random.randint(start, end)if opacity is None:return red, green, bluereturn red, green, blue, opacity
   

   并导入支持的字体文件：

2. 在应用下新建一个util.py的文件用来保存一些常用的工具函数,
   def gen_verify_code(length = 4):
   ‘’‘生成指定长度验证码’’’

       all_chars = '0123456789abcdefghijklmnopqrstuvwxyz'return ''.join(random.choices(all_chars,k = length))
   

3. 在试图函数view.py中定义一个函数生成验证码：
   def captcha(request):
   ‘’‘生成验证码’’’
   code_text = gen_verify_code() # 随机生成4位数字
   request.session[‘code’] = code_text # 在服务器中以session形式保存
   image_data = Captcha.instance().generate(code_text)
   return HttpResponse(image_data, content_type=‘image/png’) # 返回图片对象

4. 前端代码为
   

   
   验证码：
   
   #验证码的试图函数
   

5.设置点击随机切换的效果(使用jQuery方法,添加点击事件)

<script>$(()=>{$('#code').on('click',(evt) =>{$(evt.target).attr('src','/polls/captcha/?' + Math.random())})})</script>

6.登陆时进行验证的代码为：

# 获取客户端输入的验证码
code_from_user = request.POST.get('captcha', '0')
# 获取服务器session存储的验证码
code_from_serv = request.session.get('code', '1')
# 忽略大小写进行判断是否一致
if code_from_serv.lower() == code_from_user.lower():username = request.POST.get('username')password = request.POST.get('password')