目录

一、登录验证

三、增删改数据

四、登录检测和拦截

五、总结

码云地址在文末,blog:https://fabian4.gitee.io/47578.html

功能实现：

• 登录权限验证
• 登录状态检测
• 员工信息分页查询显示
• 多条件联合查询
• 增删改数据

一、登录验证

1. 创建管理员模型和用户模型

# user\models.py
from django.db import modelsclass User(models.Model):"""用户类"""id = models.AutoField(primary_key=True, db_column='id', verbose_name='编号')name = models.CharField(max_length=20, db_column='name', verbose_name='名字')gender = models.CharField(max_length=20, db_column='gender', verbose_name='性别')age = models.CharField(max_length=20, db_column='age', verbose_name='年龄')address = models.CharField(max_length=20, db_column='address', verbose_name='籍贯')qq = models.CharField(max_length=20, db_column='qq', verbose_name='QQ')email = models.CharField(max_length=20, db_column='email', verbose_name='邮箱')class Meta:db_table = 'user'class Admin(models.Model):"""管理员"""id = models.AutoField(primary_key=True, db_column='id', verbose_name='编号')username = models.CharField(max_length=20, db_column='username', verbose_name='用户名')password = models.CharField(max_length=20, db_column='password', verbose_name='密码')class Meta:db_table = 'manager'

2. 配置MySQL数据库

参考上一篇博客

https://blog.csdn.net/bandaoyu/article/details/105968112

3. 迁移数据模型

# 迁移 Django 内置的管理数据表
(venv)$ python manage.py migrate
# 生成我们的数据迁移文件
(venv)$ python manage.py makemigrations user
# 迁移我们的数据表
(venv)$ python manage.py migrate
3. 映射 URL

# UserSystem\urls.py
urlpatterns = [path('admin/', admin.site.urls),path('', include('user.urls')),
]# user\urls.py
urlpatterns = [# 登录的urlpath('login/', views.login, name='login'),# 获取图片验证码path('get_captcha/', views.get_captcha, name='get_captcha'),
]

4. 配置全局静态文件

# UserSystem\settings.py
STATIC_URL = '/static/'
STATICFILES_DIRS = [os.path.join(BASE_DIR, 'static'),
]

5. 配置全局默认基本 url

