django+boostrap实现注册

news2024/11/22 11:17:15

一、django介绍

Django 是一个高级的 Python 网络框架,可以快速开发安全和可维护的网站。由经验丰富的开发者构建,Django 负责处理网站开发中麻烦的部分,因此你可以专注于编写应用程序,而无需重新开发。 它是免费和开源的,有活跃繁荣的社区,丰富的文档,以及很多免费和付费的解决方案。

Django 可以使你的应用具有以下优点:

完备性


Django 遵循“功能完备”的理念,提供开发人员可能想要“开箱即用”的几乎所有功能。因为你需要的一切都是一个”产品“的一部分,它们都可以无缝结合在一起,遵循一致性设计原则,并且具有广泛和最新的文档.

通用性


Django 可以(并已经)用于构建几乎任何类型的网站—从内容管理系统和维基,到社交网络和新闻网站。它可以与任何客户端框架一起工作,并且可以提供几乎任何格式(包括 HTML,Rss 源,JSON,XML 等)的内容。你正在阅读的网站就是基于 Django。

在内部,尽管它为几乎所有可能需要的功能(例如几个流行的数据库,模版引擎等)提供了选择,但是如果需要,它也可以扩展到使用其他组件。

安全性


Django 帮助开发人员通过提供一个被设计为“做正确的事情”来自动保护网站的框架来避免许多常见的安全错误。例如,Django 提供了一种安全的方式来管理用户账户和密码,避免了常见的错误,比如将 session 放在 cookie 中这种易受攻击的做法(取而代之的是 cookies 只包含一个密钥,实际数据存储在数据库中)或直接存储密码而不是密码哈希。

密码哈希是通过密码散列函数发送密码而创建的固定长度值。Django 能通过运行哈希函数并将输出的哈希值与存储的哈希值进行比较来检查输入的密码是否正确。然而由于功能的“单向”性质,即使存储的哈希值被泄漏,攻击者也难以破解原始密码。

默认情况下,Django 可以防范许多漏洞,包括 SQL 注入,跨站点脚本,跨站点请求伪造和点击劫持 (请参阅 网站安全 相关信息,如有兴趣).

可扩展


Django 使用基于组件的“无共享”架构 (架构的每一部分独立于其他架构,因此可以根据需要进行替换或更改). 在不用部分之间有明确的分隔意味着它可以通过在任何级别添加硬件来扩展服务:缓存服务器,数据库服务器或应用程序服务器。一些最繁忙的网站已经成功地缩放了 Django,以满足他们的需求(例如 Instagram 和 Disqus,仅举两个例子,可自行添加)。

可维护性


Django 代码编写是遵照设计原则和模式,鼓励创建可维护和可重复使用的代码。特别是它使用了不要重复自己(DRY)原则,所以没有不必要的重复,减少了代码的数量。Django 还将相关功能分组到可重用的“应用程序”中,并且在较低级别将相关代码分组或模块( 模型视图控制器 (MVC) 模式).

灵活性


Django 是用 Python 编写的,它在许多平台上运行。这意味着你不受任务特定的服务器平台的限制,并且可以在许多种类的 Linux,Windows 和 Mac OsX 上运行应用程序。此外,Django 得到许多网络托管提供商的好评,他们经常提供特定的基础设施和托管 Django 网站的文档。

二、Bootstrap 简介

为什么使用 Bootstrap?

  • 移动设备优先:自 Bootstrap 3 起,框架包含了贯穿于整个库的移动设备优先的样式。
  • 浏览器支持:所有的主流浏览器都支持 Bootstrap。

    Internet Explorer

     

    Firefox

     

    Opera

     

    Google Chrome

     

    Safari

  • 容易上手:只要您具备 HTML 和 CSS 的基础知识,您就可以开始学习 Bootstrap。
  • 响应式设计:Bootstrap 的响应式 CSS 能够自适应于台式机、平板电脑和手机。更多有关响应式设计的内容详见 Bootstrap 响应式设计。

    响应式设计

  • 它为开发人员创建接口提供了一个简洁统一的解决方案。
  • 它包含了功能强大的内置组件,易于定制。
  • 它还提供了基于 Web 的定制。
  • 它是开源的。

三、具体实现

path

path('register',views.register,name='register'),

