牟奇春主編PHP動態網站開發項目教程（微課版）任務5會員管理系統管理員功能子任務5.1管理員登錄

實現管理員登錄比較通用的方法有兩種。第一種方法是單獨建立一張管理員數據表，其中的所有數據記錄都是管理員。第二種方法是在現有的普通用戶數據表中增加一列，用來標識是否是管理員。如果是管理員，則可以把這一列設置為1，如果是普通用戶，則將這一列設置為0。為了處理方便，可以將此列默認值設置為0，這樣，用戶注冊時默認注冊為普通用戶。

對于第一種方式，在登錄時，需要單獨做一個管理員登錄的頁面，或者在普通用戶登錄時，添加一組復選框，用來標識是否是管理員登錄。如果是管理員登錄，則后端在判斷用戶名和密碼時，查詢管理員數據表。對于第二種方式，和普通用戶登錄完全一樣，只是在登錄成功后，再判斷管理員標識列的值為多少，以判斷當前用戶是不是管理員。

管理員登錄成功后，需要單獨保存一個Session標識符，用以標識管理員登錄。由于Session的全局性，我們在任意頁面判斷是否是管理員登錄，只需要檢查是否存在這個Session標識符即可。5.1.1修改數據表結構以實現管理員登錄

小王同學決定通過上述第二種方式來實現管理員登錄。很明顯，在前面創建的數據表中并無管理員標識列。因此，他必須先修改數據表。打開phpMyAdmin，找到數據表info，單擊“結構”按鈕，在下面的“添加1個字段”提示文字后面單擊“執行”按鈕，然后就和創建數據表時一樣，正常添加列即可。小王添加的列名是admin，類型可以選擇“tinyint”，長度為1，默認值設置為0（在默認值中選擇“定義”，然后輸入0即可），表示不是管理員。如果是管理員，這一列的值自然就為1。最后單擊“保存”按鈕完成添加。最后的info數據表結構如圖5.1.1所示。圖5.1.1

添加管理員標識列后的數據表結構5.1.2管理員登錄后查看導航欄的變化

根據前面小王設計的系統頁面，在管理員登錄后，還需要在頂部的導航欄中添加一個“歡迎管理員登錄”的提示信息。因此，小王同學打開nav.php文件，在顯示登錄者信息的區域修改了部分代碼。

管理員登錄后，首頁如圖5.1.2所示。圖5.1.2

管理員登錄后的頁面子任務5.2管理員查看所有會員5.2.1判斷管理員權限

正確的做法應該是，借鑒前面包含數據庫連接文件的方法，單獨制作checkAdmin.php文件，在其中通過Session來判斷是否有管理員權限，然后在所有需要驗證管理員權限的文件中使用include包含即可。5.2.2循環輸出數據表記錄

小王同學在制作導航欄時，已經給“后臺管理”欄目添加了鏈接目標文件admin.php。因此，接下來就要制作admin.php文件了。在這個文件中需要實現查看所有會員列表的功能。制作好admin.php文件后，可以在導航欄中單擊“后臺管理”跳轉至管理員頁面。

回想一下前面實現的登錄功能，不管是普通用戶登錄，還是管理員登錄，登錄成功后，都是跳轉至系統首頁。現在看來，這樣做已經不太合適了，應該區分用戶類型，如果是管理員登錄成功，則直接跳轉至admin.php頁面；如果是普通用戶登錄成功，則跳轉至首頁即可。根據這樣的思路，小王同學再次優化了登錄成功后的跳轉邏輯。

圖5.2.1所示為管理員登錄后查看所有會員列表的結果。圖5.2.1

管理員查看所有會員列表5.2.3了解PHP中的循環語句

1．while循環

只要指定的條件成立（運算結果為真），就循環執行代碼塊。其語法規則為：while(條件){要執行的代碼;}2．do...while循環

首先執行一次代碼塊，然后在指定的條件成立時重復這個循環。其語法規則為：do{要執行的代碼;}while(條件);3．for循環

循環執行代碼塊指定的次數。其語法規則為：for(初始值;條件;增量){要執行的代碼;}4．foreach循環

根據數組中的元素來循環代碼塊，也就是遍歷數組，其語法規則為：foreach($arrayas$value){要執行代碼;}或者：foreach($arrayas$key=>$value){要執行代碼;}子任務5.3數據分頁5.3.1理解分頁的基本原理

分頁的基本原理是，在執行數據表查詢時，使用limit關鍵字只讀取指定條數的記錄。通過多次讀取，最終顯示所有內容。5.3.2制作分頁文件

分頁不光要實現后臺數據的按頁（指定數量）獲取，還需要在前端實現分頁的導航鏈接等相關功能。同時，分頁功能也是各個系統經常使用的功能之一，可能會多次重復使用，因此，小王同學還是借鑒前面的制作方法，準備單獨制作一個分頁文件。這樣，以后凡是需要使用分頁的地方，都可以直接引入此文件來實現分頁功能。5.3.3實現分頁

