【Django博客网站】b站项目学习系列二：注册界面

最新推荐文章于 2024-05-17 09:46:07 发布
最新推荐文章于 2024-05-17 09:46:07 发布
阅读量811 收藏 28
点赞数 18
分类专栏： 【Django博客网站】 文章标签： python django html mysql redis git
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/castlegirl/article/details/135063044
版权
  1. 创建用户： 
    python manage.py startapp users
  2. 注册子应用：在 blog 文件夹的 settings.py 的 INSTALLED_APPS 中添加： 
    'users.apps.UsersConfig',
  3. 准备模板目录并设置模板路径：在 blog 同级文件夹中新建 templates 文件夹，在 blog 文件夹的 settings.py 的 TEMPLATES 中添加： 
    'DIRS': [os.path.join(BASE_DIR, 'templates')],
  4. 将 static 文件夹中的 register.html 拖入 templates 文件夹中，在 users 文件夹的 views.py 中加入： 
    from django.views import View
class RegisterView(View):
    """用户注册"""
    def get(self, request):
        """
        提供注册界面
        :param request: 请求对象
        :return: 注册界面
        """
        return render(request, 'register.html')
  5. 定义子路由：在 users 文件夹中创建 urls.py 文件，并加入： 
    from django.urls import path
from users.views import RegisterView
urlpatterns = [
    # 参数1：路由
    # 参数2：视图函数
    # 参数3：路由名，方便通过reverse来获取路由
    path('register/', RegisterView.as_view(), name='register'),
]
  6. 添加子应用路由引导：在 blog 文件夹的 urls.py 文件中，替换和添加： 
    from django.urls import path, include
path('', include(('users.urls', 'users'), namespace='users')),
  7. 在 templates 文件夹的 register.html 文件中修改静态文件加载方式（相对加载路径），以下代码是 html 的 header 处修改： 
    {% load static %}    // 在django3.x后不再使用load staticfiles
<!-- 引入bootstrap的css文件 -->
<link rel="stylesheet" href="{% static 'bootstrap/css/bootstrap.min.css' %}">
<!-- 引入vuejs -->
<script type="text/javascript" src="{% static 'js/vue-2.5.16.js' %}"></script>
<script type="text/javascript" src="{% static 'js/axios-0.18.0.min.js' %}"></script>
    以下代码是 <!--图片验证码--> 处修改： 
    <img src="{% static 'img/image_code.png'%}" @click="generate_image_code" alt="" style="width: 110px;height: 40px;">
    以下代码是 html 的 footer 处修改： 
    <!-- 引入js -->
<script type="text/javascript" src="{% static 'js/host.js' %}"></script>
<script type="text/javascript" src="{% static 'js/common.js' %}"></script>
<script type="text/javascript" src="{% static 'js/register.js' %}"></script>
  8. 在网页中输入：127.0.0.1:8000/register/ 出现登录界面

  • 定义用户模型类

  1. User对象基本属性：
    创建用户必选username、password
    创建用户可选email、first_name、last_name、last_login、date_joined、is_active、is_staff、is_superuse
    判断用户是否通过认证is_authenticated
    修改用户名认证字段USERNAME_FIELD
    创建用户的方法user = User.objects.create_user(username, password, **extra_fields)
    用户认证的方法

    from django.contrib.auth import authenticate

    user = authenticate(username=username, password=password, **kwargs)

    设置密码set_password(raw_password)
    校验密码check_password(raw_password)
  2. 自定义用户模型类：在 users 文件夹的 models.py 文件中添加： 
    from django.db import models
