在网站开发的登录页面中,经常会需要使用到图形验证码来验证。在Django中,django-simple-captcha库包提供了图形验证码的使用。
django-simple-captcha的安装 pip instsall django-simple-captcha的安装 在settings.py文件中注册captcha INSTALLED_APPS = [ \'captcha\' ] 在settings.py文件中设置图形验证码的样式 #字母验证码 CAPTCHA_IMAGE_SIZE = (80, 45) # 设置 captcha 图片大小 CAPTCHA_LENGTH = 4 # 字符个数 CAPTCHA_TIMEOUT = 1 # 超时(minutes) #加减乘除验证码 CAPTCHA_OUTPUT_FORMAT = \'%(image)s %(text_field)s %(hidden_field)s \' CAPTCHA_NOISE_FUNCTIONS = (\'captcha.helpers.noise_null\', \'captcha.helpers.noise_arcs\', # 线 \'captcha.helpers.noise_dots\', # 点 ) CAPTCHA_CHALLENGE_FUNCT = \'captcha.helpers.random_char_challenge\' CAPTCHA_CHALLENGE_FUNCT = \'captcha.helpers.math_challenge\' CAPTCHA_TIMEOUT = 1 执行数据迁移,在数据表中生成captcha_captchastore表 python manage.py migrate 在urls.py中添加路由 urlpatterns = [ path(\'captcha/\', include(\'captcha.urls\')), # 图片验证码 路由 path(\'refresh_captcha/\', views.refresh_captcha), # 刷新验证码,ajax ] 示例 urls.py文件 from django.urls import path from django.conf.urls import include from App.views import IndexView from App import views urlpatterns = [ path(\'captcha/\', include(\'captcha.urls\')), path(\'refresh_captcha/\',views.refresh_captcha), path(\'\',IndexView.as_view()), ] views.py文件 from django.shortcuts import render from django.views.generic import View from captcha.models import CaptchaStore from captcha.helpers import captcha_image_url from django.http import HttpResponse import json # 创建验证码 def captcha(): hashkey = CaptchaStore.generate_key() #验证码答案 image_url = captcha_image_url(hashkey) #验证码地址 captcha = {\'hashkey\': hashkey, \'image_url\': image_url} return captcha #刷新验证码 def refresh_captcha(request): return HttpResponse(json.dumps(captcha()), content_type=\'application/json\') # 验证验证码 def jarge_captcha(captchaStr, captchaHashkey): if captchaStr and captchaHashkey: try: # 获取根据hashkey获取数据库中的response值 get_captcha = CaptchaStore.objects.get(hashkey=captchaHashkey) if get_captcha.response == captchaStr.lower(): # 如果验证码匹配 return True except: return False else: return False class IndexView(View): def get(self, request): hashkey = CaptchaStore.generate_key() # 验证码答案 image_url = captcha_image_url(hashkey) # 验证码地址 captcha = {\'hashkey\': hashkey, \'image_url\': image_url} return render(request, "login.html", locals()) def post(self,request): capt=request.POST.get("captcha",None) #用户提交的验证码 key=request.POST.get("hashkey",None) #验证码答案 if jarge_captcha(capt,key): return HttpResponse("验证码正确") else: return HttpResponse("验证码错误") login.html文件 {% load static %} <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="{% static \'bower_components/jquery/dist/jquery.min.js\' %}"></script> <script src="{% static \'bower_components/bootstrap/dist/js/bootstrap.min.js\'%}"></script> </head> <body> <form action="http://www.likecs.com/" method="post"> <a href="#"> <img src="{{ captcha.image_url }}" alt="点击切换" > </a> <br> <input type="text" placeholder="验证码"> <br> <input value="{{ captcha.hashkey }}" type="hidden"> <button type="submit">提交</button> </form> <script> <!-- 动态刷新验证码js --> $(document).ready(function(){ $(\'.captcha\').click(function () { $.getJSON("refresh_captcha/", function (result) { $(\'#id_captcha\').attr(\'src\', result[\'image_url\']); $(\'#id_captcha_0\').val(result[\'hashkey\']) }); }); }); </script> </body> </html>  扩展JavaScript #这样子设置的background-image就是url(s),JavaScript代码当中的s变量并没有如你期望的那样子扩展开来。对JavaScript的运用不熟悉。 var s = "images/" + row + ".jpg";//row是table的当前行 $("body").css("background-image","url(" + s + ")");django-图形验证码(django-simple-captcha)
内容版权声明:除非注明,否则皆为本站原创文章。