第12次04 ：首页展示用户名
登录后，跳转到首页，首页会展示用户名；未登录时，首页将展示登录与注册的选项。
第一步：index.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head><meta http-equiv="Content-Type" content="text/html;charset=UTF-8"><title>小鱼商城-首页</title><link rel="stylesheet" type="text/css" href="{{ static('css/reset.css') }}"><link rel="stylesheet" type="text/css" href="{{ static('css/main.css') }}"><script type="text/javascript" src="{{ static('js/jquery-1.12.4.min.js') }}"></script><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>
</head>
<body><div id="app"><div class="header_con"><div class="header"><div class="welcome fl">欢迎来到小鱼商城!</div><div class="fr"><div v-if="username" class="login_btn fl">欢迎您：<em>[[ username ]]</em><span>|</span>
{# <a href="{{ url('users:logout') }}">退出</a>#}</div><div v-else class="login_btn fl"><a href="{{ url('users:login') }}">登录</a><span>|</span><a href="{{ url('users:register') }}">注册</a></div>
{# <div class="user_link fl">#}
{# <span>|</span>#}
{# <a href="{{ url('users:info') }}">用户中心</a>#}
{# <span>|</span>#}
{# <a href="cart.html">我的购物车</a>#}
{# <span>|</span>#}
{# <a href="user_center_order.html">我的订单</a>#}
{# </div>#}</div></div></div><div class="footer"><div class="foot_link"><a href="#">关于我们</a><span>|</span><a href="#">联系我们</a><span>|</span><a href="#">招聘人才</a><span>|</span><a href="#">友情链接</a></div><p>CopyRight © 2024 北京小鱼商业股份有限公司 All Rights Reserved</p><p>电话：010-****888 京ICP备*******8号</p></div></div><script type="text/javascript" src="{{ static('js/common.js') }}"></script><script type="text/javascript" src="{{ static('js/slide.js') }}"></script><script type="text/javascript" src="{{ static('js/index.js') }}"></script>
</body>
</html>
第二步：补充后端代码，在登录与注册视图中增加设置cookie的语句
LoginView
class LoginView(View):def get(self, request):return render(request, 'login.html')def post(self, request):username = request.POST.get('username')password = request.POST.get('password')remembered = request.POST.get('remembered')if not all([username, password]):return HttpResponseForbidden('缺少必须参数')if not re.match(r'^[a-zA-Z0-9_-]{5,20}$', username):return HttpResponseForbidden('请输入正确的用户名')if not re.match(r'^[a-zA-Z0-9]{8,20}$', password):return HttpResponseForbidden('密码8-20位')user = authenticate(username=username, password=password)if user is None:return render(request, 'login.html', {'account_errmsg': '账号或密码错误'})login(request, user)print(request.session.session_key)if remembered != 'on':request.session.set_expiry(0)else:request.session.set_expiry(None) # 2周过期# 新增写入cookieresponse = redirect(reverse('contents:index'))response.set_cookie('username', user.username, max_age=3600 * 24 * 14)return response
注册视图
class RegisterView(View):def get(self, request):return render(request, 'register.html')def post(self, request):username = request.POST.get('username')password = request.POST.get('password')password2 = request.POST.get('password2')mobile = request.POST.get('mobile')allow = request.POST.get('allow')if not all([username, password, password2, mobile, allow]):return HttpResponseForbidden('缺少必要参数')if not re.match(r'^[a-zA-Z0-9_-]{5,20}$', username):return HttpResponseForbidden('请输入5-20位的用户名')if not re.match(r'^[a-zA-Z0-9]{8,20}$', password):return HttpResponseForbidden('请输入8-20位的密码')if password != password2:return HttpResponseForbidden('两次密码不一致')if not re.match(r'^1[3-9]\d{9}$', mobile):return HttpResponseForbidden('请输入正确的手机号')if allow != 'on':return HttpResponseForbidden('请勾选协议')try:user = User.objects.create_user(username=username, password=password, mobile=mobile)except DatabaseError:render(request, 'register.html', {'register_errmsg': '注册失败'})login(request, user)# 新增设置cookieresponse = redirect(reverse('contents:index'))response.set_cookie('username', user.username, max_age=3600 * 24 * 14)return response
第三步：在users应用中增加退出登录的视图类，完成清除cookie和重定向到首页的逻辑，并配置路由
from django.contrib.auth import logout
class LogoutView(View):"""退出登录"""def get(self, request):# 清除登录信息logout(request)# 响应，重定向到首页response = redirect(reverse('contents:index'))# 删除cookieresponse.delete_cookie('username')return response
配置路由，users应用下子路由新增
path('logout/', views.LogoutView.as_view(), name='logout'),