from django.contrib.auth.models import AbstractUser
class User(AbstractUser):      # 用户信息
    mobile = models.CharField(max_length=20, unique=True,blank=True)    # 电话号码字段            	avatar = models.ImageField(upload_to='avatar/%Y%m%d/', blank=True)      # 头像
    user_desc = models.TextField(max_length=500, blank=True)    # 个人简介
    USERNAME_FIELD = 'mobile'    # 修改认证的字段
    REQUIRED_FIELDS = ['username','email']    #创建超级管理员的需要必须输入的字段
    class Meta:    # 内部类 class Meta 用于给 model 定义元数据
        db_table='tb_user'              #修改默认的表名
        verbose_name='用户信息'         # Admin后台显示
        verbose_name_plural=verbose_name      # Admin后台显示
    def __str__(self):
        return self.mobile
  3. 指定用户模型类：配置规则为 AUTH_USER_MODEL = '应用名.模型类名'，在 blog 文件夹的 settings.py 的最后添加： 
    AUTH_USER_MODEL = 'users.User'
  4. 迁移用户模型类： 
    python manage.py makemigrations
python manage.py migrate
    若出现以下报错，则先注释掉 blog 文件夹的 settings.py 中 INSTALLED_APPS 的 'django.contrib.admin', 和 urls.py 中 urlpatterns 的 path('admin/', admin.site.urls),

      5. cmd 进入 MySQL，Ctrl+C 可退出当前界面，输入 use blog（blog文件夹的 settings.py 中的数据库名字），再输入 show databases; 和 desc tb_user;

  • 图形验证码接口设计和定义

  1. 在 blog 文件夹的同级目录中新建 libs 文件夹，放入 captcha 文件夹和 _init_.py 文件
  2. 安装图片处理库（大于10的版本会报错）： 
    pip install Pillow==9.5.0
  3. 请求方式：GET，请求地址：imagecode?uuid=xxxxx-xxxx-xxxxxx，参数名：uuid，类型：string，是否必传：是，说明：唯一编号
  4. 添加图形验证码视图：在 users 文件夹的 views.py 的最后添加： 
    from django.http import HttpResponseBadRequest,HttpResponse
from libs.captcha.captcha import captcha
from django_redis import get_redis_connection
class ImageCodeView(View):
    def get(self,request):
        uuid=request.GET.get('uuid')        #获取前端传递过来的参数
        if uuid is None:        #判断参数是否为None
            return HttpResponseBadRequest('请求参数错误')
        text, image = captcha.generate_captcha()   # 获取验证码内容和图片二进制数据
        redis_conn = get_redis_connection('default')   # 将图片验内容保存到redis中，并设置过期时间
        redis_conn.setex('img:%s' % uuid, 300, text)
        return HttpResponse(image, content_type='image/jpeg')        # 返回响应，将生成的图片以content_type为image/jpeg的形式返回给请求
  5. 设置子路由：在 users 文件夹的 urls.py 中添加： 
    from django.urls import path
from users.views import ImageCodeView
urlpatterns = [
    path('imagecode/', ImageCodeView.as_view(),name='imagecode'),
]
  6. 在 templates 文件夹的 register.html 文件中，修改模板中图片验证码 HTML 代码： 
    <img :src="image_code_url" @click="generate_image_code" alt="" style="width: 110px;height: 40px;">
  7. 如果运行网页出现下列错误：

        则需要安装 cryptography，如清华大学源：

pip3 install cryptography -i https://pypi.tuna.tsinghua.edu.cn/simple

  • 短信验证码

  1. 在 libs 文件夹中，拖入 yuntongxin 文件夹，并新建 __init__.py 文件；在 utils 文件夹中，加入 response_code.py 文件
  2. 容联云短信平台官网链接：https://www.yuntongxun.com/，免费开发测试模板 ID 为 1，形式为：【云通讯】您使用的是云通讯短信模板，您的验证码是 {1}，请于 {2} 分钟内正确输入。根据控制台信息修改 yuntongxin 文件夹中的 sms.py 文件： 
    _accountSid = '2c94811c8b1e335b018c4d288d9744ae'   # ACCOUNT SID
_accountToken = '190c870643c94ba78238005a4139f4dd'   # AUTH TOKEN
_appId = '2c94811c8b1e335b018c4d288f1744b5'   # APPID
  3. 在 users 文件夹的 views.py 中加入： 
    from django.http import JsonResponse