view

@require_http_methods(['GET', 'POST'])
def register(request):
    if request.method == 'GET':
        return render(request, 'register.html')
    else:
        form = RegisterForm(request.POST)
        if form.is_valid():
            email = form.cleaned_data.get('email')
            username = form.cleaned_data.get('username')
            password = form.cleaned_data.get('password')
            User.objects.create_user(username=username, email=email, password=password)
            return redirect(reverse('cwauth:login'))
        else:
            print(form.errors)
            return render(request, 'register.html', {'form': form})


def send_email_captcha(request):

    email = request.GET.get('email')
    if not email:
        return JsonResponse({'code':400,'message':'必须传递邮箱'})

    captcha="".join(random.sample(string.digits,4))#[1,2,4,5]
    #print(captcha)
    #存储到数据库
    CaptchaModel.objects.update_or_create(email=email,defaults={'captcha':captcha})
    send_mail("博客验证码",message=f"您的验证码是:{captcha}",recipient_list=[email],from_email=None)
    return JsonResponse({"code":200,"message":"邮箱发送验证码发送成功!"})

register.html

{% extends 'base.html' %}
{% block title %}
	--注册
{% endblock %}
{% block head %}
	<script src="{% static 'jquery/jquery-3.7.1.min.js' %}"></script>
    <script src="{% static 'js/register.js' %}"></script>
{% endblock %}


{% block main %}
	<div style="max-width: 330px;" class="m-auto">
        <h1>注册 </h1>
        <form action="" method="POST">
            {% csrf_token %}
            <div class="mb-3">
                <label>用户名</label>
                <input type="text" name="username" class="form-control" placeholder="用户名">
            </div>

            <div class="mb-3">
                <label>邮箱</label>
                <input type="email" name="email" class="form-control" placeholder="邮箱">
            </div>

            <div class="mb-3">
                <label>验证码</label>
                <div class="input-group mb-3">
                    <input type="text" class="form-control" name="captcha" placeholder="验证码"
                           aria-label="Recipient's username" >
                    <button class="btn btn-outline-secondary" type="button" id="yanzhengma">获取验证码</button>
                </div>
            </div>


            <div class="mb-3">
                <label>密码</label>
                <input type="password" name="password" class="form-control" placeholder="密码">
            </div>

            <div class="mb-3">
                <button class="btn btn-primary w-100">立即注册</button>
            </div>
        </form>
    </div>
{% endblock %}

register.js

$(function () {
    function bindCaptchaBtnClick() {
        $("#yanzhengma").click(function (event) {
        let $this = $(this);
        let email = $("input[name='email']").val();
        if (!email) {
            alert("请先输入邮箱!");
            return;
        }
        $this.off('click');

        //发送ajax
        $.ajax('/auth/captcha?email='+email,{
            method:"GET",
            success:function (result) {
                if(result['code']===200){
                    alert('验证码发送成功!');
                }else {
                    alert(result['message'])
                }
            },
            fail:function (error){
                console.log(error);
            }
        })
        //倒计时
        let countdown = 6;
        let timer = setInterval(function () {
            if (countdown <= 0) {
                $this.text('获取验证码');
                clearInterval(timer);
                bindCaptchaBtnClick();
            } else {
                countdown--;
                $this.text(countdown + 's')

            }

        }, 1000);

    })
    }
    bindCaptchaBtnClick();
});

发送验证码配置

#邮件相关配置
EMAIL_BACKEND = 'django.core.mail.backends.smtp.EmailBackend'# 发送邮件配置
EMAIL_HOST = 'smtp.qq.com'# 服务器名称
EMAIL_PORT = 25# 服务端口
EMAIL_HOST_USER = '14589@139.com' # 填写自己邮箱
EMAIL_HOST_PASSWORD = 'dpbvxyovdsnmbaae'# 在邮箱中设置的客户端授权密码
EMAIL_FROM = '董*'# 收件人看到的发件人
DEFAULT_FROM_EMAIL = EMAIL_HOST_USER
EMAIL_USE_TLS = True   #是否使用TLS安全传输协议
#EMAIL_USE_SSL = True    #是否使用SSL加密,qq企业邮箱要求使用

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2244522.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【面试题】接口怎么测试?如何定位前后端的Bug?

