登錄后,跳轉到首頁,首頁會展示用戶名;未登錄時,首頁將展示登錄與注冊的選項。
第一步: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'),