Django验证码【附源码】

Django验证码【附源码】

 

一、安装依赖

CentOS

第一步：

1	yum install python - devel

第二步：

yum install freetype-devel libjpeg-devel libpng-devel

1 2	sudo yum install libtiff - devel libjpeg - devel libzip - devel freetype - devel \      lcms2 - devel libwebp - devel tcl - devel tk - devel

第三步：RPM包安装PIL

1 2 3

下载安装：ftp: / / rpmfind.net / linux / atrpms / f20 - x86_64 / atrpms / stable / PIL - 1.1 . 7 - 10.1 .fc20.x86_64.rpm   更多版本：http: / / rpmfind.net / linux / rpm2html / search.php?query = PIL&submit = Search + ...&system = &arch =

Windows

第一步：

1 2 3 4 5 6 7 8

下载安装pip a. 下载地址：https://pypi.org/project/pip/#files b. 解压，进入目录 c. 安装，Python setup.py install   注：安装过程中可能依赖setuptools，安装过程如下： 下载文件：https: / / bootstrap.pypa.io / ez_setup.py 执行文件：Python ez_setup.py

第二步：

1	pip install Pillow

　　

更多安装文档：http://pillow.readthedocs.org/en/latest/installation.html

二、下载源码执行

第一步：

　　源码下载：猛击这里

第二步：

1 2	a. 解压 b. 运行：Python manage.py runserver  127.0 . 0.1 : 8000

第三步：

　　浏览器访问：http://127.0.0.1:8000/login/

三、原理

1、当用户访问 http://127.0.0.1:8000/login/ 时，Python自动生成一张图片输入到页面（即：验证码），并将图片上的文字内容保存在 Session中（即：request.session["CheckCode"] = '验证码的文字内容'）。

2、用户输入用户名密码，点击登陆时：

• 首先，检查用户输入的 验证码 是否和Session中保存的验证码相同
• 然后，检查用户输入的 用户名 和 密码是否正确