按照下面的步驟進行操作，可快速實現數據分頁。（1）在admin.php中包含page.php文件。（2）查詢記錄表的記錄總數。（3）設置每一頁顯示多少條記錄。（4）讀取當前頁碼。（5）引用分頁函數。（6）在SQL語句中加上limit關鍵字進行分頁查詢。（7）在末尾加上分頁鏈接。圖5.3.1

數據分頁效果【知識儲備】1．SQL查詢中count()函數的使用（1）count(*)：返回表中的記錄數（包括所有列），相當于統計表的行數（不會忽略列值為NULL的記錄）。（2）count(1)：忽略所有列，1表示一個固定值，也可以用count(2)、count(3)代替（不會忽略列值為NULL的記錄）。（3）count(列名)：返回指定列名的記錄數，在統計結果時，會忽略列值為NULL的記錄（不包括空字符串和0），即列值為NULL的記錄不統計在內。（4）count(distinct列名)：返回指定列名的不同值的記錄數（相同的記錄只統計1次），在統計結果時，會忽略列值為NULL的記錄（不包括空字符串和0），即列值為NULL的記錄不統計在內。count(id)

as

total表示獲取記錄總數后，以total的別名返回，所以在第13行中可以使用$info['total']來得到記錄總數。2．變量作用域

在PHP中，變量是有作用域的。所謂變量作用域（VariableScope），是指特定變量在代碼中可以被訪問到的位置。變量必須在其有效范圍內使用，如果超出有效范圍，那么變量會失去其意義。

PHP中包含3種類型變量，分別是局部變量（LocalVariable）、全局變量（GlobalVariable）、靜態變量（StaticVariable）。子任務5.4設置或取消管理員5.4.1修改文件靜態內容5.4.2制作setAdmin.php文件5.4.3避免刪除管理員admin

最終完成的設置（取消）管理員頁面如圖5.4.1所示。圖5.4.1

設置（取消）管理員頁面子任務5.5管理員刪除用戶5.5.1修改前端頁面

5.5.2制作后端頁面【素養小貼士】

一個優秀的程序員應該養成哪些良好的習慣呢？1．寫代碼前應該先想好思路，再規劃框架，最后才是局部實現。2．注重代碼風格。3．注重代碼執行效率。4．解決問題時，對于原理性的問題，不要面向搜索引擎編程。5．在執行一些風險操作時，一定要仔細檢查，并做好二次確認。子任務5.6管理員修改會員資料5.6.1添加資料修改鏈接

5.6.2修改modify.php文件

【任務小結】

在本任務中，主要是完成了管理員相關功能的實現，包括管理員的登錄、查看所有會員列表、數據分頁、設置或取消管理員、刪除用戶、修改會員資料。管理員功能和普通用戶功能的區別就是，需要通過Session中保存的標識符來識別是否為管理員。牟奇春主編PHP動態網站開發項目教程（微課版）任務6會員管理系統項目優化子任務6.1優化跳轉目標頁面6.1.1文件跳轉時添加來源參數6.1.2讀取來源參數，并跳轉至目標頁面

子任務6.2注冊時使用AJAX驗證用戶名是否有效6.2.1理解異步（1）同步：瀏覽器端提交請求→服務器處理→處理完畢返回。其間瀏覽器端不能干任何事。（2）異步：瀏覽器端的請求通過事件觸發→服務器處理（這時瀏覽器端仍然可以做其他事情）→處理完畢，通過回調等方式完成結果處理。

AJAX就是一種典型的異步請求技術。AJAX（AsynchronousJavaScriptAndXML）翻譯成中文就是“異步JavaScript和XML”技術，即使用JavaScript語言與服務器進行異步交互，傳輸的數據為XML（當然，傳輸的數據不只是XML，現在更多使用的是JSON數據）。

AJAX不是一種新的編程語言，而是一種使用現有標準的新方法。

AJAX最大的優點是在不重新加載整個頁面的情況下，可以與服務器交換數據并更新部分網頁內容（這一特點給用戶的感受是在不知不覺中完成請求和響應過程）。6.2.2初識jQuery

在Web頁面中，使用AJAX的一個比較方便的方法是使用jQuery中封裝好的AJAX操作。

jQuery是一個快速、簡潔的JavaScript框架，于2006年1月由約翰·雷西格（JohnResig）發布。jQuery設計的宗旨是“WriteLess,DoMore”，即倡導寫更少的代碼，做更多的事情。它封裝了JavaScript中常用的一些功能代碼，提供了一種簡便的JavaScript設計模式，優化了HTML文檔操作、事件處理、動畫設計和AJAX交互。

