文章目录
- 前言
- 一、用户数据提交
- 1. 表单
- 2. 校验数据
- 3. 模版文件
- 1. wait_start
- 2. user_register
- 二、验证
- 1. 发送邮件
- 1. 注册163邮箱后登录并设置
- 2. 开启IMAP/SMTP服务, IMAP/SMTP服务
- 3. 新增授权密码
- 2.邮箱内容
- 3.点击注册
- 4.发送邮件
- 5. 激活账号
- 1. 完善激活功能 -- user_active
- 2. 完善登录功能的界面
- 3. 用户登录校验模块
- 4. 前端文件
- 1. user_login
- 2. 404页面
- 3. wait_start
前言
在上一节我们实现了用户注册的基础页面,但是作为用户注册页面,需要有一定的基本功能,否则就会出现大量冗杂信息,比如一个人可以注册多个用户,所以这时候我们就需要设置一个用户的验证页面,比如验证码等等!!
一、用户数据提交
此时注册页面已经能够展示出来, 当我们输入内容点击注册时, 怎样对数据进行校验, 同时怎样真正的将数据注册到咱们的博客里面去呢?
1. 表单
- 通过表单可以快速帮我们对数据进行校验以及错误时的反馈
- 在 users app文件夹里面创建一个 forms.py 文件, 然后在里面创建表单
from django import formsclass RegisterForm(forms.Form):"""用户注册的表单: 当用户点击注册时, 可以通过我们所写的表单字段来对数据进行校验email: 用来校验用户提交的邮箱, EmailField(forms中定义的邮箱类型), required(保存用户提交的数据不能为空), error_messages(如果有错误, 则根据字典中错误的key来提示对应信息)password: 用来校验用户提交的密码, CharField(forms中定义的字符串类型)nick_name: 用来校验用户提交的名字"""email = forms.EmailField(required=True, error_messages={'required': '请填写邮箱', 'invalid': '请输入有效的邮箱'})password = forms.CharField(required=True, error_messages={'required': '请输入密码'})nick_name = forms.CharField(required=True, error_messages={'required': '请输入昵称'})
2. 校验数据
- 表单已经写完, 可以在视图文件中通过表单对前端注册所提交的数据进行校验
from django.shortcuts import render
from .models import UserProfile
from .forms import RegisterForm
def user_register(request):"""用户注册: 当进入到此路由应该显示注册页面, 但我们提交注册的数据时应该对数据进行处理所以可以根据不同的请求方法来做不同的请求事件"""if request.method == 'GET':# 如果是get请求则直接进入到注册页面return render(request, 'user_register.html')else:# 如果是post请求, 则代表是点击了注册进行提交数据register_form = RegisterForm(request.POST) # 生成表单进行验证if register_form.is_valid(): # 调用forms表单的方法来校验# 如果校验正确, 获取前端提交的数据email = register_form.cleaned_data.get('email')pwd = register_form.cleaned_data.get('password')nick_name = register_form.cleaned_data.get('nick_name')# 在用户类当中查询当前用户是否存在, 因为将email保存到username字段, 所以通过这样来查询数据user = UserProfile.objects.filter(username=email)# 如果能够查询到数据, 就代表该邮箱已经注册, 查询不到代表该邮箱还没注册if user:# 如果用户存在, 则回到注册页面, 同时给于一定的提示, 该字符串通过模板语言传递到模板当中去return render(request, 'user_register.html', {'msg': '用户名已存在'})else:# 如果用户不存在则保存信息user = UserProfile()user.username = emailuser.email = emailuser.nick_name = nick_nameuser.set_password(pwd) # 将密码加密后保存user.save()return render(request, 'wait_start.html')else:# 如果校验错误, 就代表我们提交的数据不符合表单的要求, 则回到注册页面, 然后通过表单将错误信息展示到页面上return render(request, 'user_register.html', {'register_form':register_form})
3. 模版文件
1. wait_start
<!doctype html>
<html lang="zh-CN">
<head><meta charset="utf-8"><meta name="renderer" content="webkit"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><title>快去激活</title><link rel="stylesheet" type="text/css" href="/static/css/bootstrap.min.css"><link rel="stylesheet" type="text/css" href="/static/css/nprogress.css"><link rel="stylesheet" type="text/css" href="/static/css/style.css"><link rel="stylesheet" type="text/css" href="/static/css/font-awesome.min.css"><link rel="apple-touch-icon-precomposed" href="/static/images/icon.png"><link rel="shortcut icon" href="/static/images/favicon.ico"><script src="/static/js/jquery-2.1.4.min.js"></script><script src="/static/js/nprogress.js"></script><script src="/static/js/jquery.lazyload.min.js"></script><!--[if gte IE 9]><script src="/static/js/jquery-1.11.1.min.js" type="text/javascript"></script><script src="/static/js/html5shiv.min.js" type="text/javascript"></script><script src="/static/js/respond.min.js" type="text/javascript"></script><script src="/static/js/selectivizr-min.js" type="text/javascript"></script><![endif]--><!--[if lt IE 9]><script>window.location.href = 'upgrade-browser.html';</script><![endif]--><style type="text/css">.panel {padding: 80px 20px 0px;min-height: 400px;cursor: default;}.text-center {margin: 0 auto;text-align: center;border-radius: 10px;max-width: 900px;-moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, .3);-webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, .3);box-shadow: 0px 0px 5px rgba(0, 0, 0, .1);}.float-left {float: left !important;}.float-right {float: right !important;}img {border: 0;vertical-align: bottom;}h2 {padding-top: 20px;font-size: 20px;}.padding-big {padding: 20px;}.alert {border-radius: 5px;padding: 15px;border: solid 1px #ddd;background-color: #f5f5f5;}</style>
</head>
<body class="user-select">
<header class="header"><nav class="navbar navbar-default" id="navbar"><div class="container"><div class="header-topbar hidden-xs link-border"><ul class="site-nav topmenu"><!--<li><a href="#">标签云</a></li>--><!--<li><a href="#" rel="nofollow">读者墙</a></li>--><!--<li><a href="#" title="RSS订阅">--><!--<i class="fa fa-rss">--><!--</i> RSS订阅--><!--</a></li>--></ul>人生苦短, 我用Python</div><div class="navbar-header"><button type="button" class="navbar-toggle collapsed" data-toggle="collapse"data-target="#header-navbar" aria-expanded="false"><span class="sr-only"></span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><h1 class="logo hvr-bounce-in"><a href="#" title=""><img src="/static/images/logo.png" alt=""></a></h1></div><div class="collapse navbar-collapse" id="header-navbar"><form class="navbar-form visible-xs" method="post"><div class="input-group"><input type="text" name="keyword" class="form-control" placeholder="请输入关键字" maxlength="20"autocomplete="off"><span class="input-group-btn"><button class="btn btn-default btn-search" name="search" type="submit">搜索</button></span></div></form><ul class="nav navbar-nav navbar-right"><li><a data-cont="但尽人事 莫问前程" title="但尽人事 莫问前程" href="#">首页</a></li><li><a data-cont="python" title="" href="#"></a></li></ul></div></div></nav>
</header>
<section class="container"><div class="panel"><div class="text-center"><h2><stong>已发送激活链接到邮箱,请去激活! o(╥﹏╥)o</stong></h2><div class="padding-big"><a href="#" class="btn btn-primary">返回首页</a><div class="widget widget_search"><form class="navbar-form" action=""><div class="input-group"><input type="text" name="keyword" class="form-control" size="35" placeholder="请输入关键字"maxlength="15" autocomplete="off"><span class="input-group-btn"><button class="btn btn-default btn-search" type="submit">搜索</button></span></div></form></div></div></div></div>
</section>
<footer class="footer"><div class="container"><p>Copyright © 2022.知吾所想 予吾所好-Allen</p></div><div id="gotop" style="display: block;"><a class="gotop"></a></div>
</footer>
<script src="/static/js/bootstrap.min.js"></script>
<script src="/static/js/jquery.ias.js"></script>
<script src="/static/js/scripts.js"></script>
</body>
</html>
2. user_register
<!DOCTYPE html>
{% load static %}
<html>
<head><meta charset="utf-8"><link href="/static/css/reglogin.css" rel='stylesheet' type='text/css'/><meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<div class="main"><div class="header"><h1>注册一个用户!</h1></div><p></p><form action="{% url 'user_register' %}" method="post">{% csrf_token %}<ul class="left-form"><h2>注册:</h2>{# 第一个表单 #}<li><input type="text" placeholder="请输入您的邮箱" name="email"/><div class="clear"></div></li><div style="color: red">{{ register_form.email.errors.0 }}</div>{# 第二个表单 #}<li><input type="password" placeholder="请输入密码" name="password"/><div class="clear"></div></li><div style="color: red">{{ register_form.password.errors.0 }}</div>{# 第三个表单 #}<li><input type="text" placeholder="请输入您的昵称" name="nick_name"/><div class="clear"></div></li><div style="color: red">{{ register_form.nick_name.errors.0 }}</div><input type="submit" value="注册"><div class="clear"></div></ul><div class="clear"></div></form><h3 style="width: 200px;height: 30px;margin: auto;color: red;text-align: center">{{ msg }}</h3>
</div>
</body>
</html>
二、验证
1. 发送邮件
- 登录博客需要激活此账号才行, 所以当我们注册账号时, 可以给该邮箱发送一封邮件, 只有用户点击该邮件后才能激活成功
- Django中内置了邮件发送功能,被定义在django.core.mail模块中。发送邮件需要使用SMTP服务器,常用的免费服务器有:163, 126, QQ,下面以163邮件为例
1. 注册163邮箱后登录并设置
2. 开启IMAP/SMTP服务, IMAP/SMTP服务
3. 新增授权密码
新增授权密码之后记得保存授权密码,一定不要忘记,不然需要重新开启,授权密码会保存180天
2.邮箱内容
在项目文件夹下创建一个utils文件夹, 该文件夹下放一些工具方法, 然后在该文件夹下创建一个 send_verify_code.py 文件, 用来写发送邮箱验证的代码
# coding:utf-8
import time
import hashlib
from django.core.mail import send_mail
from django.conf import settings
from users.models import VerifyCodeEmaildef make_sign():'''生成一个加密的字符串时间戳 + Django密钥,并且通过md5进行加密:return:'''times = str(time.time())sign_str = times + settings.SECRET_KEYmd5 = hashlib.md5()md5.update(sign_str.encode())sign = md5.hexdigest()return signdef send_verify_email(to_email):'''发送验证邮件为了保证唯一性,该邮件只能是某一用户的激活邮件,这邮件后面的参数是通过加密来得到的一个字符串:param to_email::return:'''sign = make_sign()verify_url = '点击链接激活账号\n http://127.0.0.1:8000/user_active?sign=' + signverify_code = VerifyCodeEmail()verify_code.email = to_emailverify_code.code = signverify_code.code_type = 1verify_code.save()subject = '邮箱验证'html_message = '<p>尊敬的用户您好!</p>' \'<p>感谢您使用此网站。</p>' \'<p>您的邮箱为:%s 。请点击此链接激活您的邮箱:</p>' \'<p><a href="%s">%s<a></p>' % (to_email, verify_url, verify_url)# 调用Django提供的方法来发送邮件send_mail(subject, "", settings.EMAIL_FROM, [to_email], html_message=html_message)
3.点击注册
4.发送邮件
之后你注册时填写的邮箱就会收到下面这样的一封邮件
之后点击链接进行激活之后就可以完成账号的注册,并可以登录使用
5. 激活账号
这一步点击发送到邮箱的链接即可激活账号,账号激活成功之后会显示登录页面进行登录
1. 完善激活功能 – user_active
相关包自己要到的时候可以使用快捷键Alt+enter进行添加
# user/views
def user_active(request):# 拿到激活链接上的密钥sign = request.GET.get('sign')# 如果拿到了密钥则进行下面的激活操作if sign:# 查看校验类里面是否有数据verify_code = VerifyCodeEmail.objects.filter(code=sign)# 如果有,则对用户进行激活操作if verify_code:# 拿到当前的邮箱号email = verify_code[0].email# 激活用户user_obj = UserProfile.objects.get(email=email)user_obj.is_start = Trueuser_obj.save()# 删除当前的验证类verify_code.delete()return redirect(reverse('user_login'))else:return render(request, '404.html')
2. 完善登录功能的界面
# user/views
def user_login(request):'''用户登录1. 用户想要登录, 则直接进入到此页面2. 用户点击登录进入到主页可以根据不同的请求方法来做不同的请求事件:param request::return:'''if request.method == 'GET':return render(request, 'user_login.html')else:# 如果是post请求,则进行表单的验证login_form = UserLoginForm(request.POST)if login_form.is_valid():email = login_form.cleaned_data.get('email')password = login_form.cleaned_data.get('password')# 通过Django的方法来校验账号和密码user = authenticate(username=email, password=password)if user:# 如何账号和密码正确,则进行校验用户是否已经激活user_obj = UserProfile.objects.get(username=email)# 如果用户基因进行激活if user_obj.is_start:login(request, user)# 返回主页return redirect('/')else:return render(request, 'user_register.html', {'msg': '请激活账号后进行登录'})else:# 如果账号密码错误return render(request, 'user_login.html', {'msg': '账号或密码错误'})else:# 如果用户提交的数据有问题return render(request, 'user_login.html', {'msg': login_form})
3. 用户登录校验模块
# user/forms
class UserLoginForm(forms.Form):'''用户登录的表单: 当用户点击登录时, 可以通过我们所写的表单字段来对数据进行校验email: 用来校验用户提交的邮箱, EmailField(forms中定义的邮箱类型), required(保存用户提交的数据不能为空), error_messages(如果有错误, 则根据字典中错误的key来提示对应信息)password: 用来校验用户提交的密码, CharField(forms中定义的字符串类型)'''email = forms.EmailField(required=True,error_messages={'required':'请填写邮箱','invalid':'请输入有效的邮箱'})password = forms.CharField(required=True,error_messages={'required':'请填写密码'})
4. 前端文件
1. user_login
# user_login
<!DOCTYPE html>
<html>
<head><meta charset="utf-8"><link href="/static/css/reglogin.css" rel='stylesheet' type='text/css'/><meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<div class="main"><div class="header"><h1>登录!</h1></div><p></p><form action="{% url 'user_login' %}" method="post">{% csrf_token %}<ul class="left-form"><h2>登录:</h2>{# 输入的邮箱 #}<li><input type="text" placeholder="请输入您的邮箱" name="email"/><div class="clear"></div></li><div style="color: red">{{ login_form.email.errors.0 }}</div>{# 输入的密码 #}<li><input type="password" placeholder="请输入密码" name="password"/><div class="clear"></div></li><div style="color: red">{{ login_form.password.errors.0 }}</div><input type="submit" value="登录"><div class="clear"></div></ul><div class="clear"></div></form><h3 style="width: 200px;height: 30px;margin: auto;color: red;text-align: center">{{ msg }}</h3>
</div>
</body>
</html>
2. 404页面
{% load static %}
<!doctype html>
<html lang="zh-CN">
<head><meta name="360-site-verification" content="85326d9c1b0d512826605334e6eb1d5c"><meta charset="utf-8"><meta name="renderer" content="webkit"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><meta name="baidu_union_verify" content="6c3c4420bcc5cb0d05563cc88180cd88"><title>很抱歉,没有相关内容</title><meta name="keywords" content="Django博客">{# <link rel="stylesheet" type="text/css" href="/static/css/bootstrap.min.css">#}
{# <link rel="stylesheet" type="text/css" href="/static/css/nprogress.css">#}
{# <link rel="stylesheet" type="text/css" href="/static/css/style.css">#}
{# <link rel="stylesheet" type="text/css" href="/static/css/shang.css">#}
{# <link rel="stylesheet" type="text/css" href="/static/css/font-awesome.min.css">#}
{# <link rel="apple-touch-icon-precomposed" href="/static/images/icon.png">#}
{# <link rel="shortcut icon" href="/static/images/favicon.ico">#}<link rel="stylesheet" type="text/css" href="{% static 'css/bootstrap.min.css' %}"><link rel="stylesheet" type="text/css" href="{% static 'css/nprogress.css' %}"><link rel="stylesheet" type="text/css" href="{% static 'css/style.css' %}"><link rel="stylesheet" type="text/css" href="{% static 'css/shang.css' %}"><link rel="stylesheet" type="text/css" href="{% static 'css/font-awesome.min.css' %}"><link rel="apple-touch-icon-precomposed" href="{% static 'images/icon.png' %}"><link rel="shortcut icon" href="{% static 'images/favicon.ico' %}">{# <script src="/static/js/jquery-2.1.4.min.js"></script>#}
{# <script src="/static/js/nprogress.js"></script>#}
{# <script src="/static/js/jquery.lazyload.min.js"></script>#}<script src="{% static 'js/jquery-2.1.4.min.js' %}"></script><script src="{% static 'js/nprogress.js' %}"></script><script src="{% static 'js/jquery.lazyload.min.js' %}"></script><style type="text/css">.panel {padding: 80px 20px 0px;min-height: 400px;cursor: default;}.text-center {margin: 0 auto;text-align: center;border-radius: 10px;max-width: 900px;-moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, .3);-webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, .3);box-shadow: 0px 0px 5px rgba(0, 0, 0, .1);}.float-left {float: left !important;}.float-right {float: right !important;}img {border: 0;vertical-align: bottom;}h2 {padding-top: 20px;font-size: 20px;}.padding-big {padding: 20px;}.alert {border-radius: 5px;padding: 15px;border: solid 1px #ddd;background-color: #f5f5f5;}</style>
</head>
<body class="user-select">
<header class="header"><nav class="navbar navbar-default" id="navbar"><div class="container"><div class="header-topbar hidden-xs link-border"><ul class="site-nav topmenu"><!--<li><a href="#">标签云1</a></li>-->{% if request.user.is_authenticated %}<li><a href="#">@{{ request.user.username }}</a></li><li><a href="{% url 'user_logout' %}" style="border-left: 1px solid black">退出</a></li>{% else %}<li><a href="{% url 'user_login' %}" target="_blank">登录</a></li><li><a href="{% url 'user_register' %}" target="_blank"style="border-left: 1px solid black">注册</a></li>{% endif %}</ul>人生苦短, 我用Python</div><div class="navbar-header"><button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#header-navbar" aria-expanded="false"><span class="sr-only"></span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><h1 class="logo hvr-bounce-in"><a href="#" title="首页">
{# <img src="/static/images/logo.png" alt="首页">#}<img src="{% static 'images/logo.png' %}" alt="首页"></a></h1></div>{# 头部下面右 #}<div class="collapse navbar-collapse" id="header-navbar"><ul class="nav navbar-nav navbar-right">{# 所有的分类 #}<li><a data-cont="python" title="Python" href="#">Python</a></li><li><a data-cont="python" title="Java" href="#">Java</a></li><li><a data-cont="python" title="C" href="#">C</a></li><li><a data-cont="python" title="C++" href="#">C++</a></li></ul></div></div></nav>
</header>
<section class="container"><div class="panel"><div class="text-center"><h2><stong>很抱歉,没有相关内容 o(╥﹏╥)o</stong></h2><div class="padding-big"><a href="#" class="btn btn-primary">返回首页</a></div></div></div>
</section>
<footer class="footer"><div class="container"><p><p>Copyright © 2022.知吾所想 予吾所好-Allen</p></div><div id="gotop"><a class="gotop"></a></div>
</footer>
<script src="/static/js/bootstrap.min.js"></script>
<script src="/static/js/jquery.ias.js"></script>
<script src="/static/js/scripts.js"></script><script src="{% static 'js/bootstrap.min.js' %}"></script>
<script src="{% static 'js/jquery.ias.js' %}"></script>
<script src="{% static 'js/scripts.js' %}"></script>
<script>var _hmt = _hmt || [];(function () {var hm = document.createElement("script");hm.src = "https://hm.baidu.com/hm.js?e8ae61fbc1aa8b44823aae4cd23690b0";var s = document.getElementsByTagName("script")[0];s.parentNode.insertBefore(hm, s);})();
</script></body>
</html>
3. wait_start
<!doctype html>
<html lang="zh-CN">
<head><meta charset="utf-8"><meta name="renderer" content="webkit"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><title>快去激活</title><link rel="stylesheet" type="text/css" href="/static/css/bootstrap.min.css"><link rel="stylesheet" type="text/css" href="/static/css/nprogress.css"><link rel="stylesheet" type="text/css" href="/static/css/style.css"><link rel="stylesheet" type="text/css" href="/static/css/font-awesome.min.css"><link rel="apple-touch-icon-precomposed" href="/static/images/icon.png"><link rel="shortcut icon" href="/static/images/favicon.ico"><script src="/static/js/jquery-2.1.4.min.js"></script><script src="/static/js/nprogress.js"></script><script src="/static/js/jquery.lazyload.min.js"></script><!--[if gte IE 9]><script src="/static/js/jquery-1.11.1.min.js" type="text/javascript"></script><script src="/static/js/html5shiv.min.js" type="text/javascript"></script><script src="/static/js/respond.min.js" type="text/javascript"></script><script src="/static/js/selectivizr-min.js" type="text/javascript"></script><![endif]--><!--[if lt IE 9]><script>window.location.href = 'upgrade-browser.html';</script><![endif]--><style type="text/css">.panel {padding: 80px 20px 0px;min-height: 400px;cursor: default;}.text-center {margin: 0 auto;text-align: center;border-radius: 10px;max-width: 900px;-moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, .3);-webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, .3);box-shadow: 0px 0px 5px rgba(0, 0, 0, .1);}.float-left {float: left !important;}.float-right {float: right !important;}img {border: 0;vertical-align: bottom;}h2 {padding-top: 20px;font-size: 20px;}.padding-big {padding: 20px;}.alert {border-radius: 5px;padding: 15px;border: solid 1px #ddd;background-color: #f5f5f5;}</style>
</head>
<body class="user-select">
<header class="header"><nav class="navbar navbar-default" id="navbar"><div class="container"><div class="header-topbar hidden-xs link-border"><ul class="site-nav topmenu"><!--<li><a href="#">标签云</a></li>--><!--<li><a href="#" rel="nofollow">读者墙</a></li>--><!--<li><a href="#" title="RSS订阅">--><!--<i class="fa fa-rss">--><!--</i> RSS订阅--><!--</a></li>--></ul>人生苦短, 我用Python</div><div class="navbar-header"><button type="button" class="navbar-toggle collapsed" data-toggle="collapse"data-target="#header-navbar" aria-expanded="false"><span class="sr-only"></span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><h1 class="logo hvr-bounce-in"><a href="#" title=""><img src="/static/images/logo.png" alt=""></a></h1></div><div class="collapse navbar-collapse" id="header-navbar"><form class="navbar-form visible-xs" method="post"><div class="input-group"><input type="text" name="keyword" class="form-control" placeholder="请输入关键字" maxlength="20"autocomplete="off"><span class="input-group-btn"><button class="btn btn-default btn-search" name="search" type="submit">搜索</button></span></div></form><ul class="nav navbar-nav navbar-right"><li><a data-cont="但尽人事 莫问前程" title="但尽人事 莫问前程" href="#">首页</a></li><li><a data-cont="python" title="" href="#"></a></li></ul></div></div></nav>
</header>
<section class="container"><div class="panel"><div class="text-center"><h2><stong>已发送激活链接到邮箱,请去激活! o(╥﹏╥)o</stong></h2><div class="padding-big"><a href="#" class="btn btn-primary">返回首页</a><div class="widget widget_search"><form class="navbar-form" action=""><div class="input-group"><input type="text" name="keyword" class="form-control" size="35" placeholder="请输入关键字"maxlength="15" autocomplete="off"><span class="input-group-btn"><button class="btn btn-default btn-search" type="submit">搜索</button></span></div></form></div></div></div></div>
</section>
<footer class="footer"><div class="container"><p>Copyright © 2022.知吾所想 予吾所好-Allen</p></div><div id="gotop" style="display: block;"><a class="gotop"></a></div>
</footer>
<script src="/static/js/bootstrap.min.js"></script>
<script src="/static/js/jquery.ias.js"></script>
<script src="/static/js/scripts.js"></script>
</body>
</html>
本期内容到此结束,我们下期再见,拜拜!!