使用checkcode示例：

          1、生成验证码图片 <img src='/check_code/'/> session['CheckCode'] = code
          2、用眼看图片，输入图片上的内容
          3、用户输入的值和session['CheckCode']进行比较
          4、用户名和密码的验证

  1 views.py
  2 
  3 import io
  4 import json
  5 from django.shortcuts import HttpResponse, redirect, render
  6 from web.forms.account import SendMsgForm, RegisterForm, LoginForm
  7 from web import models
  8 from backend.utils import check_code as CheckCode
  9 from backend.utils.response import BaseResponse
 10 def check_code(request):
 11     """
 12     获取验证码
 13     :param request:
 14     :return:
 15     """
 16     stream = io.BytesIO()
 17     # 创建随机字符 code
 18     # 创建一张图片格式的字符串，将随机字符串写到图片上
 19     img, code = CheckCode.create_validate_code()
 20     img.save(stream, "PNG")
 21     # 将字符串形式的验证码放在Session中
 22     request.session["CheckCode"] = code
 23     return HttpResponse(stream.getvalue())
 24 def login(request):
 25     """
 26     用户登陆
 27     :param request:
 28     :return:
 29     """
 30     rep = BaseResponse()
 31     form = LoginForm(request.POST)
 32     if form.is_valid():
 33         _value_dict = form.clean()
 34         if _value_dict['code'].lower() != request.session["CheckCode"].lower():
 35             rep.message = {'code': [{'message': '验证码错误'}]}
 36             return HttpResponse(json.dumps(rep.__dict__))
 37         # 验证码正确
 38         from django.db.models import Q
 39 
 40         con = Q()
 41         q1 = Q()
 42         q1.connector = 'AND'
 43         q1.children.append(('email', _value_dict['user']))
 44         q1.children.append(('password', _value_dict['pwd']))
 45 
 46         q2 = Q()
 47         q2.connector = 'AND'
 48         q2.children.append(('username', _value_dict['user']))
 49         q2.children.append(('password', _value_dict['pwd']))
 50 
 51         con.add(q1, 'OR')
 52         con.add(q2, 'OR')
 53 
 54         obj = models.UserInfo.objects.filter(con).first()
 55         if not obj:
 56             rep.message = {'user': [{'message': '用户名邮箱或密码错误'}]}
 57             return HttpResponse(json.dumps(rep.__dict__))
 58 
 59         request.session['is_login'] = True
 60         request.session['user_info'] = {'nid': obj.nid, 'email': obj.email, 'username': obj.username}
 61         rep.status = True
 62     else:
 63         error_msg = form.errors.as_json()
 64         rep.message = json.loads(error_msg)
 65 
 66     return HttpResponse(json.dumps(rep.__dict__))
 67 
 68 
 69 
 70 html
 71 
 72 
 73 <div id="model_login" class="login left">
 74             <div class="header">登陆</div>
 75             <div class="content">
 76                 <div style="padding: 0 70px">
 77                     <div class="tips">
 78                         <span>用户名登陆</span>
 79                         <span style="padding: 0 5px;">|</span>
 80                         <span>邮箱登陆</span>
 81                     </div>
 82                     <div id="login_error_summary" class="error-msg">
 83 
 84                     </div>
 85                     <div class="inp">
 86                         <input name="user" type="text" placeholder="请输入用户名或邮箱" />
 87                     </div>
 88                     <div class="inp">
 89                         <input name="pwd" type="password" placeholder="请输入密码" />
 90                     </div>
 91                     <div class="inp clearfix">
 92                         <input name="code" class="check-code" type="text" placeholder="请输入验证码" />
 93                         <span>
 94                             <img class="check-img" src="/check_code/" alt="验证码" οnclick="ChangeCode(this);">
 95                         </span>
 96 
 97                     </div>
 98                     <div class="extra">
 99                         <input type="checkbox" name="autoLogin" checked="checked" /> <span>一个月内自动登录</span>
100                         <a class="right" href="javascript:void(0);">忘记密码？</a>
101                     </div>
102                     <div class="inp">
103                         <div class="submit" οnclick="SubmitLogin(this);">
104                             <span>登陆</span>
105                             <span class="hide">
106                                 <img src="/statics/images/loader.gif" style="height: 16px;width: 16px">
107                                 <span>正在登陆</span>
108                             </span>
109                         </div>
110                     </div>
111                 </div>
112                 <script>
113                     function ChangeCode(ths) {
114                         ths.src += '?';
115                     }
116                 </script>
117             </div>
118         </div>
119 
120         /*
121         点击注册按钮
122         */
123         function SubmitRegister(ths){
124             $('#register_error_summary').empty();
125             $('#model_register .inp .error').remove();
126 
127             $(ths).children(':eq(0)').addClass('hide');
128             $(ths).addClass('not-allow').children(':eq(1)').removeClass('hide');
129 
130             var post_dict = {};
131             $('#model_register input').each(function(){
132                 post_dict[$(this).attr("name")] = $(this).val();
133             });
134 
135             $.ajax({
136                 url: '/register/',
137                 type: 'POST',
138                 data: post_dict,
139                 dataType: 'json',
140                 success: function(arg){
141                     if(arg.status){
142                         window.location.href = '/index';
143                     }else{
144                         $.each(arg.message, function(k,v){
145                             //<span class="error">s</span>
146                             var tag = document.createElement('span');
147                             tag.className = 'error';
148                             tag.innerText = v[0]['message'];
149                             $('#model_register input[name="'+ k +'"]').after(tag);
150                         })
151                     }
152                 }
153             });
154 
155             $(ths).removeClass('not-allow').children(':eq(1)').addClass('hide');
156             $(ths).children(':eq(0)').removeClass('hide');
157         }

View Code

转载于:https://www.cnblogs.com/lbzbky/articles/10994425.html