Django项目后台的登陆与退出

图灵学者

于 2024-05-28 08:51:30 发布

阅读量187

点赞数 3

分类专栏： django 文章标签： django sqlite 数据库

本文链接：https://blog.csdn.net/xyh2004/article/details/139253165

版权

django 专栏收录该内容

35 篇文章 0 订阅

订阅专栏

(1).　配置路由(已配置过可省略)

配置路由 myobject/myadmin/urls.py 加入如下代码

 ....

    # 后台管理员路由
    path('login', index.login, name="myadmin_login"),
    path('dologin', index.dologin, name="myadmin_dologin"),
    path('logout', index.logout, name="myadmin_logout"),
 ....

(2). 编写视图文件

编写视图 myobject/myadmin/views/index.py文件并加入如下代码：

from django.shortcuts import render
from django.http import HttpResponse
from django.shortcuts import redirect
from django.urls import reverse

from myadmin.models import User

...

# ==============后台管理员操作====================
def login(request):
    '''加载登录页面'''
    return render(request,"myadmin/index/login.html")

def dologin(request):
    '''执行登录'''
    try:
        #根据登录账号获取用户信息
        user = User.objects.get(username=request.POST['username'])
        # 校验当前用户状态是否是管理员
        if user.status == 6:
            #获取密码并md5
            import hashlib
            md5 = hashlib.md5()
            n = user.password_salt
            s = request.POST['pass']+str(n) 
            md5.update(s.encode('utf-8'))
            # 校验密码是否正确
            if user.password_hash == md5.hexdigest():
                # 将当前登录成功用户信息以adminuser这个key放入到session中
                request.session['adminuser']=user.toDict()
                return redirect(reverse('myadmin_index'))
            else:
                context={"info":"登录密码错误！"}
        else:
            context={"info":"此用户非后台管理账号！"}
    except Exception as err:
        print(err)
        context={"info":"登录账号不存在！"}
    return render(request,"myadmin/index/login.html",context)

def logout(request):
    '''执行退出'''
    del request.session['adminuser']
    return redirect(reverse('myadmin_login'))
...

3. 创建模板

创建登录模板文件: templates/myadmin/index/login.html 代码如下：

{% load static from staticfiles %}
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>后台管理登录界面</title>
  <!-- 支持响应式布局 -->
  <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
  <link rel="stylesheet" href="{% static 'myadmin/bower_components/bootstrap/dist/css/bootstrap.min.css' %}">
  <!-- 象形字体 -->
  <link rel="stylesheet" href="{% static 'myadmin/bower_components/font-awesome/css/font-awesome.min.css' %}">
  <!-- 图标 -->
  <link rel="stylesheet" href="{% static 'myadmin/bower_components/Ionicons/css/ionicons.min.css' %}">
  <!-- 主题风格样式 -->
  <link rel="stylesheet" href="{% static 'myadmin/dist/css/AdminLTE.min.css' %}">
  <!-- AdminLTE 皮肤.这里选择的是skin-blue样式，我们还可以有其他皮肤可以选择. -->
  <link rel="stylesheet" href="{% static 'myadmin/dist/css/skins/skin-blue.min.css' %}">
  <!-- 兼容IE9以下浏览器 -->
  <!--[if lt IE 9]>
  <script src="{% static 'myadmin/local/js/html5shiv.min.js' %}"></script>
  <script src="{% static 'myadmin/local/js/respond.min.js' %}"></script>
  <![endif]-->
  <!-- Google Font -->
  <link rel="stylesheet" href="{% static 'myadmin/local/css/google_fonts.css' %}">
</head>
<body class="hold-transition login-page">
<div class="login-box">
  <div class="login-logo">
    <a href="index2.html"><b>餐饮系统后台管理</b></a>
  </div>
  <!-- /.login-logo -->
  <div class="login-box-body">
    <p class="login-box-msg" style="color:red">{{ info }}</p>
    <form action="{% url 'myadmin_dologin' %}" method="post">
      {% csrf_token %}
      <div class="form-group has-feedback">
        <input type="text" name="username" class="form-control" placeholder="账号">
        <span class="glyphicon glyphicon-user form-control-feedback"></span>
      </div>
      <div class="form-group has-feedback">
        <input type="password" name="pass"  class="form-control" placeholder="密码">
        <span class="glyphicon glyphicon-lock form-control-feedback"></span>
      </div>
      <div class="form-group has-feedback">
        <input type="text" name="code" style="display:inline;width:170px;" class="form-control"  placeholder="验证码">
           <img src="{% static 'myadmin/dist/img/verify.png' %}"/>
      </div>
      <div class="row">
        <div class="col-xs-12">
          <button type="submit" class="btn btn-primary btn-block btn-flat">登录</button>
        </div>
        <!-- /.col -->
      </div>
    </form>

  </div>
  <!-- /.login-box-body -->
</div>
<!-- /.login-box -->

<!-- jQuery 3 -->
<script src="{% static 'myadmin/bower_components/jquery/dist/jquery.min.js' %}"></script>
<!-- Bootstrap 3.3.7 -->
<script src="{% static 'myadmin/bower_components/bootstrap/dist/js/bootstrap.min.js' %}"></script>
</body>
</html>

修改模板文件：templates/myadmin/base.html 代码如下：
代码在页头处，155行左右

...
    <ul class="dropdown-menu">
      <!-- The user image in the menu -->
      <li class="user-header">
        <img src="{% static 'myadmin/dist/img/user2-160x160.jpg'%}" class="img-circle" alt="User Image">

        <p>
          {{request.session.adminuser.nickname}} - 管理员
          <small>{{ request.session.adminuser.create_at }}加入</small>
        </p>
      </li>
      <!-- Menu Footer-->
      <li class="user-footer">
        <div class="pull-left">
          <a href="#" class="btn btn-default btn-flat">个人信息</a>
        </div>
        <div class="pull-right">
          <a href="{% url 'myadmin_logout' %}" class="btn btn-default btn-flat">退 出</a>
        </div>
      </li>
    </ul>
...