首页 Django项目开发与部署视频教程 登陆界面开发前期准备和图片验证码介绍
pay pay

登陆界面开发前期准备和图片验证码介绍

日期: 六月 28, 2023, 1:27 p.m.
阅读: 90
作者: Python自学网-村长

摘要: 登陆界面开发前期准备和图片验证码介绍

00:00 / 7:00
1x
2x
1.5x
1.25x
1x
0.8x
0.5x
>
django开发实战-接口开发
    1. 第1课:首页视频查询接口开发逻辑讲解
      7分钟
    2. 第2课:首页下载和文章调用查询方法实战演示
      7分钟
    3. 第3课:首页视图和路由配置完善
      7分钟
    4. 第4课:Django项目首页侧边栏内容调用接口处理
      7分钟
    5. 第5课:Django项目实战文章列表页内容调用接口开发
      7分钟
    6. 第6课:文章列表页分页器Paginator使用方法
      7分钟
    7. 第7课:文章内容页信息和标签调用方法
      7分钟
    8. 第8课:文章内容页翻页和点击统计开发
      7分钟
    9. 第9课:文章内容页相关信息调用逻辑和代码实现
      7分钟
    10. 第10课:视频栏目页视频列表内容调用
      7分钟
    11. 第11课:Django项目实战视频内容页内容调用接口开发
      7分钟
    12. 第12课:下载栏目页内容调用接口开发实战
      7分钟
    13. 第13课:Django项目实战下载页面内容调用接口开发
      7分钟
    14. 第14课:page页面侧边栏当前页面高亮显示
      7分钟
    15. 第15课:Django项目搜索接口开发逻辑讲解
      7分钟
    16. 第16课:第三方短信发送接口讲解和前期准备工作
      7分钟
    17. 第17课:Django注册功能第三方短信发送接口代码讲解
      7分钟
    18. 第18课:第三方验证信息发送接口代码完善和响应数据处理
      7分钟
    19. 第19课:第三方验证信息发送接口调用视图函数构造
      7分钟
    20. 第20课:注册功能开发和注册验证
      7分钟
    21. 第21课:登陆界面开发前期准备和图片验证码介绍
      7分钟
    22. 第22课:视图接口开发-图片验证码背景噪点绘制
      7分钟
    23. 第23课:视图接口开发-绘制完整图片验证码
      7分钟
    24. 第24课:视图接口开发-登陆功能测试和完善
      7分钟
    25. 第25课:视图接口开发-退出登录方法演示
      7分钟

登陆界面开发前期准备和图片验证码介绍

login.html

{% extends 'base.html' %}
{% load static %}
{% block body %}
<!-- 主体内容  -->

    <!-- 中间部分 start -->
    <div class="container">
        <!-- 主体内容 star  -->
        <div class="formbox">      
            <form action="/login/" method="post" id="form">{% csrf_token %}
                <h1 class="title">登录</h1>
                {{ errmsg }}
				<div class="item">
					<label for="mob">手机号</label>
                    <input type="mobile" name="mobile" placeholder="请输入手机号" id="mob">
                    <span class="haserror">{{ errmsg }}</span>
				</div>
				<div class="item clearfix">
                    <label for="pwd">登录密码</label>
                    <input type="password" name="password" placeholder="输入密码" id="pwd">
                    <span class="haserror"></span>
                    <a class="forget fr" href="#">{{ errmsg }}</a>
                </div>
				<div class="item flex">
					<input type="text" name="code" placeholder="请输入验证码" class="code" id="code">
					<a class="a_img" href="#"><img src="/code_img/" alt=""></a>
				</div>
				<div class="item">
					<button type="submit" name="submit" value="立即登录" id="login">立即登录</button>
                </div>
                
                <a class="forget fr" href="/register/">没有账号? 点击注册</a>
            </form>
        </div>
        <!-- 主体内容 end  -->
    </div>
    <!-- 中间部分 end -->
<!-- 主体内容  -->

    <!-- 网站页脚 start -->
{% endblock %}

views.py

def code_img(request):
    # 需要一张背景图
    # (189, 244, 9)  0-255    red green    #000fff
    width = 159
    height = 33
    bgcolor = (random.randrange(20, 200), random.randrange(20, 200), random.randrange(20, 200))
    im = Image.new('RGB', (width, height), color=bgcolor)

    # 需要一些噪点500
    draw = ImageDraw.Draw(im)  # 创建一个画笔对象
    for i in range(0, 500):
        xy = (random.randrange(0, width), random.randrange(0, height))
        fill = (random.randrange(0, 255), random.randrange(0, 255), random.randrange(0, 255))
        draw.point(xy, fill=fill)

    # 需要4个数字
    str1 = '0123456789'
    rand_str = ''
    for i in range(0, 4):
        rand_str += str1[random.randrange(0, len(str1))]
    font = ImageFont.truetype('static/font/angsab.ttf', 23)

    fill = (random.randrange(0, 255), random.randrange(0, 255), random.randrange(0, 255))
    draw.text((5, 2), rand_str[0], font=font, fill=fill)
    draw.text((23, 5), rand_str[1], font=font, fill=fill)
    draw.text((59, 1), rand_str[2], font=font, fill=fill)
    draw.text((92, 5), rand_str[3], font=font, fill=fill)

    del draw
    request.session['code'] = rand_str
    buf = BytesIO()
    im.save(buf, 'png')
    return HttpResponse(buf.getvalue())

 

原创视频,版权所有,未经允许,切勿转载,违者必究!
回顶部