from utils.response_code import RETCODE
from random import randint
from libs.yuntongxun.sms import CCP
import logging
logger=logging.getLogger('django')
class SmsCodeView(View):
    def get(self,request):
        image_code_client = request.GET.get('image_code')        # 接收参数
        uuid = request.GET.get('uuid')
        mobile=request.GET.get('mobile')
        if not all([image_code_client, uuid,mobile]):        # 校验参数
            return JsonResponse({'code': RETCODE.NECESSARYPARAMERR, 'errmsg': '缺少必传参数'})
        redis_conn = get_redis_connection('default')        # 创建连接到redis的对象
        image_code_server = redis_conn.get('img:%s' % uuid)        # 提取图形验证码
        if image_code_server is None:
            return JsonResponse({'code': RETCODE.IMAGECODEERR, 'errmsg': '图形验证码失效'})            # 图形验证码过期或者不存在
        try:        # 删除图形验证码，避免恶意测试图形验证码
            redis_conn.delete('img:%s' % uuid)
        except Exception as e:
            logger.error(e)
        image_code_server = image_code_server.decode()  # bytes转字符串
        if image_code_client.lower() != image_code_server.lower():  # 转小写后比较
            return JsonResponse({'code': RETCODE.IMAGECODEERR, 'errmsg': '输入图形验证码有误'})
        sms_code = '%06d' % randint(0, 999999)     # 生成短信验证码：生成6位数验证码
        logger.info(sms_code)   # 将验证码输出在控制台，以方便调试
        redis_conn.setex('sms:%s' % mobile, 300, sms_code)   # 保存短信验证码到redis中，并设置有效期
        CCP().send_template_sms(mobile, [sms_code, 5],1)     # 发送短信验证码
        return JsonResponse({'code': RETCODE.OK, 'errmsg': '发送短信成功'})    # 响应结果
  4. 运行后获取的验证码显示在 vscode 工作区窗口中

  • 用户注册实现

  1. 注册视图： 
    import re
from users.models import User
from django.db import DatabaseError
class RegisterView(View):
    def post(self,request):
        mobile = request.POST.get('mobile')        #接收参数
        password = request.POST.get('password')
        password2 = request.POST.get('password2')
        smscode=request.POST.get('sms_code')
        if not all([mobile, password, password2, smscode]):        # 判断参数是否齐全
            return HttpResponseBadRequest('缺少必传参数')
        if not re.match(r'^1[3-9]\d{9}$', mobile):        # 判断手机号是否合法
            return HttpResponseBadRequest('请输入正确的手机号码')
        if not re.match(r'^[0-9A-Za-z]{8,20}$', password):     # 判断密码是否是8-20个数字
            return HttpResponseBadRequest('请输入8-20位的密码')
        if password != password2:        # 判断两次密码是否一致
            return HttpResponseBadRequest('两次输入的密码不一致')
        redis_conn = get_redis_connection('default')        #验证短信验证码
        sms_code_server = redis_conn.get('sms:%s' % mobile)
        if sms_code_server is None:
            return HttpResponseBadRequest('短信验证码已过期')
        if smscode != sms_code_server.decode():
            return HttpResponseBadRequest('短信验证码错误')
        try:        # 保存注册数据
            user=User.objects.create_user(username=mobile,mobile=mobile, password=password)
        except DatabaseError:
            return HttpResponseBadRequest('注册失败')
        return HttpResponse('注册成功，重定向到首页')        # 响应注册结果
  2. 在 templates 文件夹的 register.html 中添加： 
    {% csrf_token %}

  • 展示首页

  1. 创建首页子应用： 
    python manage.py startapp home
  2. 定义首页视图：在 home 文件夹的 views.py 中添加： 
    from django.views import View
class IndexView(View):
    def get(self, request):    """首页广告"""
        return render(request, 'index.html')        """提供首页广告界面"""
  3. 在 home 子应用中创建 urls.py 文件，并定义子路由： 
    from django.urls import path