jQuery的核心特性可以總結為：具有獨特的鏈式語法和短小清晰的多功能接口；具有高效靈活的CSS選擇器，并且可對CSS選擇器進行擴展；擁有便捷的插件擴展機制和豐富的插件。jQuery可兼容各種主流瀏覽器。

jQuery是一種非常優秀的前端框架，在網絡上可以找到很多的使用教程。jQuery自2006年誕生以來，一共發行了1.x、2.x、3.x這3個大版本。而在這3個大版本下又細分了許多小版本。這3個大版本的簡單區別如下。1．IE的支持情況比較（1）情況分析1.x版本：支持IE6、IE7、IE8。2.x、3.x版本：只支持IE9及以上的版本。（2）選擇建議

如果需要兼容IE6、IE7、IE8，則只能選擇1.x版本。

如果不需要兼容IE6、IE7、IE8，則可以選擇2.x、3.x版本。因為1.x版本中有大部分代碼是針對“舊”瀏覽器做的兼容，所以增加了運行的負擔，影響了運行效率。2．插件的支持情況比較（1）情況分析

jQuery的版本都是不向后兼容的，導致基于jQuery開發的插件會有兼容性問題。也就是說，當新版本的jQuery推出后，原有的插件可能無法正常使用，需要插件作者重新開發新版本。（2）選擇建議

為了保證與各種插件有更好的兼容性，可以選擇1.x版本。3．新特性比較（1）2.x版本相較于1.x版本沒有增加什么新特性，主要是去除了對IE6、IE7、IE8的支持，從而提升了性能，減小了體積。（2）3.x版本相較于之前的版本，增加了許多新特性，也改變了一些以往的特性，具體內容可以查閱網絡上的相關資料。6.2.3引入jQuery庫文件

6.2.4在表單中添加事件

6.2.5實現方法checkUsername()

6.2.6使用jQuery中封裝的AJAX

6.2.7制作AJAX后端文件

由于系統中已經有一個用戶名是admin的用戶了，如果輸入這個用戶名來注冊，則當鼠標光標離開用戶名控件時，在用戶名控件后面顯示綠色的“此用戶名不可用”的提示信息，如圖6.2.1所示。

在用戶名控件中輸入admin1，確保是一個新的未被使用過的用戶名，當再次失去焦點時，會在用戶名控件后面顯示黑色的“此用戶名可用”的提示，如圖6.2.2所示。圖6.2.1

用戶名不可用的效果圖

圖6.2.2

用戶名可用的效果圖6.2.8在Chrome瀏覽器中調試網絡通信

（1）按“F12”鍵，可以打開或關閉瀏覽器“開發者工具”。在開發者工具中單擊上面“網絡”選項卡，然后把鼠標光標移至用戶名文本框中，再單擊其他地方讓用戶名控件失去焦點，此時，可以清楚地看到在“網絡”面板中出現一條網絡請求，如圖6.2.3所示。在名稱一欄將顯示具體請求的目標網址，并顯示狀態、類型等。這個狀態默認是請求成功后返回的200。如果請求的文件不存在，則返回404。具體的HTTP狀態碼有很多，大家可以查詢相關資料進一步了解。圖6.2.3

在開發者工具中查看網絡請求（2）在查看網絡請求時，默認會顯示請求圖片、JavaScript文件、CSS文件等所有的網絡請求，而我們在使用AJAX時，只關心異步請求后端接口文件的情況，因此，我們可以單擊“過濾”選項中的“Fetch/XHR”進行網絡請求的過濾顯示。（3）在網絡請求面板中單擊“checkUsername.php”文件，在右邊會顯示這一次網絡請求的詳情，圖6.2.4中顯示的是“預覽”選項卡中的內容，其中會顯示后端文件返回的結果。可以看到，這里返回的是一個JSON對象，其中包括code和msg兩個屬性。圖6.2.4

查看網絡請求詳情（4）單擊“標頭”選項卡，可以查看這一次網絡請求的響應標志頭、請求標志頭等詳情，當訪問后端文件出現問題時，這個選項卡中的內容可以幫助我們查詢請求的各種標志頭等信息，有利于判斷問題之所在。在“載荷”選項卡中可以看到前端傳遞給后端的具體參數。子任務6.3beforeSend的使用

使用AJAX方式的優勢很明顯，即在頁面不刷新的情況下，可以直接更新頁面內容，使得用戶體驗更好。但由于不是同步操作，所以如果網絡較慢等情況導致更新延遲，用戶體驗就會大打折扣。為了解決這個問題，AJAX提供了一個beforeSend回調函數，在發起請求時，可以在頁面中顯示加載中（loading）圖標，給用戶明確的提示，這樣用戶體驗會更好。