# user\context_processors.py
from UserSystem import settingsdef base_url(request):if settings.DEBUG:return {'BASE_URL': 'http://localhost:8000/'}# 注册到 UserSystem\settings.py
TEMPLATES = [{'BACKEND': 'django.template.backends.django.DjangoTemplates','DIRS': [os.path.join(BASE_DIR, 'templates')],'APP_DIRS': True,'OPTIONS': {'context_processors': ['django.template.context_processors.debug','django.template.context_processors.request','django.contrib.auth.context_processors.auth','django.contrib.messages.context_processors.messages',# 注册我们自己配置的文件'user.context_processors.base_url'],},},
]

6. 关闭 xss token

这是 Django 中为了避免存在跨站脚本攻击漏洞而对网页表单的强制要求，我们在开发过程中可以先将这个模块注释掉MIDDLEWARE = ['django.middleware.security.SecurityMiddleware','django.contrib.sessions.middleware.SessionMiddleware','django.middleware.common.CommonMiddleware',# 注释 网页表单验证组件# 'django.middleware.csrf.CsrfViewMiddleware','django.contrib.auth.middleware.AuthenticationMiddleware','django.contrib.messages.middleware.MessageMiddleware','django.middleware.clickjacking.XFrameOptionsMiddleware',
]

7. 编写前端页面

<!-- templates\login.html -->
<div class="container" style="width: 400px;"><h3 style="text-align: center;">管理员登录</h3><form action="/login/" method="post"><div class="form-group"><label for="username">用户名：</label><input type="text" name="username" class="form-control" id="username" placeholder="请输入用户名"/></div><div class="form-group"><label for="password">密码：</label><input type="password" name="password" class="form-control" id="password" placeholder="请输入密码"/></div><div class="form-inline"><label for="vcode">验证码：</label><input type="text" name="verifycode" class="form-control" id="verifycode" placeholder="请输入验证码" style="width: 120px;"/><a href="javascript:refreshCode()"><img src="{{pageContext.request.contextPath}}/get_captcha/" title="看不清点击刷新" id="vcode"/></a></div><hr/><div class="form-group" style="text-align: center;"><input class="btn btn btn-primary" type="submit" value="登录"></div></form><!-- 出错显示的信息框 -->{% if request.session.error %}<div class="alert alert-warning alert-dismissible" role="alert"><button type="button" class="close" data-dismiss="alert" ><span>&times;</span></button><strong>{{request.session.error}}</strong></div>{% endif %}</div>

8. 编写验证码生成

# user\captcha.py
import os
import randomfrom io import BytesIOfrom PIL import Image
from PIL import ImageFilter
from PIL.ImageDraw import Draw
from PIL.ImageFont import truetypefrom UserSystem.settings import BASE_DIRclass Bezier(object):"""贝塞尔曲线"""def __init__(self):self.tsequence = tuple([t / 20.0 for t in range(21)])self.beziers = {}def make_bezier(self, n):"""绘制贝塞尔曲线"""try:return self.beziers[n]except KeyError:combinations = pascal_row(n - 1)result = []for t in self.tsequence:tpowers = (t ** i for i in range(n))upowers = ((1 - t) ** i for i in range(n - 1, -1, -1))coefs = [c * a * b for c, a, b in zip(combinations,tpowers, upowers)]result.append(coefs)self.beziers[n] = resultreturn resultclass Captcha(object):"""验证码"""def __init__(self, width, height, fonts=None, color=None):self._image = Noneself._fonts = fonts if fonts else \[os.path.join(BASE_DIR, 'static/fonts', font).replace('\\', '/')for font in ['Sujeta.ttf', 'Sewer Sys.ttf']]self._color = color if color else random_color(0, 200, random.randint(220, 255))self._width, self._height = width, height@classmethoddef instance(cls, width=200, height=75):prop_name = f'_instance_{width}_{height}'if not hasattr(cls, prop_name):setattr(cls, prop_name, cls(width, height))return getattr(cls, prop_name)def background(self):"""绘制背景"""Draw(self._image).rectangle([(0, 0), self._image.size],fill=random_color(230, 255))def smooth(self):"""平滑图像"""return self._image.filter(ImageFilter.SMOOTH)def curve(self, width=4, number=6, color=None):"""绘制曲线"""dx, height = self._image.sizedx /= numberpath = [(dx * i, random.randint(0, height))for i in range(1, number)]bcoefs = Bezier().make_bezier(number - 1)points = []for coefs in bcoefs:points.append(tuple(sum([coef * p for coef, p in zip(coefs, ps)])for ps in zip(*path)))Draw(self._image).line(points, fill=color if color else self._color, width=width)def noise(self, number=50, level=2, color=None):"""绘制扰码"""width, height = self._image.sizedx, dy = width / 10, height / 10width, height = width - dx, height - dydraw = Draw(self._image)for i in range(number):x = int(random.uniform(dx, width))y = int(random.uniform(dy, height))draw.line(((x, y), (x + level, y)),fill=color if color else self._color, width=level)def text(self, captcha_text, fonts, font_sizes=None, drawings=None, squeeze_factor=0.75, color=None):"""绘制文本"""color = color if color else self._colorfonts = tuple([truetype(name, size)for name in fontsfor size in font_sizes or (65, 70, 75)])draw = Draw(self._image)char_images = []for c in captcha_text:font = random.choice(fonts)c_width, c_height = draw.textsize(c, font=font)char_image = Image.new('RGB', (c_width, c_height), (0, 0, 0))char_draw = Draw(char_image)char_draw.text((0, 0), c, font=font, fill=color)char_image = char_image.crop(char_image.getbbox())for drawing in drawings:d = getattr(self, drawing)char_image = d(char_image)char_images.append(char_image)width, height = self._image.sizeoffset = int((width - sum(int(i.size[0] * squeeze_factor)for i in char_images[:-1]) -char_images[-1].size[0]) / 2)for char_image in char_images:c_width, c_height = char_image.sizemask = char_image.convert('L').point(lambda i: i * 1.97)self._image.paste(char_image,(offset, int((height - c_height) / 2)),mask)offset += int(c_width * squeeze_factor)@staticmethoddef warp(image, dx_factor=0.3, dy_factor=0.3):"""图像扭曲"""width, height = image.sizedx = width * dx_factordy = height * dy_factorx1 = int(random.uniform(-dx, dx))y1 = int(random.uniform(-dy, dy))x2 = int(random.uniform(-dx, dx))y2 = int(random.uniform(-dy, dy))warp_image = Image.new('RGB',(width + abs(x1) + abs(x2), height + abs(y1) + abs(y2)))warp_image.paste(image, (abs(x1), abs(y1)))width2, height2 = warp_image.sizereturn warp_image.transform((width, height),Image.QUAD,(x1, y1, -x1, height2 - y2, width2 + x2, height2 + y2, width2 - x2, -y1))@staticmethoddef offset(image, dx_factor=0.1, dy_factor=0.2):"""图像偏移"""width, height = image.sizedx = int(random.random() * width * dx_factor)dy = int(random.random() * height * dy_factor)offset_image = Image.new('RGB', (width + dx, height + dy))offset_image.paste(image, (dx, dy))return offset_image@staticmethoddef rotate(image, angle=25):"""图像旋转"""return image.rotate(random.uniform(-angle, angle),Image.BILINEAR, expand=1)def generate(self, captcha_text='', fmt='PNG'):"""生成验证码(文字和图片)"""self._image = Image.new('RGB', (self._width, self._height), (255, 255, 255))self.background()self.text(captcha_text, self._fonts,drawings=['warp', 'rotate', 'offset'])self.curve()self.noise()self.smooth()image_bytes = BytesIO()self._image.save(image_bytes, format=fmt)return image_bytes.getvalue()def pascal_row(n=0):"""生成Pascal三角第n行"""result = [1]x, numerator = 1, nfor denominator in range(1, n // 2 + 1):x *= numeratorx /= denominatorresult.append(x)numerator -= 1if n & 1 == 0:result.extend(reversed(result[:-1]))else:result.extend(reversed(result))return result
def random_color(start=0, end=255, opacity=255):"""获得随机颜色"""red = random.randint(start, end)green = random.randint(start, end)blue = random.randint(start, end)if opacity is None:return red, green, bluereturn red, green, blue, opacity

9. 编写视图函数
# user\views.py
# 登录函数

def login(request):if request.method == 'GET':return render(request, 'login.html')if request.method == 'POST':verifycode = request.POST.get('verifycode')if verifycode == request.session.get('captcha'):username = request.POST.get('username')password = request.POST.get('password')try:login_user = models.Admin.objects.get(username=username, password=password)request.session['login_user'] = login_user.usernamereturn render(request, 'index.html')except ObjectDoesNotExist:request.session['error'] = '账号或密码错误'return render(request, 'login.html')else:request.session['error'] = '验证码错误'return render(request, 'login.html')ALL_CHARS = '0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ'

# 获取验证码文本

def get_captcha_text(length=4):selected_chars = random.choices(ALL_CHARS, k=length)return ''.join(selected_chars)# 返回验证码文件
def get_captcha(request):"""验证码"""captcha_text = get_captcha_text()request.session['captcha'] = captcha_textimage_data = Captcha.instance().generate(captcha_text)print(captcha_text)return HttpResponse(image_data, content_type='image/png')

二、分页查询和多条件查询
1.前端页面

<div>{{request.session.login_user}}欢迎您</div>
<div class="container"><h3 style="text-align: center">用户信息列表</h3><div style="float: left;"><form class="form-inline" action="/find_all/?currentPage=1" method="post"><div class="form-group"><label for="exampleInputName2">姓名</label><input type="text" name="name" value="{{ page_info.name|default_if_none:"" }}" class="form-control" id="exampleInputName2" ></div><div class="form-group"><label for="exampleInputName3">籍贯</label><input type="text" name="address" value="{{ page_info.address|default_if_none:"" }}" class="form-control" id="exampleInputName3" ></div><div class="form-group"><label for="exampleInputEmail2">邮箱</label><input type="text" name="email" value="{{ page_info.email|default_if_none:"" }}" class="form-control" id="exampleInputEmail2"  ></div><button type="submit" class="btn btn-default">查询</button></form></div><div style="float: right; margin: 5px"><td colspan="8" align="center"><a class="btn btn-primary" href="{{ RequestContext.BASE_URL }}/add/">添加联系人</a></td><td colspan="8" align="center"><a class="btn btn-primary" href="javascript:void(0);" id="delSelected">删除选中</a></td></div><form id="form" action="/delSelected/" method="post"><table border="1" class="table table-bordered table-hover"><tr class="success"><th><input type="checkbox" id="firstCb"></th><th>编号</th><th>姓名</th><th>性别</th><th>年龄</th><th>籍贯</th><th>QQ</th><th>邮箱</th><th>操作</th></tr>{% for user in user_list %}<tr><th><input type="checkbox" name="uid" value="{{ user.pk }}"></th><td>{{ forloop.counter }}</td><td>{{ user.fields.name }}</td><td>{{ user.fields.gender }}</td><td>{{ user.fields.age }}</td><td>{{ user.fields.address }}</td><td>{{ user.fields.qq }}</td><td>{{ user.fields.email }}</td><td><a class="btn btn-default btn-sm" href="{{ RequestContext.BASE_URL }}/findUserById/?id={{ user.pk }}">修改</a>&nbsp;<a class="btn btn-default btn-sm" href="javascript:deleteUser({{ user.pk }});">删除</a></td></tr>{% endfor %}</table></form><div><nav aria-label="Page navigation"><ul class="pagination"><li><a href="{{ RequestContext.BASE_URL }}/find_all/?currentPage={{ page_info.currentPage|add:-1 }}&name={{ page_info.name }}&address={{ page_info.address }}&email={{ page_info.email }}" aria-label="Previous"><span aria-hidden="true">&laquo;</span></a></li>{% for i in page_info.pages %}{% if i == page_info.currentPage %}<li class="active"><a href="{{ RequestContext.BASE_URL }}/find_all/?currentPage={{ i }}&name={{ page_info.name }}&address={{ page_info.address }}&email={{ page_info.email }}">{{ i }}</a></li>{% endif %}{% if i != page_info.currentPage %}<li><a href="{{ RequestContext.BASE_URL }}/find_all/?currentPage={{ i }}&name={{ page_info.name }}&address={{ page_info.address }}&email={{ page_info.email }}">{{ i }}</a></li>{% endif %}{% endfor %}<li><a href="{{ RequestContext.BASE_URL }}/find_all/?currentPage={{ page_info.currentPage|add:1 }}&name={{ page_info.name }}&address={{ page_info.address }}&email={{ page_info.email }}" aria-label="Next"><span aria-hidden="true">&raquo;</span></a></li><span style="font-size: 25px;margin-left: 5px;">共{{ page_info.total }}条记录，共{{ page_info.totalPage }}页</span></ul></nav></div>
</div>

2. 分页展示

这里我们采用一个 django 的 Paginator 类来实现自动的分页结果显示# 查询所有并返回序列化队列
# 将查询条件封装到一个字典作为参数传入查询方法
user_list = serializers.serialize("json", models.User.objects.filter(**search_dict))
# 将队列反序列化以便渲染到页面上
user_list = json.loads(user_list)
# 每10个为1页
p = Paginator(user_list, 10)
# 以字典格式返回给 list.html 进行渲染
return render(request, "list.html", {'user_list': p.page(current_page).object_list, 'page_info': page_info})

3. 前端参数获取

# 如果是通过 get 方法
if request.method == 'GET':name = request.GET.get("name", default='')address = request.GET.get("address", default='')email = request.GET.get("email", default='')current_page = int(request.GET.get("currentPage", default=1))
# 如果是通过 post 方法
if request.method == 'POST':name = request.POST.get("name", default='')address = request.POST.get("address", default='')email = request.POST.get("email", default='')current_page = int(request.POST.get("currentPage", default=1))

4. 参数处理封装和返回
# 将查询条件封装为字典

search_dict = dict()# 判空防止误传if name:search_dict['name'] = nameif address:search_dict['address'] = addressif email:search_dict['email'] = emailuser_list = serializers.serialize("json", models.User.objects.filter(**search_dict))user_list = json.loads(user_list)p = Paginator(user_list, 10)# 防止出现参数超出范围的情况if current_page < 1:current_page = 1if current_page > p.num_pages:current_page = p.num_pages# 将页码封装到一个列表pages = []i = 1while i <= p.num_pages:pages.append(i)i += 1# 将所有信息封装为字典返回给前端page_info = {"total": len(user_list),"totalPage": p.num_pages,"currentPage": current_page,"name": name,"address": address,"email": email,"pages": pages}return render(request, "list.html", {'user_list': p.page(current_page).object_list, 'page_info': page_info})

三、增删改数据

1. 配置 url 路径

# user\urls.py
urlpatterns = [path('login/', views.login, name='login'),path('get_captcha/', views.get_captcha, name='get_captcha'),path('find_all/', views.find_all, name='find_all'),path('add/', views.add, name='add'),path('findUserById/', views.findUserById, name='findUserById'),path('update/', views.update, name='update'),path('delUser/', views.delUser, name='delUser'),path('delSelected/', views.delSelected, name='delSelected'),
]

2. 前端界面

<!-- add.html -->
<div>{{ loginUser.name }}欢迎您</div>
<div class="container"><center><h3>添加联系人页面</h3></center><form action="{{ RequestContext.BASE_URL }}/add/" method="post"><div class="form-group"><label for="name">姓名：</label><input type="text" class="form-control" id="name" name="name" placeholder="请输入姓名"></div><div class="form-group"><label>性别：</label><input type="radio" name="gender" value="男" checked="checked"/>男<input type="radio" name="gender" value="女"/>女</div><div class="form-group"><label for="age">年龄：</label><input type="text" class="form-control" id="age" name="age" placeholder="请输入年龄"></div><div class="form-group"><label for="address">籍贯：</label><input type="text" class="form-control" id="address" name="address" placeholder="请输入籍贯"></div><div class="form-group"><label for="qq">QQ：</label><input type="text" class="form-control" id="qq" name="qq" placeholder="请输入QQ号码"/></div><div class="form-group"><label for="email">Email：</label><input type="text" class="form-control" id="email" name="email" placeholder="请输入邮箱地址"/></div>        <div class="form-group" style="text-align: center"><input class="btn btn-primary" type="submit" value="提交" /><input class="btn btn-default" type="reset" value="重置" /><a class="btn btn-default" href="list.jsp" role="button">返回</a></div></form>
</div>

<!-- update.html -->
<div>{{request.session.login_user}}欢迎您</div><div class="container" style="width: 400px;"><h3 style="text-align: center;">修改联系人</h3><form action="{{ RequestContext.BASE_URL }}/update/" method="post"><!--  隐藏域 提交id--><input type="hidden" name="id" value="{{ u.pk }}"><div class="form-group"><label for="name">姓名：</label><input type="text" class="form-control" id="name" name="name" value="{{ u.fields.name }}" placeholder="请输入姓名" /></div><div class="form-group"><label>性别：</label>{% if u.fields.gender == '男' %}<input type="radio" name="gender" value="男" checked />男<input type="radio" name="gender" value="女"/>女{% endif %}{% if u.fields.gender == '女' %}<input type="radio" name="gender" value="男"/>男<input type="radio" name="gender" value="女" checked />女{% endif %}</div><div class="form-group"><label for="age">年龄：</label><input type="text" class="form-control" id="age" value="{{ u.fields.age }}" name="age" placeholder="请输入年龄" /></div><div class="form-group"><label for="address">籍贯：</label><input type="text" class="form-control" id="address" name="address" value="{{ u.fields.address }}" placeholder="请输入籍贯" /></select></div><div class="form-group"><label for="qq">QQ：</label><input type="text" class="form-control" id="qq" value="{{ u.fields.qq }}" name="qq" placeholder="请输入QQ号码"/></div><div class="form-group"><label for="email">Email：</label><input type="text" class="form-control" id="email" value="{{ u.fields.email }}" name="email" placeholder="请输入邮箱地址"/></div>             <div class="form-group" style="text-align: center"><input class="btn btn-primary" type="submit" value="提交" /><input class="btn btn-default" type="reset" value="重置" /><a class="btn btn-default" href="{{ RequestContext.BASE_URL }}/find_all/?currentPage=1" role="button">返回</a></div></form></div></body>

3. 后端响应

# user\views.py
def add(request):if request.method == 'GET':return render(request, "add.html")if request.method == 'POST':models.User.objects.create(name=request.POST.get('name'),gender=request.POST.get('gender'),age=request.POST.get('age'),address=request.POST.get('address'),qq=request.POST.get('qq'),email=request.POST.get('email'))return redirect("find_all")def findUserById(request):no = request.GET.get("id")user = serializers.serialize("json", models.User.objects.all().filter(id=no))user = json.loads(user)return render(request, 'update.html', {'u': user[0]})def update(request):no = request.POST.get("id")models.User.objects.filter(id=no).update(name=request.POST.get('name'),gender=request.POST.get('gender'),age=request.POST.get('age'),address=request.POST.get('address'),qq=request.POST.get('qq'),email=request.POST.get('email'))return redirect("find_all")def delUser(request):no = request.GET.get("id")models.User.objects.filter(id=no).delete()return redirect("find_all")
def delSelected(request):no = request.POST.getlist("uid")for n in no:models.User.objects.filter(id=n).delete()return redirect("find_all")

四、登录检测和拦截

1. 编写拦截中间件

# user\middleware.py
from django.shortcuts import HttpResponseRedirecttry:from django.utils.deprecation import MiddlewareMixin
except ImportError:MiddlewareMixin = objectclass SimpleMiddleware(MiddlewareMixin):@staticmethoddef process_request(request):# 只对两个路径放行if request.path != '/login/' and request.path != '/get_captcha/':if request.session.get('user', None):passelse:return HttpResponseRedirect('/login/')

2. 注册中间件

# UserSystem\settings.py
MIDDLEWARE = ['django.middleware.security.SecurityMiddleware','django.contrib.sessions.middleware.SessionMiddleware','django.middleware.common.CommonMiddleware',# 'django.middleware.csrf.CsrfViewMiddleware','django.contrib.auth.middleware.AuthenticationMiddleware','django.contrib.messages.middleware.MessageMiddleware','django.middleware.clickjacking.XFrameOptionsMiddleware',# 注册自己编写的中间件'user.middleware.SimpleMiddleware'
]

五、总结

基于 Django 框架搭建的后台还是具有很多鲜明的特色的
注意 Django自带的引擎模板的语法，或者也可以更换其他模板引擎
Django 模板引擎中过滤器的使用
Django中间件的自定义和注册
源码已上传码云
原文链接：https://blog.csdn.net/qq_43733805/article/details/105964031