from home.views import IndexView
urlpatterns = [
    path('', IndexView.as_view(),name='index'),
]
  4. 在 blog 文件夹的 urls.py 总路由中添加子应用路由引导： 
    path('', include(('home.urls','home'),namespace='home')),
  5. 需将 index.html 加入templates文件夹下

  • 状态保持

  1. 设置首页所需的用户名信息和登录状态：修改 users 文件夹的 views.py 文件 
    from django.contrib.auth import login
login(request, user)
response = redirect(reverse('home:index'))   # 跳转到首页
response.set_cookie('is_login',True)   # 设置cookie，登录状态，会话结束后自动过期
response.set_cookie('username',user.username,max_age=30*24*3600)   # 设置用户有效期
return response
  2. 查看 cookie 数据：先在链接 http://127.0.0.1:8000/register/ 中注册账号，再进入链接 http://127.0.0.1:8000/ 点击左上方带圈 (i) 进行查看
  3. cmd 中输入 redis-cli，进入后输入 keys * 查看，再输入 select 1 和 keys * 查看

 学习介绍链接：https://blog.csdn.net/castlegirl/article/details/135075747?spm=1001.2014.3001.5501

项目链接：GitHub - haifengyuhui/project_blogweb: Project: A website for haifengyuhui's blog

海风迂回
关注
  • 18
    点赞
  • 踩
  • 28
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
django做一个注册登录界面
也许会有_hui的博客
04-03 5924
一、基于sb-admin模板完成以下登录的逻辑 用户想要访问一个网页，首先要求注册账号，有了账号之后再去登录，才能访问网站的主页 1.先说以下用户注册的逻辑： register 注册 form 表单保存数据到用户表 密码要加密 2.然后是登录界面 login 登录 form 表单提交数据和数据库数据校验 先校验用户是否存在 存在：校验密码 ...
Django实现登录-注册等功能
10-13
Django实现登录-注册等功能==仅供参考
Django实现页面注册登录界面
泓源的博客
03-27 7542
增加数据 在acsign/models.py中增加用户数据： class Users(models.Model): u_name = models.CharField(max_length=10) u_password = models.CharField(max_length=255) u_ticket = models.CharField(max_length=30, ...
Django 02 简单注册页面的创建1
VanChaoi的博客
07-02 604
当在网页运行时候报错:200-300代表成功300-400位置发生改变400-500资源不可用,比如资源地址写的不对,或者资源地址写的对但权限不够,500 服务器页面错误
Django 02 简单注册页面的创建2
VanChaoi的博客
07-07 314
一、AJAX有的时候我们必须点击提交页面才告诉我们用户名重复,这样很影响用户体验,所以我们应当在输入密码的时候就要告诉我们用户名已存在我们需要使用ajax(ajax:jquery 是一种静态资源),不需要我们提交当我们输入密码的时候就可以告诉我们用户名存在1.什么是AJAX?AJAX=异步JavaScript 和XMLAJAX是一种用于创建快速动态网页的技术.通过在后台与服务器进行少量数据交接,A...
Django 用户认证系统：注册
weixin_33739541的博客
08-29 321
本教程为系列教程，为方便阅读，每篇教程开头列出全部教程的目录索引： 基本设置 拓展 User 模型 注册 登录 注销和页面跳转 修改密码 自定义认证后台 用户注册就是创建用户对象，将用户的个人信息保存到数据库里。回顾一下 Django 的 MVT 经典开发流程，对用户注册功能来说，首先创建用户模型（M），这一步我们已经完成了。编写注册视图函数（V），并将为视图函数绑定对应的 URL。编写...
跟着b站up主程序员小高搭Django框架
yangyang190的博客
07-21 53
在settings中注册app01，添加代码。在setting.py中注册数据库day08。在models.py中申明表结构，代码如下。创建项目新app，app01.
Django实现注册及登录（附源码）
weixin_51756038的博客
05-28 9632
这是一个基于Django的包含注册及登录功能的web应用程序。该项目虽只有登录和注册功能，但是有一个非常漂亮的前端页面。
B站武沛齐Django笔记和代码
07-19
https://www.bilibili.com/video/BV1NL41157ph 2022 B站最详细django3教程(django从入门到实践) 很适合刚学习django的同学 通过一个案例，把django的基本的templates，models，urls，from，modelfrom讲的清清楚楚，甚至还给了我们应用场景。
Django的用户登录和注册
陈十一yi
05-08 6446
前提:能成功安装基础的Django 创建应用并添加到项目中 python .\manage.py startapp user 创建存放模板的目录并添加到项目中 欢迎界面 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0"&g
使用django实现登录和注册功能的注意事项
weixin_64116813的博客
11-16 109
分别对GET请求 以及 POST 请求分别返回不同的页面 进行不同的操作。例如request.method可以得出此次请求使用的方法是什么。在view的视图函数中 可以打印自省以下request。
python（Django）之登录功能实现
m0_61885507的博客
03-19 1026
欢迎，<a href="#">{{ user }}</a> </li><li><a href="/logout/">退出</a> 自动化测试平台 密 码</a><br><a> 用户名：
推荐开源项目：Django基础登录注册系统
最新发布
gitblog_00021的博客
05-17 305
推荐开源项目：Django基础登录注册系统 项目地址:https://gitcode.com/egorsmkv/simple-django-login-and-register 在Web开发领域，安全、便捷的用户管理系统是每个网站或应用的核心部分。今天，我们向您推荐一个名为“Simple Django Login and Registration”的开源项目，它是一个基于Django框架构建的简单...
django搭建一个个人博客（Python全栈开发日记）第三天：登录注册
十一点必早睡的博客
05-04 155
【代码】django搭建一个个人博客（Python全栈开发日记）第三天：登录注册。
Django登陆注册页面的实现
qq_53075298的博客
09-25 674
视图函数 # 对get和post的两种方式一般用类视图的方式 # 第一步获取表单，看表单是从项目中传来还是从前端中传来 # 如果从项目中来，不需要传入值 # 入股从前端中来要看是get方式还是post方式传进来方式参数 # 把表单信息存入变量中 # 对前端传来的数据存入数据库中 class RegisterTest(View): def get(self, request): form = RegisterForm() # 把form表单传到视图中用变量的形式传入模板中 .
Django注册登录界面
jereying的博客
03-08 1497
在很多我们设计的程序中都会用到注册登录的界面，今天和大家分享一下我自己琢磨出来的一些流程，如果有用不妨收藏慢看。废话不多说马上开始。 这是我自己用的django框架下的代码，django是一个用python代码完成前后端交互的一个框架，非常实用。（顺带一提，django也有自带的admin系统，如果对权限有探讨的同学可以搜索） 1. RegisterPage.py def RegisterPage(request): if request.method == "POST": user
Django 用户注册页面实现步骤
学习笔记
05-12 1366
Step 1: 创建 app app 名称叫做 accounts, 创建app：python manage.py startapp accounts Step 2: 修改 setting.py 在列表INSTALLED_APPS 增加一行 accounts: # my_project/settings.py INSTALLED_APPS = [ 'django.cont...
django实现登陆注册功能
热门推荐
小树苗的博客
10-10 2万+
学习了好久django，今天才把登陆注册总结一下，不足之处还希望多多指出哦！ 先把我实现的效果截图给大家： 1.基础创建步骤不多讲，最终的框架结构如下： 2.在settings.py中写好相对应的代码，例如数据库的设置，模板文件的设置等等。 3.urls.py from django.conf.urls import
django登录注册html页面,Django实现页面注册登录界面
weixin_33557333的博客
06-10 1688
增加数据在acsign/models.py中创建用户数据：class Users(models.Model):u_name = models.CharField(max_length=10)u_password = models.CharField(max_length=255)u_ticket = models.CharField(max_length=30, null=True)在acsign...
Python Django科技网站制作教程：实战项目构建与功能详解
本教程是一份全面的科技网站制作指南，旨在通过Python和Django技术实现一个实际的科技型网站。教程依据的是《Python Web开发从入门到实战(Django+Bootstrap) 微课视频版》这本书，指导读者从零开始构建企业官网，...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值