登錄認證 · thinkphp5經典案例

<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">  {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>  {:clear_session('message_info')} {/if} {block name="auth-form"} 認證表單 {/block} </div>  <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>