當用戶名文本框失去焦點時，執行AJAX程序，向后端發起請求。這個請求發起后要后端程序執行結束，并返回結果以后，前端頁面才會執行相應的更新。在使用jQuery的AJAX時，可以在complete、success、error這3個回調函數中進行處理，也就是說，當后端程序執行完畢，并將結果返回給前端后，complete回調一定會執行。

如果執行成功，則還會執行success回調，如果執行失敗，則執行error回調。在發起請求之前，執行beforeSend回調。因此，可以在beforeSend中顯示一個加載中圖標，在complete、success、error中隱藏加載中圖標。子任務6.4登錄時使用AJAX判斷用戶名是否有效6.4.1修改login.php文件6.4.2顯示異步登錄的效果

完成相關代碼后，小王同學測試了最終的結果。圖6.4.1所示是輸入正常的用戶名后，異步查詢顯示“√”的結果。

圖6.4.2所示是輸入不存在的用戶名后，異步查詢顯示“×”的結果。

圖6.4.1

輸入用戶名正確

圖6.4.2

輸入用戶名錯誤子任務6.5驗證碼的使用【知識儲備】1．驗證碼簡介

什么是驗證碼？驗證碼CAPTCHA是“CompletelyAutomatedPublicTuringtesttotellComputersandHumansApart”（全自動區分計算機和人類的圖靈測試）的縮寫，是一種區分用戶是計算機還是人的公共全自動程序。驗證碼這個詞最早于2002年由美國卡內基梅隆大學的路易斯·馮·安（LuisvonAhn）等人提出。

卡內基梅隆大學曾試圖申請此詞為注冊商標，但該申請于2008年4月21日被拒絕。一種常用的CAPTCHA是讓用戶輸入一張扭曲變形的圖片上顯示的文字或數字，使圖片扭曲變形是為了避免被光學字符識別（OpticalCharacterRecognition，OCR）之類的計算機程序自動辨識出圖片上的文字、數字而失去效果。由于這個測試是由計算機來考驗人類，而不是像標準圖靈測試中那樣由人類來考驗計算機，所以人們有時稱CAPTCHA是一種反向圖靈測試。2．驗證碼的類型

常見的驗證碼類型有圖像類型、語音類型、視頻類型、短信類型等。圖6.5.1所示為一個典型的圖像類型的驗證碼。圖6.5.1

圖像類型的驗證碼3．驗證碼的作用（1）防止惡意破解密碼。例如，一些黑客為了獲取用戶信息，通過不同的手段向服務器發送數據，猜測用戶的信息。（2）防止惡意刷票、論壇“灌水”。以論壇為例，可能會存在某些用戶連續不停地發布一些無意義的帖子。使用驗證碼可以降低用戶發布的頻率，同時可以避免使用機器人發帖。結合程序其他功能的限制，可以防止惡意刷票和論壇“灌水”。（3）防止惡意請求。例如，用戶提交一個表單信息，通過不斷向后臺請求數據信息造成服務器資源浪費，以及惡意攻擊。（4）提高趣味性。如果能在網站中設計一些有趣的驗證碼方式，則也能在一定程度上提高用戶對網站的喜愛程度。（5）獲取用戶信息。這一點在目前的網站中已經屢見不鮮了。例如，我們注冊一個網站的賬號，需要通過手機驗證碼才可以注冊成功。6.5.1安裝GD庫

要在PHP中使用驗證碼，必須先保證PHP的GD擴展庫（簡稱GD庫）已經打開。GD庫（也可以稱為GD2函數庫）是一個開源的用于創建圖像的函數庫，該函數庫由C語言編寫，可以在Perl、PHP等多種語言中使用。GD庫提供了一系列用來處理圖片的API，使用GD庫可以處理圖片、生成圖片，也可以給圖片加水印等。

安裝PHP以后，默認已經包含很多的擴展。通過安裝擴展可以實現更多的功能。

以小皮面板為例，安裝好小皮面板以后，在“D:\phpstudy_pro\

Extensions\php\php7.3.4nts\ext”目錄下存放了PHP的各種擴展文件，如圖6.5.2所示。要安裝新的擴展，只需要將擴展文件（DLL文件）復制到這個目錄中，然后在php.ini文件中添加即可。要開啟或關閉小皮面板自帶的擴展，打開小皮面板的“網站”面板，然后在具體的某一個網站上單擊“管理”→“php擴展”命令，再選擇某個擴展進行管理即可，如圖6.5.3所示。

圖6.5.3中的“gd2”就是PHP的GD庫，對應的文件是php_gd2.

dll。此時，如果打開小皮面板的“設置”→“配置文件”→“php.ini”，然后在其中搜索“gd2”，就可以看到“extension=gd2”，這表示已經開啟了GD庫。要關閉某個擴展，只需要在這一行前面添加一個分號（表示注釋）即可，如圖6.5