django的验证码

前端的配置

 <div class="col-md-6">
        <img class="valid_img" src="/get_valid_img/" alt="" width="200" height="40">
  </div>

<script>
  $(".valid_img").click(function () {
{#？相当于刷新了 实现了一点击就换验证码的效果 ？就会重新刷新 就像重新发了一次请求 $(this)当前的jquery的对象 [0]是转换为dom对象 给src重新赋值 加个问号 #}
        $(this)[0].src+="?"
    });
</script>

后端views.py的配置

def get_valid_img(request):
  ####前四步没用
  #第一步
    ##上传一个图片
    # with open('11.png','rb') as f:
    #     data=f.read()
    #return  HttpResponse(data)

    #第二步
    # #使用Django的绘图模块 PIL来绘图
    # from PIL import Image
    # #绘制图片 大小 颜色
    # img = Image.new(mode='RGB', size=(120, 30), color=(155, 252, 125))
    # #准备图片文件 用来放绘制图片的信息
    # f = open('a.png', 'wb')
    # img.save(f, "png")
    # #此时a.png是一张绘制好的图片了
    # with open('a.png','rb') as f:
    #      data=f.read()
    #return  HttpResponse(data)

    #第三步
    #使用BytesIO 也不知道是什么
    # from io import BytesIO
    # f=BytesIO()
    #
    # from PIL import Image
    # img = Image.new(mode='RGB', size=(120, 30), color=(0, 255, 0))
    # img.save(f,"png")
    # data=f.getvalue()
    # return HttpResponse(data)

    #第四步
    # from io import BytesIO
    # f = BytesIO()
    # from PIL import Image, ImageDraw, ImageFont
    # # 画字
    # img = Image.new(mode='RGB', size=(120, 30), color=(0, 255, 0))
    # draw = ImageDraw.Draw(img, mode='RGB')
    # font=ImageFont.truetype("cnblog/static/dist/fonts/kumo.ttf",28)
    # draw.text([15,2],'y',"red",font=font)
    #
    # img.save(f,"png")
    # data=f.getvalue()
    # return  HttpResponse(data)

    #第五步
    #绘图 圈圈 点点 线线  画字
    from io import BytesIO
    f = BytesIO()
    from PIL import Image, ImageDraw, ImageFont
    import random
    img = Image.new(mode='RGB', size=(120, 30),
                    color=(random.randint(0, 255), random.randint(0, 255), random.randint(0, 255)))
    draw = ImageDraw.Draw(img, mode='RGB')

    char_list = []
    # 画字
    for i in range(5):
        char = random.choice([chr(random.randint(65, 90)), str(random.randint(1, 9)), chr(random.randint(97, 122)), ])

        font = ImageFont.truetype("cnblog/static/dist/fonts/kumo.ttf", 28)
        draw.text([i * 24, 0], char, (random.randint(0, 255), random.randint(0, 255), random.randint(0, 255)),

                  font=font)

        char_list.append(char)

    # =========================
    width = 120
    height = 30

    def rndColor():
        """
        生成随机颜色
        :return:
        """
        return (random.randint(0, 255), random.randint(10, 255), random.randint(64, 255))

    # # 写干扰点
    # for i in range(40):
    #     draw.point([random.randint(0, width), random.randint(0, height)], fill=rndColor())
    #
    # # 写干扰圆圈
    # for i in range(40):
    #     draw.point([random.randint(0, width), random.randint(0, height)], fill=rndColor())
    #     x = random.randint(0, width)
    #     y = random.randint(0, height)
    #     draw.arc((x, y, x + 4, y + 4), 0, 90, fill=rndColor())
    #
    # # 画干扰线
    # for i in range(5):
    #     x1 = random.randint(0, width)
    #     y1 = random.randint(0, height)
    #     x2 = random.randint(0, width)
    #     y2 = random.randint(0, height)
    #
    #     draw.line((x1, y1, x2, y2), fill=rndColor())

    img.save(f, "png")
    data = f.getvalue()

    s = ''.join(char_list)

    request.session["valid_code"] = s #设置session 是为了登录的时候 拿到cookie 也就是验证码

    ''' 
    Dajngo:
    set_cookie("sessionId","asdsa234asd3sad")
    in session表
    sessionkey           sessiondata
    asdsa234asd3sad      {"valid_code":"qqqqq"}
    '''
    return HttpResponse(data)

views.py里登录函数的配置

def login(request):
    if request.method=='POST':
        valid=request.POST.get('valid') #拿到验证码
 return render(request,'login.html')