<div class="truth">
作為一個真正的程序員,首先應該尊重編程,熱愛你所寫下的程序,他是你的伙伴,而不是工具
</div>
<blockquote class="default">
<p>知識點<br>
1.session 的使用<br>
2.tp 請求與響應<br>
3.隱藏index.php<br />
4.重新設置視圖目錄<br />
5.驗證碼的實現
</p>
<div class="env">版本:thinkphp5.07</div>
</blockquote>
<div class="step">1.修改站點根目錄</div>
<div class="info">
<p>(1).TP5 版本的默認自帶的入口文件位于public/index.php,這里我們將默認的入口文件放在網站根目錄。
</p>
<p>(2).修改index.php 代碼如下</p>
~~~
// [ 應用入口文件 ]
// 定義應用目錄
define('APP_PATH', __DIR__ . '/application/');
// 加載框架引導文件
require __DIR__ . '/thinkphp/start.php';
~~~
<div class="step">2.隱藏index.php</div>
<span class="url">請參考:[隱藏index.php](315259)</span>
<div class="step">3.重新設置視圖目錄</div>
<span class="url">具體步驟請參考:[重新設置視圖目錄](315955)</span>
<div class="info">這里我們把視圖目錄跟靜態資源放在同一個目錄下(/public/)</div>
<div class="step">4.創建用戶表</div>
| 字段 | 注釋 |
| --- | --- |
| id | 主鍵(自增) |
| username|用戶名 (登錄賬號) |
| password |密碼 |
| nickname| 昵稱 |
<div class="info">
這里選擇mysql數據庫,具體創建數據庫+表請自己手動完成。創建完成后,手動添加用戶名和密碼,為了方便演示,這里密碼不在加密。添加數據 username:admin password:admin
</div>
<div class="step">5.鏈接mysql數據庫</div>
<span class="url">
請參考:[連接數據庫](315956)
</span>
<div class="step">6.創建公共模板</div>
<div class="info">
<p>這里使用了模板繼承去實現整個站點的布局,如果對模板繼承不熟悉的朋友,可以參考<a href="http://www.hmoore.net/manual/thinkphp5/125014">《thinkphp5完全開發手冊》模板繼承</a>
</p>
<p>注意:這里不寫樣式。需要的同學可以在下載的源碼包中找到</p>
<p>公共模板默認在視圖文件的模塊根目錄下。本案例的公共模板在 【public\default\auth.html】 源碼如下:</p>
</div>
~~~
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>用戶認證-{block name="title"}{/block}</title>
<link href="__ROOT__/public/static/boot/css/bootstrap.min.css" rel="stylesheet">
<link href="__ROOT__/public/static/auth.css" rel="stylesheet">
</head>
<body>
<div class="auth">
<form action="" method="post" id="userform">
<div class="ahead">
{block name="auth-title"}認證標題{/block}
</div>
<div class="abody">
<!-- 自定義頁面提示,通過session來輸出失敗信息。 message_info.title ;輸出錯誤內容 message_info.content -->
{if condition="$Request.session.message_info.title neq false"}
<div class="message_info">
<div class="alert alert-danger alert-dismissible fade in" role="alert">
<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4>{$Request.session.message_info.title}</h4>
<p>{$Request.session.message_info.content}</p>
</div>
</div>
<!-- 清除session -->
{:clear_session('message_info')}
{/if}
{block name="auth-form"}
認證表單
{/block}
</div>
<!-- edn abody -->
<div class="atools">
<button type="submit" class="btn btn-primary">{block name="auth-submit"}提交{/block}</button>
<button type="reset" class="btn btn-info">重置</button>
</div>
</form>
</div>
<script src="__ROOT__/public/static/boot/js/jquery.min.js"></script>
<script src="__ROOT__/public/static/boot/js/bootstrap.min.js"></script>
<script src="__ROOT__/public/static/jqvalidation/dist/jquery.validate.js"></script>
{block name="script"}
{/block}
</body>
</html>
~~~
<div class="step">7.創建登錄頁面</div>
<div class="info">
<p>登錄頁面繼承了公共模板。位置:【public\default\auth\login.html】,源碼如下</p>
</div>
~~~
{extend name="auth" /}
{block name="title"}登錄{/block}
{block name="auth-title"}用戶登錄{/block}
{block name="auth-form"}
<div class="form-group">
<label for="username">用戶名:</label>
<input type="text" class="form-control" id="username" name="username" placeholder="用戶名">
</div>
<div class="form-group">
<label for="password">密碼:</label>
<input type="password" class="form-control" id="password" name="password" placeholder="密碼">
</div>
<div class="form-group">
<label for="yzm">驗證碼:</label>
<input type="text" class="form-control" id="yzm" name="yzm" placeholder="驗證碼">
<div class="yzm"><img src="{:captcha_src()}" id="codeimage" alt="captcha" onclick="javascript:this.src = '/captcha.html?time=' + Math.random();" /></div>
</div>
{/block}
{block name="auth-submit"}登錄{/block}
{block name="script"}
<script type="text/javascript">
$("#userform").validate({
rules: {
username: {
required: true,
},
password: {
required: true,
},
yzm: {
required: true,
},
},
messages: {
username: {
required: "請輸入用戶名",
},
password: {
required: "請輸入密碼",
},
yzm: {
required: "請輸入驗證碼",
},
}
});
</script>
{/block}
~~~
<div class="info">
登錄驗證中,有兩個地方需要說下。
<p>1.登錄后臺驗證提示。在登錄中,如果控制器端認證失敗,會將信息暫時保存在 session下的message_info 數組中。當跳轉回登陸頁面后,立即提示登錄失敗的緣由。同時將該session再次注銷</p>
<p>2.驗證碼,這里涉及到驗證碼的設置,顯示,以及刷新。需要深入了解的朋友可以參考 </p>
</div>
《[驗證碼](316872)》章節。
<div class="step">8.創建User模型</div>
<div class="info">
ThinkPHP5.0的模型是一種對象-關系映射(Object/Relation Mapping,簡稱ORM)的封裝,并且提供了簡潔的ActiveRecord實現。一般來說,每個數據表會和一個“模型”對應。
</div>
<span class="url">
需要深入學習模型和關聯,可以參考[模型和關聯](http://http://www.hmoore.net/thinkphp/thinkphp5_quickstart/147283) 或者 [模型操作](317174)。
</span>
<div class="info">
在【application\index\model\User.php】中,寫入如下代碼(手動創建目錄和文件,或者通過composer創建,這里不再詳細說明):
</div>
~~~
<?php
namespace app\index\model;
use think\Model;
class User extends Model
{
}
~~~
<div class="note">因為是簡單的模型化,這里并沒有寫其他處理數據的邏輯</div>
<div class="step">9.登錄控制器</div>
<div class="info">
控制器位置:【application\index\controller\Auth.php】,代碼如下
</div>
~~~
<?php
namespace app\index\controller;
use think\Controller;
use app\index\model\User;
use think\Session;
// use think\Db;
// 該頁面應該繼承基控制器
class Auth extends Controller
{
public function _initialize()
{
}
public function index()
{
$this->redirect('index/auth/login');
}
//登錄
public function login()
{
if (input('post.')) {
$map=array();
// 獲取用戶名和密碼,這里跟tp3的方式不一樣
$map['username']=input('post.username');
$map['password']=input('post.password');
$user = User::get($map);//用get方法去判斷。如果獲得到數據,說明登錄成功!
// 首先驗證驗證碼:
$captcha = new \think\captcha\Captcha();
if (!$captcha->check(input('post.yzm'))) {
//注意,如果session設置為二維數組,必須在賦值的時候,將他一維數組session清空。tp5session中存在bug,session不能當數組來使用!
session('message_info',null);
Session::set('message_info.title','登錄失敗');
Session::set('message_info.content','驗證碼錯誤');
$this->redirect(url('/index/auth/login'));
}
if ($user) {
//登錄成功,設置session。
Session::set('user.username',$user['username']);
Session::set('user.nickname',$user['nickname']);
Session::set('message_info','恭喜你,登錄成功'); //因為保存的是session,所以,會在頁面中session調用的地方顯示出來
$this->redirect('/');
}
else{
// 登錄失敗,將錯誤信息保存到session,并且重定向到登錄,如果不采用重定向,頁面刷新會提示,表單有數據的提示框。
Session::set('message_info.title','登錄失敗');
Session::set('message_info.content','用戶名或者密碼錯誤。');
$this->redirect(url('/index/auth/login'));
}
}
return $this->fetch();
}
public function get_yzm()
{
return captcha_src();
}
//注冊
public function register()
{
// 這里是注冊邏輯,本例可以不實現
return $this->fetch();
}
//退出 未實現
public function logout()
{
Session::clear();
$this->redirect(url('/index/auth/login'));
}
public function plug()
{
$user_lists=array(
'1'=>'王八蛋',
'2'=>'張三豐',
);
$form=array(
array('title'=>'編號','plug'=>'form_text','field'=>'id','default'=>"未定義"),
array('title'=>'賬號','plug'=>'form_select','field'=>'username','default'=>"2",'config'=>$user_lists),
array('title'=>'密碼','plug'=>'form_text','field'=>'password','default'=>"未定義"),
array('title'=>'昵稱','plug'=>'form_text','field'=>'nickname','default'=>"未定義"),
);
$this->assign(['form'=>$form]);
return $this->fetch();
}
}
~~~
<div class="step">10.登錄成功后,首頁代碼</div>
<div class="info">
【application\index\controller\Index.php】代碼如下:
</div>
~~~
<?php
namespace app\index\controller;
class Index
{
public function index()
{
return '首頁<a href="/index/Auth/logout">注銷</a>';
}
}
~~~
<div class="info">
<p>至此,整個完整登錄已經完成。</p>
<p>源碼下載地址:https://pan.baidu.com/s/1bo7ejQf</p>
<p>thinkphp5學習交流群:536633782</p>
</div>