石家庄网站seo服务,网站设计方案图,系统软件有哪些?,仿摄影网站各位小伙伴们好久不见#xff0c;2024年即将到来#xff0c;小编在这里提前祝大家新的一年快快乐乐#xff0c;能够事业有成#xff0c;学习顺心#xff0c;家庭和睦#xff0c;事事顺利。 今天我们本篇要实现的是一个登录界面的实现#xff0c;其实登录界面的实现看着挺… 各位小伙伴们好久不见2024年即将到来小编在这里提前祝大家新的一年快快乐乐能够事业有成学习顺心家庭和睦事事顺利。 今天我们本篇要实现的是一个登录界面的实现其实登录界面的实现看着挺好实现的其实里面需要注意到的点还是很多的因此我可能会需要多篇博客进行一个讲解接下来我们开始本次的登录界面的实现。 大家可以从上面的登录界面可以发现我们本次需要完成的是用户在输入账号和密码后然后再输入一个验证码后点击登录就能进入到我们的界面中在这里我们用户输入的账号和密码是与我们上一篇博客是挂钩的如果有不明白的朋友可以去看一下。
Python实现员工管理系统Django页面版 ) 六-CSDN博客 其次我们对于不同的等级的用户进去是需要展示不同的页面的就比如员工他就只能看看他的同事是哪些还有他的任务是什么他也不能进行添加删除修改操作其实这个板块是属于用户权限的划分我们在本章博客先不做这个我们把这个伏笔埋一下。 好好好也不多说这么多啦咱先把基础的模板搞定到哪步咱再说哪步。 在之前我们都是使用model.ModelFrom来对数据库中的数据进行一个修饰一般来讲我们在对数据进行操作的时候我们用这个是比较方便的那对于我们并不需要对数据库的数据进行操作的时候我们有没有更简单的方式来解决呢下面我们来介绍一下model.Form。 model.form是Django中的一个模块用于创建和处理表单。它是一个基于Model的表单可以很方便地与数据库模型进行交互。 下面我们在我们的views文件夹下新建一个login.py 我们可以从最上面的展示效果来看我们需要三个字段分别是用户名密码和验证码因此我们需要新建一个Form类来创建这三个字段。
login.py
from django import forms
from project_manage.utils.encryption import md5class LoginForm(forms.Form):username forms.CharField(label用户,widgetforms.TextInput(attrs{class:from-control,autocomplete:off}))password forms.CharField(label用户,widgetforms.PasswordInput(attrs{class:from-control,autocomplete:off}))code forms.CharField(label验证码,widgetforms.TextInput(attrs{class:from-control,autocomplete:off}))def clean_password(self):pwd self.cleaned_data.get(password)return md5(pwd) 其中的md5是我们在上一篇博客中对密码的一个加密函数不了解的朋友可以去看一下。我们会发现其实Form和ModelForm的使用方式是差不多的只是Form我们用的更加简单。那个钩子方法会将我们输入的密码进行一个md5加密并返回给数据库。 下面我们来编写我们的模块函数由于这次的登录界面对比之前的那些模板方法可能比较难理解我就分开写方便大家理解。
首先我们在访问登录界面是一个get请求访问那他就会给我们返回一个登录界面的展示
login.py
def login(request):if request.method GET:form LoginForm()return render(request,login.html,{form:form})
在模板文件中创建一个login.html文件
login,html
{% load static %}
html langen
headmeta charsetUTF-8title登录页/titlelink relstylesheet href{% static bootstrap-3.4.1-dist/css/bootstrap.min.css %}style.account {width: 450px;border: 2px solid #2196f300;background-color: #fff8d240;margin-left: auto;margin-right: auto;border-radius: 5%;padding: 20px;margin-top: 50px;box-shadow: 7px 11px 5px #9e9e9e;}/style
/head
body
div classaccountform methodpost novalidate{% csrf_token %}div classform-grouplabel账号/label{{ form.username }}span stylecolor: red{{ form.username.errors.0 }}/span/divdiv classform-grouplabel密码/label{{ form.password }}span stylecolor: red{{ form.password.errors.0 }}/span/divdiv classform-groupdiv classrowdiv classcol-xs-7label验证码/label{{ form.code }}span stylecolor: red{{ form.code.errors.0 }}/span/divdiv classcol-xs-5button styleborder: noneimg src/image/code//button/div/div/divbutton typesubmit classbtn btn-success登录/button/form
/div/body
/html 下面我们先对验证码进行一个处理验证码其实就是往我们的页面插入一张图片然后让用户进行输入图片中的信息即可如果输入错误提示验证码错误。
在utils文件夹下创建一个code.py用于存放验证码 code.py
# -*- coding:utf-8 -*-
from PIL import Image,ImageDraw,ImageFont
from random import randint,choicedef create_captcha_content():# 创建一张图片模式为RGB模式 全白img Image.new(modeRGB,size(110,40),color(255,255,255))# 创建一个画笔draw ImageDraw.Draw(img,modeRGB)# 设置字体font ImageFont.truetype(rC:\Windows\Fonts\simhei.ttf,size30)# 选择图片内容text ABCDEFG123456789captcha_text for i in range(4):captcha_text choice(text)x 15for i in captcha_text:R randint(0,255)G randint(0,255)B randint(0,255)draw.text((x, 3),texti,fontfont,fillfrgb({R},{G},{B}))# 调整下一个字的间隔x 20# 在图像中展示线段作为干扰用户输入数据的方式for i in range(1, randint(3,6)):x1, y1 randint(0,100),randint(0,30)x2, y2 randint(0,100),randint(0,30)R str(randint(0,255))G str(randint(0,255))B str(randint(0,255))draw.line((x1,y1,x2,y2),fillfrgb({R},{G},{B}),width2)# 在图像中展示散点作为干扰用户输入数据的方式for i in range(1,randint(100,150)):x1,y1 randint(0,100),randint(0,30)R str(randint(0,255))G str(randint(0,255))B str(randint(0,255))draw.point((x1,y1),fillfrgb({R},{G},{B}))# 返回图像和验证码return [img,captcha_text] 在这里就不对里面的代码进行解释了不过需要注意的是对于字体的选择我是使用电脑自带的字体下面我开介绍一下如何使用电脑自带的字体。
进入C盘 ----》 打开Windows文件 找到Fonts文件夹 然后进去后随便找一个觉得合适的字体然后右击选择属性找到文件的路径即可 好的现在回到我们的模块函数 我们需要将把验证码通过图像的形式插入到我们的界面中去因此我们需要封装我们的验证码模块函数我们在进行页面刷新的时候验证码也能跟着刷新
login.py
from io import BytesIO
def image_code(request):image,text create_captcha_content()# 将验证码的值放入到session中request.session[image_code] text# 60s的时效性request.session.set_expiry(60)stream BytesIO()image.save(stream,png)return HttpResponse(stream.getvalue()) 其中的session是我们用户和服务器之间的一个会话我们可以将用户的一些信息放入到这个session中方便我们服务器进行后续的判断查找。然后我们会在里面设置一个时效性类似与cookie在这段时间后服务器就会将该用户信息删除如果服务器检查到存在该用户的信息的话那么用户下次进入时就不用进行登录。
配置验证码路由
urls.py # 验证码path(image/code/,login.image_code), 我们在进行用户登录的时候首先是需要验证我们输入的验证码是否与图像展示的验证码一样然后再到数据库中校验是否存在这个用户存在即返回界面不存在就给出错误信息。
login.py
def login(request):if request.method GET:form LoginForm()return render(request,login.html,{form:form})form LoginForm(datarequest.POST)if form.is_valid():# 验证码验证user_input_code form.cleaned_data.pop(code)# 没有值设置为空code request.session.get(image_code,)# 对于验证码不区分大小写if user_input_code.upper() ! code.upper():form.add_error(code,验证码错误)return render(request,login.html,{form:form})# 账号密码验证数据库校验admin_object models.Admin.objects.filter(**form.cleaned_data).first()if not admin_object:# print(form.cleaned_data)form.add_error(password,用户名或者密码错误)return render(request,login.html,{form:form})# 生成字符串存储到cookie和session当中去info {id:admin_object.id,name:admin_object.username,role:admin_object.role}request.session[info] info# 时效性 ------ 一个点request.session.set_expiry(60 * 60 * 24)# request.session.set_expiry(10)return redirect(/)return render(request,login.html,{form:form}) 用户退出模块函数
def logout(request):request.session.clear()return redirect(/login/) 其实用户退出很简单只需要把用户当前的session清空即可然后返回到登录界面
配置路由
urls # 登录页面path(login/,login.login),# 退出登录path(logout/,login.logout), 其实做到这里差不多登录界面就完成了但是里面还没有做到用户权限的划分我们在后面的博客进行讲解吧。最后还是祝大家新的一年快乐