接口怎么测试&#xff1f; 接口测试用来验证不同软件组件之间的交互是否正常。包括验证数据传输&#xff0c;参数传递&#xff0c;我在多个项目中有过测试接口的经验。&#xff08;… 当进行接口测试时&#xff0c;会使用Postman和Python的Requests库。首先根据接口文档设计测…

151页PDF | XX集团数字化转型SAP项目规划方案(限免下载)

一、前言 这份报告是XX集团数字化转型SAP项目规划方案&#xff0c;该报告涵盖了集团战略解读、管理痛点分析、信息化建设目标、整体架构方案、实施策略、SAP系统价值和预期收益&#xff0c;旨在通过数字化推动集团运营模式变革&#xff0c;实现降本增效和价值创新。 《XX集团…

iOS逆向入门:使用theos注入第三方依赖库

背景 theos是一个跨平台的软件开发框架&#xff0c;常用于管理&#xff0c;开发和部署iOS项目&#xff0c;同时也是开发iOS越狱插件的主要工具。和MonkeyDev不同的是&#xff0c;它不依赖于xcode&#xff0c;可以在多个操作系统上运行。一个完整的iOS越狱开发流程包括&#xf…

LLM文档对话 —— pdf解析关键问题

一、为什么需要进行pdf解析&#xff1f; 最近在探索ChatPDF和ChatDoc等方案的思路&#xff0c;也就是用LLM实现文档助手。在此记录一些难题和解决方案&#xff0c;首先讲解主要思想&#xff0c;其次以问题回答的形式展开。 二、为什么需要对pdf进行解析&#xff1f; 当利用L…

HarmonyOS Next 浅谈 发布-订阅模式

HarmonyOS Next 浅谈 发布-订阅模式 前言 其实在目前的鸿蒙应用开发中&#xff0c;或者大前端时代、vue、react、小程序等等框架、语言开发中&#xff0c;普通的使用者越来越少的会碰到必须要掌握设计模式的场景。大白话意思就是一些框架封装太好了&#xff0c;使用者只管在它…

【HCIP]——OSPF综合实验

题目 实验需求 根据上图可得&#xff0c;实验需求为&#xff1a; 1.R5作为ISP&#xff1a;其上只能配置IP地址&#xff1b;R4作为企业边界路由器&#xff0c;出口公网地址需要通过PPP协议获取&#xff0c;并进行CHAP认证。&#xff08;PS&#xff1a;因PPP协议尚未学习&#…

利用大语言模型对基准数据集在预处理和微调过程的数据污染检测

概述 虽然大规模语言模型发展迅速&#xff0c;但对其进行评估却变得越来越困难。人们在短时间内建立了许多基准来评估大规模语言模型的性能&#xff0c;但这些分数并不一定反映真实世界的性能。此外&#xff0c;还有人指出&#xff0c;这些基准数据集可能受到预处理和微调过程…

【SKFramework框架】一、框架介绍

推荐阅读 CSDN主页GitHub开源地址Unity3D插件分享QQ群&#xff1a;398291828小红书小破站 大家好&#xff0c;我是佛系工程师☆恬静的小魔龙☆&#xff0c;不定时更新Unity开发技巧&#xff0c;觉得有用记得一键三连哦。 一、前言 【Unity3D框架】SKFramework框架完全教程《全…

Linux中定时操作

一、一次性定时 这里以23&#xff1a;00为例 输入相关时间----at 23&#xff1a;00 所保存在哪个文件里------ ls /root > at.txt <EOT> &#xff08;ctrld退出到root&#xff09; 查看计划任务 ------ at -l 最后删除任务----at -d 2 二、周期性定时&#xf…

自回归和Rectified Flow完美融合统一多模态理解和生成!DeepSeek北大等开源JanusFlow

论文链接&#xff1a;https://arxiv.org/pdf/2411.07975 github链接&#xff1a;https://github.com/deepseek-ai/Janus 亮点直击 统一多模态框架&#xff1a; 提出 JanusFlow&#xff0c;一个同时处理图像理解和文本到图像生成任务的统一模型&#xff0c;解决了任务分离带来的…

Docker1:认识docker、在Linux中安装docker

