新闻cms管理系统(二)

发布于：2021-12-15 10:55:00 栏目：技术文档

新闻cms管理系统(二) ---- 后台登录功用

1、页面准备：

（1）前端资源的导入：将准备好的页面添加到项目中，放到Public目录下（公共的页面款式、js、图片等资源）

（2）添加登录的视图模板

　　将登录页面的视图放到Amin>View>Login>index.html中

DOCTYPE html><html lang="zh-CN"><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content=""> 上述3个meta标签*必需*放在最前面，任何其他内容都*必需*跟随其后！ --> <meta name="description" content=""> <meta name="author" content=""> <link rel="icon" href=""> <title>新闻cms内容管理平台</title> Bootstrap core CSS --> <link href="/Public/css/bootstrap.min.css" rel="stylesheet"> Custom styles for this template --> <link href="signin.css" rel="stylesheet"> HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> [if lt IE 9]> <![endif]--></head><body><style> .s_center { margin-left: auto; margin-right: auto; }</style><div class="s_center container col-lg-6 "> <form class="form-signin" enctype="multipart/form-data" method="post"> <h2 class="form-signin-heading">请登录</h2> <label class="sr-only">用户名</label> <input type="text" class="form-control" name="username" placeholder="请填写用户名" required autofocus> <br /> <label class="sr-only">密码</label> <input type="password" name="password" id="inputPassword" class="form-control" placeholder="密码" required> <br /> <button class="btn btn-lg btn-primary btn-block" type="button" onclick="login.check()">登录</button> </form></div> /container --><script src="/Public/js/jquery.js"></script> IE10 viewport hack for Surface/desktop Windows 8 bug --></body></html>

（3）添加登录的控制器和办法

　　完成代码完成：（文件位置：Admin>Controller>LoginController.class.php）

