django搭建BBS-登入&验证码的生成

基于注册完成后

文件结构

app 接口
- migrations
- __inint__.py
- admin.py 管理员页面注册表单用
- apps.py
- bbsform.py form组件相关设置
- models.py 模型存放
- tests.py
- views.py 业务逻辑
avatar 图片文件存储
BBS 项目名称以及路由存放
- __inint__.py
- settings.py
- urls.py
- wsgi.py
static
- bootstrap-3.3.7-dist bootstrap文件网上下载的
- jquery-3.4.1.min.js jq文件
templates 页面文件存放

一.创建图片验证

1.路由

urls.py

from django.conf.urls import url
from django.contrib import admin
#主路由导入视图内函数
from app import views
urlpatterns = [
    url(r\'^admin/\', admin.site.urls),
    url(r\'^register/\', views.register),
    url(r\'^login/\', views.login),
    url(r\'^get_code/\', views.get_code),
]

2.逻辑业务

views.py

from django.shortcuts import render,HttpResponse,redirect
from django.http import JsonResponse
#Image导入
#ImageDraw在图片上写字
#ImageFont 写字的格式
from PIL import Image,ImageDraw,ImageFont
import random
# 相当于把文件以byte格式存到内存中
from io import BytesIO

from django.contrib import auth

from app.bbsforms import Register
from app import models

from django.db.models import Count
from django.db.models.functions import TruncMonth
from django.db.models import F





# Create your views here.
def register(request):
    if request.method==\'GET\':
        form=Register()
        return render(request,\'register.html\',{\'form\':form})
    elif request.is_ajax():
        response={\'code\':100,\'msg\':None}
        form = Register(request.POST)
        if form.is_valid():
            #校验通过的数据
            clean_data=form.cleaned_data
            #把re_pwd剔除
            clean_data.pop(\'re_pwd\')
            #取出头像
            avatar=request.FILES.get(\'avatar\')
            if avatar:
                #因为用的是FileField，只需要把文件对象赋值给avatar字段，自动做保存
                clean_data[\'avatar\']=avatar
            user=models.UserInfo.objects.create_user(**clean_data)
            if user:
                response[\'msg\'] = \'创建成功\'
            else:
                response[\'code\'] = 103
                # 把校验不通过的数据返回
                response[\'msg\'] = \'创建失败\'
        else:
            response[\'code\']=101
            #把校验不通过的数据返回
            response[\'msg\']=form.errors
            print(type(form.errors))
        return JsonResponse(response,safe=False)


def login(request):
    if request.method==\'GET\':
        return render(request,\'login.html\')


def get_code(request):
    if request.method == \'GET\':
        img = Image.new(\'RGB\', (350, 40), (random.randint(0, 255), random.randint(0, 255), random.randint(0, 255)))
        # 写文字
        # 生成一个字体对象
        font = ImageFont.truetype(\'/static/Gabriola.ttf\', 34)
        # 调用方法，返回一个画板对象
        draw = ImageDraw.Draw(img)

        new_text =\'\'
        # 生成随机8位数字
        for x_index in range(1, 8):
            num = chr(random.randint(48, 57))
            word = chr(random.randint(65, 90))
            word_1 = chr(random.randint(97, 122))
            text =random.choice((num, word, word_1))
            draw.text((x_index * 32, 0),text, font=font)
            new_text +=text

        # 加点线
        width = 320
        height = 35
        for i in range(5):
            x1 = random.randint(0, width)
            x2 = random.randint(0, width)
            y1 = random.randint(0, height)
            y2 = random.randint(0, height)
            # 在图片上画线
            draw.line((x1, y1, x2, y2), fill=(random.randint(0, 255), random.randint(0, 255), random.randint(0, 255)))

        for i in range(33):
            # 画点
            draw.point([random.randint(0, width), random.randint(0, height)], fill=(random.randint(0, 255), random.randint(0, 255), random.randint(0, 255)))
            x = random.randint(0, width)
            y = random.randint(0, height)
            # 画弧形
            draw.arc((x, y, x + 4, y + 4), 0, 90, fill=(random.randint(0, 255), random.randint(0, 255), random.randint(0, 255)))
        print(new_text)
        #存在session中
        request.session[\'code\']=new_text
        #存内存
        f = BytesIO()
        img.save(f, \'png\')
        return HttpResponse(f.getvalue())

3.网页

login.html

<!DOCTYPE html>
<html lang="en">
<head>
    {% include \'bootstrap.html\' %}<--载入bootstrap-->
    <meta charset="UTF-8">
    <title>登入</title>
</head>
<body>
<div class="container-fluid center-block">
    <div class="row">
        <div class="col-md-6 col-md-offset-3">
            <h1>登陆</h1>
            <form action="">
                <div class="form-group">
                    <label for="id_name">用户名</label>
                    <input type="text" name="name" id="id_name" class="form-control">
                </div>
                <div class="form-group">
                    <label for="pwd">密码</label>
                    <input type="password" name="pwd" id="pwd" class="form-control">
                </div>
                <div class="form-group">
                    <label for="id_code">验证码</label>
                    <div class="row">
                        <div class="col-md-6">
                            <input type="text" name="code" id="id_code" class="form-control">
                        </div>
                        <div class="col-md-6" id="img">
                            <img src="/get_code/" height="40" width="350" class="img-code">
                        </div>
                    </div>
                </div>
                <input type="submit" value="提交" class="btn-success">
            </form>
        </div>
    </div>
</div>
</body>
{% include \'jq.html\' %} <--载入jq-->
<script>  <--利用img标标签属性src发送改变后会自己去找-->
    $(\'.img-code\').click(function () {
        var img_code_src = $(this).attr(\'src\');
        img_code_src += \'1\';
        console.log(img_code_src);
        $(this).attr(\'src\',img_code_src)
    })
</script>
</html>

二.账号信息进行验证

login.html

<!DOCTYPE html>
<html lang="en">
<head>
    {% include \'bootstrap.html\' %}
    <meta charset="UTF-8">
    <title>登入</title>
</head>
<body>
<div class="container-fluid center-block">
    <div class="row">
        <div class="col-md-6 col-md-offset-3">
            {% csrf_token %}
            <h1>登陆</h1>
            <form action="">
                <div class="form-group">
                    <label for="id_name">用户名</label>
                    <input type="text" name="name" id="id_name" class="form-control">
                </div>
                <div class="form-group">
                    <label for="pwd">密码</label>
                    <input type="password" name="pwd" id="pwd" class="form-control">
                </div>
                <div class="form-group">
                    <label for="id_code">验证码</label>
                    <div class="row">
                        <div class="col-md-6">
                            <input type="text" name="code" id="id_code" class="form-control">
                        </div>
                        <div class="col-md-6" id="img">
                            <img src="/get_code/" height="40" width="350" class="img-code">
                        </div>
                    </div>
                </div>
                <input type="button" value="提交" class="btn-success" id="up_data">
                <span style="color: red" id="msg"></span>
            </form>
        </div>
    </div>
</div>
</body>
{% include \'jq.html\' %}
<script>
    $(\'.img-code\').click(function () {
        var img_code_src = $(this).attr(\'src\');
        img_code_src += \'1\';
        console.log(img_code_src);
        $(this).attr(\'src\',img_code_src)
    })
</script>


<script>
    $(\'#up_data\').click(function () {
        $.ajax({
            type:\'post\',
            url:\'/login/\',
            data:{\'name\':$(\'#id_name\').val(),
                \'pwd\':$(\'#pwd\').val(),
                \'code\':$(\'#id_code\').val(),
                \'csrfmiddlewaretoken\':\'{{csrf_token}}\'
            },
            success:function (msg) {
                console.log(msg);
                $(\'#msg\').text(msg);
                if (msg ==\'登入成功\'){
                    console.log(\'sb\');
                    window.location.replace(\'http://www.baidu.com\');<--暂时先放百度-->
                }
            }
        })
    })
</script>
</html>

views.py

from django.shortcuts import render,HttpResponse,redirect
from django.http import JsonResponse
#Image导入
#ImageDraw在图片上写字
#ImageFont 写字的格式
from PIL import Image,ImageDraw,ImageFont
import random
# 相当于把文件以byte格式存到内存中
from io import BytesIO

from django.contrib import auth

from app.bbsforms import Register
from app import models

from django.db.models import Count
from django.db.models.functions import TruncMonth
from django.db.models import F





# Create your views here.
def register(request):
    if request.method==\'GET\':
        form=Register()
        return render(request,\'register.html\',{\'form\':form})
    elif request.is_ajax():
        response={\'code\':100,\'msg\':None}
        form = Register(request.POST)
        if form.is_valid():
            #校验通过的数据
            clean_data=form.cleaned_data
            #把re_pwd剔除
            clean_data.pop(\'re_pwd\')
            #取出头像
            avatar=request.FILES.get(\'avatar\')
            if avatar:
                #因为用的是FileField，只需要把文件对象赋值给avatar字段，自动做保存
                clean_data[\'avatar\']=avatar
            user=models.UserInfo.objects.create_user(**clean_data)
            if user:
                response[\'msg\'] = \'创建成功\'
            else:
                response[\'code\'] = 103
                # 把校验不通过的数据返回
                response[\'msg\'] = \'创建失败\'
        else:
            response[\'code\']=101
            #把校验不通过的数据返回
            response[\'msg\']=form.errors
            print(type(form.errors))
        return JsonResponse(response,safe=False)


def login(request):
    if request.method==\'GET\':
        return render(request,\'login.html\')
    else:
        print(request.POST)
        user_name=request.POST.get(\'name\')
        pwd=request.POST.get(\'pwd\')
        code=request.POST.get(\'code\')

        user=auth.authenticate(username=user_name,password=pwd)
        print(user)
        if request.session.get(\'code\').upper() !=code.upper(): #忽略大小写
            return HttpResponse(\'验证码错误\')
        elif not user:
            return HttpResponse(\'账号密码错误\')
        else:
            return HttpResponse(\'登入成功\')



def get_code(request):
    if request.method == \'GET\':
        img = Image.new(\'RGB\', (350, 40), (random.randint(0, 255), random.randint(0, 255), random.randint(0, 255)))
        # 写文字
        # 生成一个字体对象
        font = ImageFont.truetype(\'/static/Gabriola.ttf\', 34)
        # 调用方法，返回一个画板对象
        draw = ImageDraw.Draw(img)

        new_text =\'\'
        # 生成随机8位数字
        for x_index in range(1, 8):
            num = chr(random.randint(48, 57))
            word = chr(random.randint(65, 90))
            word_1 = chr(random.randint(97, 122))
            text =random.choice((num, word, word_1))
            draw.text((x_index * 32, 0),text, font=font)
            new_text +=text

        # 加点线
        width = 320
        height = 35
        for i in range(5):
            x1 = random.randint(0, width)
            x2 = random.randint(0, width)
            y1 = random.randint(0, height)
            y2 = random.randint(0, height)
            # 在图片上画线
            draw.line((x1, y1, x2, y2), fill=(random.randint(0, 255), random.randint(0, 255), random.randint(0, 255)))

        for i in range(33):
            # 画点
            draw.point([random.randint(0, width), random.randint(0, height)], fill=(random.randint(0, 255), random.randint(0, 255), random.randint(0, 255)))
            x = random.randint(0, width)
            y = random.randint(0, height)
            # 画弧形
            draw.arc((x, y, x + 4, y + 4), 0, 90, fill=(random.randint(0, 255), random.randint(0, 255), random.randint(0, 255)))
        print(new_text)
        #存在session中
        request.session[\'code\']=new_text
        #存内存
        f = BytesIO()
        img.save(f, \'png\')
        return HttpResponse(f.getvalue())

本文链接：https://www.cnblogs.com/pythonywy/p/11408318.html

django搭建BBS-登入&验证码的生成

django搭建BBS-登入&验证码的生成

文件结构

一.创建图片验证

1.路由

2.逻辑业务

3.网页

二.账号信息进行验证

django搭建BBS-登入&验证码的生成的更多相关文章

随机推荐

热门专题

目录导航