欢迎来到“雪碧聊技术”CSDN博客&#xff01; 在这里&#xff0c;您将踏入一个专注于Java开发技术的知识殿堂。无论您是Java编程的初学者&#xff0c;还是具有一定经验的开发者&#xff0c;相信我的博客都能为您提供宝贵的学习资源和实用技巧。作为您的技术向导&#xff0c;我将…

数据结构在二叉树Oj中利用子问题思路来解决问题

二叉树Oj题 获取二叉树的节点数获取二叉树的终端节点个数获取k层节点的个数获取二叉树的高度检测为value的元素是否存在判断两颗树是否相同判断是否是另一棵的子树反转二叉树判断一颗二叉树是否是平衡二叉树时间复杂度O(n*n)复杂度O(N) 二叉树的遍历判断是否是对称的二叉树二叉…

【C++】踏上C++学习之旅(九):深入“类和对象“世界,掌握编程的黄金法则(四)(包含四大默认成员函数的练习以及const对象)

文章目录 前言1. 实现Date类的构造函数2. 实现Date类的拷贝构造函数3. 实现Date类的赋值运算符重载4. 实现各Date对象之间的比较接口5. 实现Date对象的加减接口6. const成员7. 取地址及const取地址操作符重载 前言 在我们前面学习到了"类和对象"的四大默认成员函数(…

远程控制软件使用教程

随着数字化办公浪潮的席卷&#xff0c;远程控制软件已经悄无声息地融入我们的日常生活&#xff0c;成为提升工作效率的神奇工具。它让我们无论身处何地&#xff0c;都能轻松驾驭办公室电脑&#xff0c;让旅途中的工作也变得轻松自如。那么&#xff0c;远程控制软件究竟是什么&a…

oracle查看锁阻塞-谁阻塞了谁

一 模拟锁阻塞 #阻塞1 一个会话正在往一个大表写入大量数据的时候&#xff0c;另一个会话加字段&#xff1a; #会话1 #会话2 会话2被阻塞了。 #阻塞2 模拟一个会话update一条记录&#xff0c;没提交。 另一个会话也update这一条记录&#xff1a; 会话2被阻塞了。 二 简单查…

我用豆包MarsCode IDE 做了一个 CSS 权重小组件

作者&#xff1a;夕水 查看效果 作为一个前端开发者&#xff0c;应该基本都会用VSCode来做开发&#xff0c;所以也应该见过如下这张图的效果: 以上悬浮面板分为2个部分展示内容。 <element class"hljs-attr">: 代表元素只有一个类名叫hljs-attr的类选择器&am…

第三届航空航天与控制工程国际学术会议 (ICoACE 2024)

重要信息 会议官网&#xff1a;www.icoace.com 线下召开&#xff1a;2024年11月29日-12月1日 会议地点&#xff1a;陕西西安理工大学金花校区 &#xff08;西安市金花南路5号&#xff09; 大会简介 2024年第三届航空航天与控制工程国际学术会议&#xff08;ICoACE 2024&a…

如何下载链接为blob类型的视频,video 标签 src:blob 链接转下载MP4

文章目录 前言这种链接是如何生成的&#xff1f;原理分析 第一步&#xff0c;找到源地址1.在想下载的视频网页&#xff0c;按f12打开开发人员工具。找到video标签&#xff0c;锁定src属性2.确认src源为blob&#xff1a;样式&#xff0c;转到网络&#xff08;network&#xff09…

Redis | Redis常用命令及示例总结(API)

前言 参考文档&#xff1a;http://doc.redisfans.com/index.html 本篇主要总结Redis的常用命令&#xff0c;笔者在记录命令时的格式如下&#xff1a; 命令关键字&#xff1a;命令示例&#xff1b;命令说明&#xff1b; 命令参数解释及一些说明&#xff1b; 其中命令关键字使用…

【VTK】MFC中使用VTK9.3

MFC中如果使用VTK 碎碎念一、vtk环境配置二、具体实现1、新建类2. 自定义控件3、跑个栗子 总结 碎碎念 如果不是老程序用的MFC&#xff0c;我才不想用MFC去使用VTK呢。 一、vtk环境配置 关于环境配置你可以看这篇文章&#xff0c;在这里不过多赘述。需要注意要选择支持MFC&a…