<?phpnamespace Admin\Controller;use Think\Controller;class LoginController extends Controller { public function index(){ $this->display(); //默许加载View>Login>index.html }}

（3）阅读器访问

　　http://172.17.0.2/index.php?m=admin&c=login&a=index

（4）页面显现

2、数据库准备

（1）数据库恢复： >mysql : source /var/www/html/cms.sql

（2）数据库配置：（位置：Common>Conf>config.php和db.php）

1)config.php配置//允许加载其他配置文件，其文件名为（多个文件的文件名用逗号隔开）'LOAD_EXT_CONFIG' => 'db'2）db.php数据库配置<?phpreturn array( 'DB_TYPE' => 'mysql', 'DB_HOST' => '127.0.0.1', //数据库效劳器主机ip地址 'DB_USER' => 'root', //数据库用户名 'DB_PWD' => '', //数据库用户密码 'DB_PORT' => 3306, //数据库端口号 'DB_NAME' => 'cms', //数据库名 'DB_CHARSET' => 'utf8', //数据库编码 'DB_PREFIX' => 'cms_' //数据库前缀名 );

2、layer插件

(1）layer插件准备：

官方下载地址:http://layer.layui.com

官方教程：www.layui.com/doc/modules/layer.html

layer插件包括extend目录、skin目录和layer.js文件

完好文件放到项目下的dialog目录(位置: Public>js>dialog)

（2）插件二次封装：

为便于在此项目中运用，再对项目需求的弹出层停止二次封装，命名为dialog.js(位置：Public>js>dailog.js)

（3）常用弹出层：

1）错误弹出层

// 错误弹出层error: function(message) { layer.open({ content:message, icon:2, title : '错误提示', });},

2）胜利弹出层

// 胜利弹出层success : function(message,url) { layer.open({ content : message, icon : 1, yes : function(){ location.href=url; }, });},

3）确认弹出层

// 确认弹出层confirm : function(message, url) { layer.open({ content : message, icon:3, btn : ['是','否'], yes : function(){ location.href=url; }, });}

4）无须跳转弹出层

//无需跳转到指定页面确实认弹出层toconfirm : function(message) { layer.open({ content : message, icon:3, btn : ['肯定'], });}

（4）弹出层的调用：

1）引入本系统的类库dialog.js文件（在Amin>View>Login>index.html中引入）

2）引入第三方插件layer.js文件（在Amin>View>Login>index.html中引入）

3）调用（js文件）

dialog.error("这是弹出的音讯内容")；

3、数据校验

(1)数据提交的两种方式：

　　1）同步提交数据：页面跳转（体验不好）

　　2）异步提交数据：经过js的ajax恳求，页面不跳转，异步恳求地址

(2)异步恳求的完成：

　　1）jquery框架的ajax完成手册http://jquery.cuishifeng.cn/

　　2）<span class="MathJax" id="MathJax-Element-1-Frame" tabindex="0" data-mathml=".ajax()、" role="presentation" style="box-sizing: inherit; display: inline; line-height: normal; word-spacing: normal; word-wrap: normal; white-space: nowrap; float: none; direction: ltr; max-width: none; max-height: none; min-width: 0px; min-height: 0px; border: 0px; padding: 0px; margin: 0px; position: relative;">.ajax()、.ajax()、.get()、$.post()三种方式的了解

(3)前端登录的业务处置:

1）js校验：(位置: Public>js>admin>login.js)

/** * 前端登录业务类 */var login = { check : function() { // 获取登录页面中的用户名和密码var username = $('input[name="username"]').val(); var password = $('input[name="password"]').val(); if(!username) { dialog.error('用户名不能为空'); } if(!password) { dialog.error('密码不能为空'); } var url = "/index.php?m=admin&c=login&a=check"; var data = {'username':username,'password':password}; // 执行异步恳求 $.post $.post(url,data,function(result){ if(result.status == 0) { return dialog.error(result.message); } if(result.status == 1) { return dialog.success(result.message, '/index.php?m=admin&c=index'); } },'JSON'); }}

2）html表单触发（Amin>View>Login>index.html文件）

3)login.js文件引入（在Amin>View>Login>index.html中引入）

3）阅读器运转效果

(4)后端php业务处置:

1)check办法的数据校验：

$username = $_POST['username'];$password = $_POST['password'];if(!trim($username)) { return show(0,'用户名不能为空');}if(!trim($password)) { return show(0,'密码不能为空');}

前端的数据校验是js完成的，其在阅读器中是可视的，用户是可看到的，为防止用户对修正js文件躲避数据校验,所以必需在效劳器端再次校验

show()公共办法的封装：（多处中央要用到，所以作为公共函数封装到Common/Common/function.php文件）

/**展现数据 * @param $status 状态码 * @param $message 展现的音讯内容 * @param array $data */function show($status, $message,$data=array()) { $result = array( 'status' => $status, 'message' => $message, 'data' => $data, ); exit(json_encode($result));}

2）数据校验经过的数据处置一-------用户不存在（登录失败）（check办法）

$ret = D('Admin')->getAdminByUsername($username); //查询admin表中能否存在该用户if(!$ret || $ret['status'] !=1) { return show(0,'该用户不存在');}if($ret['password'] != getMd5Password($password)) { return show(0,'密码错误');}

判别用户能否存在----操作数据库查询数据（Application/Common/Model/adminModel.class.php）

<?phpnamespace Common\Model;use Think\Model;class AdminModel extends Model { private $_db = ''; public function __construct() { $this->_db = M('admin'); //实例化admin表 } public function getAdminUsername($username) { $ret = $this->_db->where('username="'.$username.'"')->find(); return $ret; }}

对用户输入的密码停止md5加密（Application/Common/Common/function.php）

function getMd5Password($password) { return md5($password . C('MD5_PRE')); // C('MD5_PRE')访问配置文件中'MD5_PRE'配置项的设置值}注：直接md5加密也不是太平安，所以配置一个自定义的前缀，然后再停止md5加密，相对更平安

MD5_PRE配置（Application/Common/Conf/config.php）

'MD5_PRE' => 'my_cms',

3）数据校验经过的数据处置二-------用户存在（登录胜利）（check办法）

//将用户信息保管到session中session('adminUser', $ret);return show(1,'登录胜利');

(5)阅读器运转效果

4、退出登录（应用session失效）

(1)设置访问后台页面时的session判别

public function index() { if(session('adminUser')) { $this->redirect('/iindex.php?m=admin&c=index'); } $this->display(); //默许加载View>Login>index.html}

(2)后台首页面退出登录的恳求

(3)添加logout控制器办法处置退出登录

public function logout() { session('adminUser', null); $this->redirect('/index.php?m=admin&c=login&a=index');}

退出胜利后自动跳转到后台登录页面。

后台登录功用完成！

相关推荐

SaaS的续费率为什么那么低？
中国SaaS产业表面风光无限为什么说很难盈利
Code Review有什么好处？
什么是Istio? Istio究竟是干嘛的？
linux mv命令怎么用

阅读 +