登出
为了使实施过程自然顺畅,让我们添加注销视图。 首先,编辑urls.py以添加新路由:
myproject / urls.py
from django.conf.urls import url from django.contrib import admin from django.contrib.auth import views as auth_views from accounts import views as accounts_views from boards import views urlpatterns = [ url ( r'^$' , views . home , name = 'home' ), url ( r'^signup/$' , accounts_views . signup , name = 'signup' ), url ( r'^logout/$' , auth_views . LogoutView . as_view (), name = 'logout' ), url ( r'^boards/(?P<pk> \ d+)/$' , views . board_topics , name = 'board_topics' ), url ( r'^boards/(?P<pk> \ d+)/new/$' , views . new_topic , name = 'new_topic' ), url ( r'^admin/' , admin . site . urls ), ]我们从Django的contrib模块导入了视图 。 我们将其重命名为auth_views以避免与boards.views冲突。 请注意,此视图有些不同: LogoutView.as_view() 。 这是Django基于类的视图。 到目前为止,我们仅将视图实现为Python函数。 基于类的视图提供了一种更灵活的方式来扩展和重用视图。稍后我们将讨论更多该主题。
打开settings.py文件,并将LOGOUT_REDIRECT_URL变量添加到文件底部:
myproject / settings.py
LOGOUT_REDIRECT_URL = 'home'在这里,我们传递的是URL模式的名称,我们要在注销后重定向用户。
在那之后,它已经完成了。 只需访问URL 127.0.0.1:8000/logout/ ,您将被注销。 但是等一下。 注销之前,让我们为已登录的用户创建下拉菜单。
显示经过身份验证的用户的菜单
现在,我们需要在base.html模板中进行一些调整。 我们必须添加一个带有注销链接的下拉菜单。
Bootstrap 4下拉组件需要jQuery才能工作。
首先,转到jquery.com/download/并下载压缩的生产jQuery 3.2.1版本。
在静态文件夹内,创建一个名为js的新文件夹。 将jquery-3.2.1.min.js文件复制到此处。
Bootstrap 4还需要一个名为Popper的库才能工作。 转到popper.js.org并下载最新版本。
在popper.js-1.12.5文件夹中,转到dist / umd并将文件popper.min.js复制到我们的js文件夹中。 注意这里; Bootstrap 4仅适用于umd / popper.min.js 。 因此,请确保您要复制正确的文件。
如果您不再拥有所有Bootstrap 4文件,请从getbootstrap.com重新下载。
同样,将bootstrap.min.js文件也复制到我们的js文件夹中。
最终结果应为:
myproject/ |-- myproject/ | |-- accounts/ | |-- boards/ | |-- myproject/ | |-- static/ | | |-- css/ | | +-- js/ | | |-- bootstrap.min.js | | |-- jquery-3.2.1.min.js | | +-- popper.min.js | |-- templates/ | |-- db.sqlite3 | +-- manage.py +-- venv/在base.html文件的底部,将脚本添加到{ % endblock body % } { % endblock body % } { % endblock body % } :
templates / base.html
{% load static %}<!DOCTYPE html> <html> <head> <meta charset= "utf-8" > <title> {% block title %} Django Boards {% endblock %} </title> <link href= "https://fonts.googleapis.com/css?family=Peralta" rel= "stylesheet" > <link rel= "stylesheet" href= " {% static 'css/bootstrap.min.css' %} " > <link rel= "stylesheet" href= " {% static 'css/app.css' %} " > {% block stylesheet %}{% endblock %} </head> <body> {% block body %} <!-- code suppressed for brevity --> {% endblock body %} <script src= " {% static 'js/jquery-3.2.1.min.js' %} " ></script> <script src= " {% static 'js/popper.min.js' %} " ></script> <script src= " {% static 'js/bootstrap.min.js' %} " ></script> </body> </html>如果您发现说明令人困惑,则只需使用下面的直接链接下载文件:
https://code.jquery.com/jquery-3.2.1.min.jshttps://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.jshttps://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js右键单击并将链接另存为...。
现在我们可以添加Bootstrap 4下拉菜单:
templates / base.html
<nav class= "navbar navbar-expand-sm navbar-dark bg-dark" > <div class= "container" > <a class= "navbar-brand" href= " {% url 'home' %} " > Django Boards </a> <button class= "navbar-toggler" type= "button" data-toggle= "collapse" data-target= "#mainMenu" aria-controls= "mainMenu" aria-expanded= "false" aria-label= "Toggle navigation" > <span class= "navbar-toggler-icon" ></span> </button> <div class= "collapse navbar-collapse" id= "mainMenu" > <ul class= "navbar-nav ml-auto" > <li class= "nav-item dropdown" > <a class= "nav-link dropdown-toggle" href= "#" id= "userMenu" data-toggle= "dropdown" aria-haspopup= "true" aria-expanded= "false" > {{ user.username }} </a> <div class= "dropdown-menu dropdown-menu-right" aria-labelledby= "userMenu" > <a class= "dropdown-item" href= "#" > My account </a> <a class= "dropdown-item" href= "#" > Change password </a> <div class= "dropdown-divider" ></div> <a class= "dropdown-item" href= " {% url 'logout' %} " > Log out </a> </div> </li> </ul> </div> </div> </nav>让我们尝试一下。 单击注销:
工作正常 但是无论用户是否登录,都会显示下拉列表。 不同之处在于,现在用户名为空,我们只能看到一个箭头。
我们可以对其进行一些改进:
<nav class= "navbar navbar-expand-sm navbar-dark bg-dark" > <div class= "container" > <a class= "navbar-brand" href= " {% url 'home' %} " > Django Boards </a> <button class= "navbar-toggler" type= "button" data-toggle= "collapse" data-target= "#mainMenu" aria-controls= "mainMenu" aria-expanded= "false" aria-label= "Toggle navigation" > <span class= "navbar-toggler-icon" ></span> </button> <div class= "collapse navbar-collapse" id= "mainMenu" > {% if user.is_authenticated %} <ul class= "navbar-nav ml-auto" > <li class= "nav-item dropdown" > <a class= "nav-link dropdown-toggle" href= "#" id= "userMenu" data-toggle= "dropdown" aria-haspopup= "true" aria-expanded= "false" > {{ user.username }} </a> <div class= "dropdown-menu dropdown-menu-right" aria-labelledby= "userMenu" > <a class= "dropdown-item" href= "#" > My account </a> <a class= "dropdown-item" href= "#" > Change password </a> <div class= "dropdown-divider" ></div> <a class= "dropdown-item" href= " {% url 'logout' %} " > Log out </a> </div> </li> </ul> {% else %} <form class= "form-inline ml-auto" > <a href= "#" class= "btn btn-outline-secondary" > Log in </a> <a href= " {% url 'signup' %} " class= "btn btn-primary ml-2" > Sign up </a> </form> {% endif %} </div> </div> </nav>现在,我们告诉Django如果用户已登录,则显示下拉菜单,如果未登录,则显示登录和注册按钮: