PHP動態網站開發項目教程(微課版) 課件全套 牟奇春 項目1-14 會員管理系統 - Laravel中的表單驗證、數據庫操作_第1頁
PHP動態網站開發項目教程(微課版) 課件全套 牟奇春 項目1-14 會員管理系統 - Laravel中的表單驗證、數據庫操作_第2頁
PHP動態網站開發項目教程(微課版) 課件全套 牟奇春 項目1-14 會員管理系統 - Laravel中的表單驗證、數據庫操作_第3頁
PHP動態網站開發項目教程(微課版) 課件全套 牟奇春 項目1-14 會員管理系統 - Laravel中的表單驗證、數據庫操作_第4頁
PHP動態網站開發項目教程(微課版) 課件全套 牟奇春 項目1-14 會員管理系統 - Laravel中的表單驗證、數據庫操作_第5頁
已閱讀5頁,還剩576頁未讀 繼續免費閱讀

下載本文檔

版權說明:本文檔由用戶提供并上傳,收益歸屬內容提供方,若內容存在侵權,請進行舉報或認領

文檔簡介

牟奇春主編PHP動態網站開發項目教程(微課版)項目1會員管理系統任務1準備開發環境和編程環境子任務1.1配置PHP開發環境【知識儲備】

PHP(PageHypertextPreprocessor)即“頁面超文本預處理器”,是在服務器端執行的腳本語言,尤其適用于Web開發,并可嵌入超文本標記語言(HypertextMarkupLanguage,HTML)中。PHP的語法是在學習了C語言、吸納了Java和Perl等多種語言特色的基礎之上發展而來的,并根據它們的長項,如Java的面向對象編程,持續提升自己。當初創建PHP語言的主要目標是讓開發人員快速編寫出優質的網站。PHP同時支持面向對象和面向過程的開發,使用非常靈活。

PHP是一種在服務器端執行的Web應用程序腳本語言,其開發環境主要包括PHP解釋器、Web服務器、數據庫服務器及編輯器。PHP支持Windows和Linux等多種操作系統。PHP典型開發環境配置為Windows+Apache+MySQL+PHP(簡稱WAMP),而Linux系統下的配置為Linux+Apache+MySQL+PHP(簡稱LAMP)。

Apache(音譯為阿帕奇)可以運行在幾乎所有廣泛使用的計算機平臺上,由于其具有支持跨平臺和安全性高的優點而被廣泛使用,是最流行的Web服務器端軟件之一。它快速、可靠并且可通過簡單的應用程序接口(ApplicationProgramInterface,API)擴充,將Perl、Python等的解釋器編譯到服務器中。

MySQL是一個關系數據庫管理系統(RelationalDatabaseManagementSystem,RDBMS),由瑞典MySQLAB公司開發,屬于Oracle旗下產品。MySQL是最流行的關系數據庫管理系統之一,在Web應用方面,MySQL是最好的關系數據庫管理系統應用軟件之一。

采用PHP語言編寫完成的程序,其擴展名是.php,這種文件是不能直接在瀏覽器中運行的,需要通過配置服務器環境的方式來運行。因此,在運行PHP文件之前,必須配置PHP開發環境,以及服務器環境。

【任務實施】1.1.1安裝小皮面板

小皮面板是PhpStudy的簡稱,其官網提供了Linux和Windows兩種版本,進入小皮面板的官網后,根據自己的環境選擇下載相應的版本即可。

安裝完成后,打開安裝好的小皮面板,界面如圖1.1.1所示。圖1.1.1

安裝好小皮面板打開后的界面1.1.2配置小皮面板

進入小皮面板后,默認處于“首頁”,在右邊的“套件”欄中單擊“Apache2.4.39”后面的“啟動”按鈕,以啟動ApacheWeb服務,單擊“MySQL5.7.26”后面的“啟動”按鈕,以啟動MySQL數據庫環境。如果系統沒有沖突,則在正常情況下,這兩個軟件將會成功啟動,如圖1.1.2所示。MySQL5.7.26是默認的版本,如果需要使用MySQL8或其他版本,則只需要在左側單擊“軟件管理”,然后安裝其他版本的數據庫即可,如圖1.1.3所示。圖1.1.2

成功啟動PHP運行環境圖1.1.3

在軟件管理中安裝不同版本的數據庫

在窗口左側單擊“網站”,彈出一個對話框,可以在此配置網站,如圖1.1.4所示。在“域名”文本框中可輸入自定義的域名,如test。在“根目錄”下選擇PHP程序所在的文件夾,根據需要,可以切換PHP版本(安裝小皮面板以后,默認使用PHP7,如果要使用其他版本的PHP,則切換至“軟件管理”),然后在PHP的相關版本選項中選擇所需版本進行安裝,如圖1.1.5所示。

圖1.1.4

配置網站

圖1.1.5

安裝不同版本的PHP

網站配置成功后,即可在瀏覽器中輸入自定義的域名訪問網站。

如果要使用MySQL數據庫,則切換至“數據庫”面板,在其中可以創建新的數據庫。系統默認的數據庫管理員用戶名是root,要修改此用戶對應的密碼,可以單擊右邊的“操作”→“修改密碼”,如圖1.1.6所示。圖1.1.6

修改數據庫管理員的密碼子任務1.2使用PHP編程環境【知識儲備】

PhpStorm是JetBrains公司開發的一款商業化的PHP集成開發工具,其主要特色如下。(1)提供智能代碼輔助功能。PhpStorm是一個能夠真正“解析”所寫代碼的PHPIDE。它支持PHP5.3~PHP8.1,可以提供實時錯誤預防、最佳自動補全與代碼重構、零配置調試等功能,以及擴展的HTML、CSS和JavaScript編輯器。在處理大型項目時,PhpStorm可以顯著提高編碼效率,并節省時間。(2)提供調試、測試和性能分析功能。PhpStorm為調試、測試和分析應用程序提供了強大的內置工具。PhpStorm提供多個選項,可以利用可視化調試器調試PHP代碼。(3)PhpStorm包含WebStorm以及與HTML、串聯樣式表(CascadingStyleSheets,CSS)和JavaScript有關的所有功能。它支持所有尖端的Web開發技術,包括HTML5、CSS、Sass、Scss、Less、CoffeeScript、ECMAScriptHarmony和Jade模板等。(4)PhpStorm建立在開源的IntelliJIDEA平臺之上,產品自發布以來,JetBrains公司一直在不斷發展和完善這個平臺。【任務實施】1.2.1PhpStorm的安裝和啟動

單擊“Open”按鈕,打開PHP文件進行編輯。單擊“CreateNewProject”按鈕可以開始創建新的項目。需要注意的是,一般情況下都需要按照項目的形式來編輯文件,而不要單獨打開一個文件來進行編輯。也就是說,應該在PhpStorm中打開(Open)項目所在的根目錄,然后在PhpStorm中編輯某個文件,而不要直接打開一個具體的文件來進行編輯。圖1.2.1

PhpStorm軟件啟動界面1.2.2在小皮面板中配置網站

圖1.2.2

創建網站

圖1.2.3

打開剛創建的網站1.2.3在PhpStorm中編輯文件和配置服務器環境(1)在PhpStorm中打開E:\test目錄,如圖1.2.4所示。此時,左邊的“Project”自動顯示test,這就是當前項目的根目錄。選中test再單擊鼠標右鍵,選擇“New”→“PHPFile”命令,如圖1.2.5所示,可以創建一個新的PHP文件,將文件命名為index.php。

圖1.2.4

在PhpStorm中打開E:\test目錄

圖1.2.5在E:\test目錄中創建index.php文件

創建好PHP文件后,系統自動打開此文件。在右邊的編輯窗口中輸入圖1.2.6所示的內容。圖1.2.6

在index.php中輸入內容(2)接下來配置服務器環境。選擇“File”→“Settings”→

“Build,Execution,Deployment”→“Deployment”命令,在右邊面板中單擊“+”,再單擊“Inplace”,就創建了一個新的服務器,如圖1.2.7所示。在彈出的對話框的“Newservername”文本框中給新建的服務器取一個名字,如test,然后在右邊的“WebserverURL”文本框中輸入“http://test”即可,如圖1.2.8所示。圖1.2.7

創建新的服務器

圖1.2.8設置服務器URL根路徑(3)配置好服務器后,要運行文件查看效果時,只需將鼠標指針移至編輯窗口右邊的瀏覽器圖標并單擊即可,如圖1.2.9所示。單擊Chrome瀏覽器圖標后,系統打開Chrome瀏覽器,并自動打開index.php文件進行顯示,如圖1.2.10所示。圖1.2.9

運行程序圖1.2.10

程序運行結果【素養小貼士】

我國對知識產權保護的立場是非常堅定的。知識產權保護的相關法律規定有很多,已經形成了比較完整的體系,包括《中華人民共和國商標法》《中華人民共和國專利法》《中華人民共和國著作權法》《中華人民共和國反不正當競爭法》及一些條例解釋等。

一旦侵犯知識產權,根據具體的情況,可能需要承擔一定的民事、刑事責任,或會受到行政處罰。因此,我們應該積極抵制盜版軟件,維護知識產權,堅持購買和使用正版書刊、音像制品、電腦軟件,并主動勸親友不購買、不使用盜版制品,不閱讀、不傳播盜版讀物。如果發現有制作、販賣盜版制品和其他侵犯商標權、著作權的行為,應該積極舉報。【任務小結】

在任務1中,我們主要學習了PHP開發環境的配置和PHP編程環境的使用。

我們以小皮面板為例,學習了如何配置PHP開發環境。小皮面板簡單易用,使用靈活,幾乎可以滿足我們在程序開發中的所有要求。在生產環境中也可以使用小皮面板來部署環境。因此,掌握小皮面板的使用方法非常重要。學會使用小皮面板,再使用其他常用的PHP開發環境,也是一件比較簡單的事情。

PhpStorm是一個非常優秀的PHPIDE,其優勢非常明顯,但軟件本身的使用配置略顯復雜,大家可以通過網絡查詢其使用技巧。另外,軟件本身是英文版的,如果同學們使用起來覺得不太方便,則可以選擇“File”→“Settings”→“Plugins”命令,在其中安裝中文語言包,這樣,整個軟件就變成中文版了。牟奇春主編PHP動態網站開發項目教程(微課版)任務2項目前端開發子任務2.1項目開發前的準備工作【任務提出】

要制作項目,首先需要進行需求分析。小王同學計劃制作的第一個項目是“會員管理系統”。會員管理系統是大多數項目的必備模塊,完成這個項目對其他項目的完成將有極大的幫助。【任務實施】2.1.1項目需求設定

圖2.1.1~圖2.1.4所示為小王同學設計的會員管理系統的運行頁面。圖2.1.1

會員注冊頁面圖2.1.2

會員登錄頁面圖2.1.3

管理員頁面圖2.1.4

會員資料修改頁面2.1.2PHP的發展歷史

PHP繼承自一個名叫PHP/FI的工程。PHP/FI最早于1994年由拉斯姆斯·勒多夫(RasmusLerdorf)創建,最初只是一套簡單的Perl腳本,用來跟蹤訪問他主頁的人們的信息。到1996年發展為PHP/FI2.0,也就是它用C語言實現的第二版,在全世界已經有幾千個用戶(估計)和大約50,000個域名安裝,大約是Internet所有域名的1%。

PHP/FI2.0在經歷數個Beta版本的發布后,于1997年11月發布了官方正式版本。隨著PHP3.0的第一個Alpha版本的發布,PHP逐漸走向了成功。

1998年的冬天,PHP3.0官方正式版本發布不久,安迪·古特曼斯(AndiGutmans)和澤弗·蘇拉斯凱(ZeevSuraski)開始重新編寫PHP代碼。。新的引擎被稱為“ZendEngine”(這是Zeev和Andi的縮寫),成功地實現了這些設計目標,并在1999年中期首次引入PHP。基于該引擎并結合了更多新功能的PHP4.0,在PHP3.0發布一年多后,于2000年5月發布了官方正式版本。

PHP5.0在長時間的開發及發布了多個預發布版本后,于2004年7月發布官方正式版本。它的核心是ZendEngine2代,引入了新的對象模型和大量新功能。

2015年12月3日,PHP7.0問世了,這是PHP的一次飛躍。PHP7.0修復了大量的bug,新增了大量功能和語法糖。這些改動涉及核心包、GD庫、PDO、ZIP、ZLIB等人們熟悉和不熟悉的核心功能與擴展包。

PHP7.0移除了已經被廢棄的函數,如“MySQL_”系列函數。PHP7.0的性能高于HHVM[HipHopVirtualMachine,全稱為HipHop虛擬機,會將PHP代碼轉換成高級別的字節碼,通常稱為中間語言。在運行時,HHVM通過即時編譯器將字節碼轉換為x64的機器碼。在這些方面,HHVM十分類似于C#的公共語言運行時(CommonLanguageRuntime,CLR)和Java的Java虛擬機(JavaVirtualMachine,JVM)],并且是PHP5.6性能的兩倍。

2020年11月26日,PHP官方發布了PHP8.0的官方正式版本。子任務2.2創建首頁【任務實施】2.2.1創建項目

各項準備工作就緒,小王同學要正式開始第一個項目的制作了。(1)在磁盤中創建一個目錄,名為member,如E:\member。(2)在小皮面板中配置一個網站,域名為“member”,如圖2.2.1所示。(3)打開PhpStorm,在啟動界面中選擇“Open”,打開E:\member目錄,如圖2.2.2所示。(4)選中項目根目錄member并單擊鼠標右鍵,在彈出的快捷菜單中選擇“New”→“PHPFile”命令,創建index.php文件。成功創建文件后,系統會自動打開此文件。在打開的文件中刪除文件中默認的代碼,然后在文件中輸入“html:5”,再按“Tab”鍵,系統會自動創建HTML5格式文檔基礎標簽代碼(這是PhpStorm中的鍵盤快捷方式,類似的操作還有很多,可以通過網絡查詢,了解更多快捷方式)。圖2.2.1

配置網站域名圖2.2.2

使用PhpStorm打開項目(5)將title修改為“會員管理系統”,然后在頁面中創建1個標題和5個導航菜單項,并添加相應的CSS樣式。圖2.2.3

預覽項目首頁效果2.2.2部署項目

在PhpStorm中選擇“File”→“Settings”→“Build,

Execution,Deployment”→“Deployment”命令,如圖2.2.4所示。圖2.2.4

在PhpStorm中部署項目

在右邊單擊“+”,選擇“Inplace”命令,然后在彈出的對話框的“Newservername”文本框中輸入服務器的名字,這個名字可以自定義,小王同學就直接輸入member,如圖2.2.5所示。圖2.2.5

創建服務器

創建好服務器后,在右側的“WebserverURL”文本框中輸入在小皮面板中創建好的域名即可,如圖2.2.6所示。圖2.2.6

設置服務器URL根路徑子任務2.3制作注冊頁面前端部分【任務實施】2.3.1創建文件

在創建注冊頁面時,可以參考首頁文件中的部分內容,特別是導航欄部分。(1)選中index.php文件并單擊鼠標右鍵,在彈出的快捷菜單中選擇“Copy”→“Copy”命令。(2)選中member目錄并單擊鼠標右鍵,在彈出的快捷菜單中選擇“Paste”命令。(3)在彈出的對話框中輸入新的文件名“signup.php”。(4)單擊“Refactor”按鈕,即可生成signup.php文件,如圖2.3.1所示。圖2.3.1

復制文件(5)將首頁中的導航欄代碼復制到signup.php文件中。由于在首頁中創建的導航鏈接在注冊頁面中也需要,相當于其是一個公共部分,因此,這里采用了復制的方式來創建注冊頁面。復制代碼后,需要修改導航欄中當前欄目的代碼,將“首頁”鏈接上的current樣式刪除,然后在“會員注冊”鏈接上添加current樣式。2.3.2制作注冊頁面表單

需要注意的是,在制作表單時,需要在“<form>”標簽中設置“action”屬性,表示單擊“提交”按鈕后,將各項數據發送至對應的網頁文件進行處理。小王同學在這里設置的action屬性值是postReg.php,表示單擊“提交”按鈕后,會將用戶填寫的各項數據發送至此文件進行下一步處理。“method”屬性指定了提交文件的方式,可以設置為“GET”和“POST”兩種方式。

2.3.3設置表單控件name屬性

對于表單中的控件而言,每一個控件都需要設置一個“name”屬性,這個屬性用于后端文件讀取其數據。其中每一組單選按鈕和每一組復選框的“name”屬性應該保持一致。對于單選按鈕、復選框、下拉列表框等不能由用戶手動輸入結果的控件,還需要設置“value”屬性,這個屬性的值就是后端文件最終讀取到的值。特別注意,由于復選框可以選多個值,因此,其“name”屬性要在正常的名字后面添加一對方括號,表示其類型是一個數組,這樣才能讀取到多個選項的值。【知識儲備】

小王同學在學習靜態網站開發課程時,沒有注意過表單提交的方式。現在使用PhpStorm創建了表單,在添加“method”屬性時,看到了有兩種不同的表單提交方式,分別是“GET”和“POST”。那么這兩種提交方式到底有什么區別呢?通過查詢相關資料,他了解了這兩種方式的區別。(1)GET提交的數據會放在URL之后,以“?”分隔URL和傳輸數據,參數之間用“&”相連,如

EditPosts.php?name=boKeYuan&id=123456;POST提交的數據會放在HTTP包的Body中。(2)GET提交的數據長度有限制(注意:HTTPGET方法提交的數據長度并沒有限制,HTTP規范沒有對URL長度進行限制,這個限制是指特定的瀏覽器及服務器對它的限制);POST提交的數據長度沒有限制。(3)對參數的數據類型要求不同,GET只接收美國信息交換標準代碼(AmericanStandardCodeforInformationInterchange,ASCII);而POST沒有限制。(4)GET請求參數會被完整保留在瀏覽器歷史記錄里;而POST請求參數不會保留。(5)POST比GET更安全,因為參數直接暴露在URL上,所以不能用來傳遞敏感信息。【任務小結】

在任務2中,小王同學主要完成了首頁和注冊頁面前端的制作。這些內容沒有難度,主要是鞏固了上學期靜態網站開發課程的相關知識,同時,結合本項目的需求進行程序編寫。這里的重點是理解表單的兩種不同提交方式的區別,以及表單屬性的設置,特別是“name”屬性和“value”屬性的設置。牟奇春主編PHP動態網站開發項目教程(微課版)任務3會員管理系統用戶注冊子任務3.1獲取表單數據【任務實施】3.1.1從后端獲取前端表單數據

如果前端使用“GET”方式提交數據,則使用“$_GET”;如果前端使用“POST”方式提交數據,則使用“$_POST”。當然,也可以使用“$_REQUEST”全局數組來讀取前端表單提交的數據,這種方式就不區分GET和POST了,均可以讀取前端表單提交的數據。圖3.1.1

后端文件讀取前端表單數據3.1.2書寫PHP代碼

PHP代碼必須放在一對特殊的標簽中,即以“<?php”開始,以“?>”結束。PHP代碼可以和HTML代碼混合書寫。若文件中包含PHP代碼,則文件名必須用“.php”作為擴展名。因為PHP文件可以輸出HTML內容,而HTML文件卻不能包含PHP的相關內容。其根源在于,HTML文件是瀏覽器可以直接解析的,而PHP文件是后端Apache等服務器調用PHP解釋器輸出的HTML內容,瀏覽器并不能直接解析PHP文件及其內容。3.1.3輸出數據子任務3.2創建數據庫和數據表【任務實施】3.2.1開啟數據庫服務

要使用數據庫必須先開啟數據庫服務,或者說必須先啟動數據庫。小皮面板安裝好以后,即可支持創建MySQL數據庫。在小皮面板左側單擊“數據庫”,在其右側可以查看數據庫管理員的用戶名和密碼,如圖3.2.1所示。

單擊“+創建數據庫”按鈕,可以創建新的數據庫,并設置訪問的用戶名和密碼。管理員用戶名默認是“root”,密碼也是“root”,此賬號可以訪問和管理當前服務器中的所有數據庫,是最高權限的用戶。圖3.2.1

小皮面板數據庫管理3.2.2安裝可視化數據庫管理工具

小王同學在查詢資料時從網絡上看到,MySQL數據庫可以使用命令行方式來進行相關操作。但這種方式對初學者極不友好,難度太大。

與命令行方式相對應,還有一種可視化的操作方式,這種方式就好理解多了。在小皮面板中就可以安裝和使用可視化數據庫管理工具。

進入“軟件管理”面板,單擊上方的“工具”→“數據庫工具(客戶端)”按鈕,可以安裝第三方工具軟件來管理MySQL數據庫,如圖3.2.2所示。圖3.2.2

數據庫工具(客戶端)

除了使用工具軟件來管理MySQL數據庫,更常見的是使用Web工具來管理數據庫,這樣更簡便。在上方工具欄中單擊“網站程序”→

“數據庫工具(web)”按鈕,可以看到有一個名為“phpMyAdmin4.8.5”的工具,如圖3.2.3所示,這是純網頁版的MySQL數據庫管理工具,單擊即可安裝。在安裝時,需要選擇安裝的位置,一般選擇安裝在默認的localhost網站中。圖3.2.3

在軟件管理中安裝phpMyAdmin

安裝好phpMyAdmin以后,單擊“管理”按鈕,即可在網頁中打開phpMyAdmin,如圖3.2.4所示。圖3.2.4

在phpMyAdmin中管理數據庫3.2.3創建數據庫和數據表

圖3.2.4左側區域顯示的是系統中已經有的數據庫。接下來,單擊左側的“新建”,然后在右側輸入數據庫的名稱“member”,并單擊“創建”按鈕,即可創建數據庫member。創建好的數據庫member如圖3.2.5所示。圖3.2.5

創建好的數據庫member

有了數據庫以后,接下來就要創建數據表“info”(會員信息表),并在“info”中創建7個數據字段,分別是“id”(id字段,用于唯一標識一行數據)、“username”(用戶名)、“pw”(密碼)、“email”(郵箱)、“sex”(性別)、“fav”(愛好)、“createTime”(創建時間),如圖3.2.6所示。圖3.2.6

創建info數據表3.2.4數據表字段類型說明(1)id:在創建數據表字段時,每一張表都要求有一個id字段,這是表的主鍵,用于唯一標識一行數據。其類型為INT,并勾選后面的“A_I”標識列,將其設置成自增(AUTO_INCREMENT)字段。這個字段在以后使用的過程中,創建記錄時不需要提供值,系統會自動按照順序從1開始,依次提供值。(2)username:VARCHAR類型,長度為50。這里要注意單位。在MySQL4.0及以下的版本中,這里的單位是字節。(3)pw:CHAR類型,長度為32。在數據庫中保存密碼時,不能直接保存明文,需要加密后保存為密文。一般可使用MD5方式進行數據加密,常用的MD5加密數據是32字節的固定長度,因此,密碼字段選擇CHAR類型,長度固定為32字節。(4)email:VARCHAR類型,長度為256。(5)sex:TINYINT類型,長度為1。TINYINT也是INT的一種,TINYINT占用1字節。(6)fav:VARCHAR類型,長度為300。(7)createTime:INT類型,長度為10。創建時間,可以選擇DATETIME類型,也可以選擇INT類型。在DATETIME類型中,將直接保存“年月日時分秒”類型的時間。在INT類型中,保存的是時間戳。時間戳是一個10位的整型數據,具體是指格林尼治時間1970年01月01日00時00分00秒(北京時間1970年01月01日08時00分00秒)至現在的總秒數。子任務3.3將注冊信息寫入數據庫【任務實施】第一步是“連接數據庫服務器”第二步是“設置字符集”第三步是“設置SQL語句”第四步是“執行SQL查詢語句”3.3.1連接數據庫服務器

上述代碼的第2行用于連接數據庫服務器。在PHP中,連接不同的數據庫服務器需要使用不同的連接函數。由于小王同學已經確定了在會員管理系統中使用MySQL數據庫,因此,后面所有的內容均以MySQL數據庫為例進行編碼。在上面的代碼中,第2行使用了mysqli_connect()函數,該函數將打開一個到MySQL數據庫服務器的新連接,其語法規則為:mysqli_connect(host,username,password,dbname,port,socket);

該函數支持6個參數,參數詳情如表3.3.1所示。參數描述host可選。規定主機名或IP地址username可選。規定MySQL用戶名password可選。規定MySQL密碼dbname可選。規定默認使用的數據庫port可選。規定嘗試連接到MySQL服務器的端口號socket可選。規定套接字(socket)文件表3.3.1

mysqli_connect()函數參數詳情

該函數的返回值是一個連接到MySQL服務器的對象,這里使用的是“$conn”。如果該函數執行出錯,則返回false。

在實際使用時,一般來說,主機名都使用“localhost”,代表本地主機,也就是當前運行PHP文件的服務器。用戶名和密碼都使用的是“root”,這是默認的最高權限的賬戶。第4個參數是默認使用的數據庫,在這里使用的是“member”。最后兩個參數可以不用填寫,直接使用默認值。

因為此函數執行失敗會返回false,所以接下來在代碼的第3行中用if語句來判斷“$conn”的真假,如果返回值為false,則通過“!”取反,其結果會變成true,程序進入if分支,會通過die()函數輸出錯誤提示信息,即“連接數據庫服務器失敗”,同時,此函數會中止整個程序的運行。3.3.2設置字符集

上述代碼的第7行用于設置字符集,使用到了PHP中的函數mysqli_query(),這個函數的作用是執行針對數據庫的查詢,其語法規則如下。mysqli_query(connection,query,resultmode);

該函數的參數詳情如表3.3.2所示。參數描述connection必需。規定要使用的MySQL連接query必需。規定查詢字符串resultmode可選。一個常量,可以是下列值中的任意一個:(1)MYSQLI_USE_RESULT(如果需要檢索大量數據,則使用這個);(2)MYSQLI_STORE_RESULT(默認)表3.3.2

mysqli_query()函數參數詳情

針對成功的SELECT、SHOW、DESCRIBE或EXPLAIN查詢,該函數將返回一個mysqli_result對象。針對其他成功的查詢,將返回TRUE。如果失敗,則返回FALSE。

在上述代碼的第7行中,第一個參數是$conn,表示上面第一步生成的數據庫連接對象。第二個參數是“setnamesutf8”,表示將字符集設置成UTF-8,這個字符集要和數據庫的字符集保持一致,否則在顯示中文等特殊內容時會出現亂碼。3.3.3設置SQL查詢語句

上述代碼的第9行使用結構化查詢語言(StructuredQueryLanguage,SQL)設置了一個查詢語句。SQL是一種具有特殊目的的編程語言,是一種數據庫查詢和程序設計語言,用于存取數據,以及查詢、更新和管理關系數據庫系統。

在這里,小王同學使用INSERTINTO語句向數據表中插入新記錄。INSERTINTO語句有兩種編寫形式。

第一種形式無須指定要插入數據的列名,只需提供被插入的值。INSERTINTO

table_nameVALUES(value1,value2,value3,...);

第二種形式需要指定列名及被插入的值:INSERTINTO

table_name

(column1,column2,column3,...)VALUES(value1,value2,value3,...);3.3.4執行SQL查詢語句

上述代碼的第11行用于執行SQL查詢語句。執行SQL查詢語句使用的還是mysqli_query()函數,其返回值是$result。如果系統成功執行了給定的SQL語句,則$result將為真,否則為假。上述代碼的第12~第16行用于通過判斷$result的真假,彈出注冊成功或失敗的提示。

回到注冊頁面,輸入各項數據,如圖3.3.1所示。單擊“提交”按鈕,然后順利看到了“數據插入成功”的提示。接下來,如果進入phpMyAdmin,重新刷新info數據表,就可以在其中看到新插入的一條數據記錄。圖3.3.1

輸入信息進行會員注冊

在PHP程序中,如果執行代碼時出現錯誤,則會在頁面中根據錯誤的級別進行相應的錯誤提示。PHP中的典型錯誤有以下幾種。(1)E_ERROR:這是一種致命的錯誤,遇到這種錯誤時,程序將進行錯誤提示,并終止腳本繼續運行。(2)E_WARNING:這是一種非致命的錯誤,遇到這種錯誤時,程序將進行錯誤提示,但是不會終止腳本繼續運行。(3)E_PARSE:這是一種腳本語法錯誤,是級別最高的錯誤。當出現這種錯誤時,整個腳本根本不會執行。(4)E_NOTICE:這是一種運行時通知消息,表示腳本遇到可能會表現為錯誤的情況,但是在可以正常運行的腳本中也可能會有類似的通知。

在上面將注冊信息寫入數據庫的代碼中,如果故意將mysqli_

connect()函數中的數據庫用戶名輸入錯誤,則運行程序時,在頁面中會顯示出錯誤提示,如圖3.3.2所示。從這個提示來看,系統產生了一個警告(Warning)信息,提示用戶root訪問數據庫失敗。這時需要檢查數據庫用戶名和密碼是否正確。

重新修改為正確的密碼后,刷新瀏覽器,系統彈出“數據插入成功”的提示,如圖3.3.3所示。

圖3.3.2

會員注冊出錯

圖3.3.3

會員注冊成功

此時,進入數據庫,查看結果,可以看到新插入的一條數據記錄,如圖3.3.4所示。3.3.5項目階段性成果

圖3.3.4

新插入的數據記錄子任務3.4判斷用戶名是否被占用【任務實施】

由于每一個會員的用戶名是唯一的,就好比人的身份證號碼一樣,不能重復。因此,在插入新的記錄時,需要先判斷當前用戶名是否在數據表中已經存在。如果已經存在,則應該彈出提示,讓用戶重新輸入不同的用戶名。如果用戶名在數據表中不存在,則說明是一個全新的用戶名,可以直接寫入數據庫。3.4.1通過SQL語句判斷用戶名是否被占用

3.4.2使用SQL中的SELECT語句

參數描述result必需。規定由

mysqli_query()、mysqli_store_result()或

mysqli_use_result()返回的結果集標識符表3.4.1

mysqli_num_rows()函數參數詳情

在PHP中,任何非零非空的值均表示true。因此,只要結果集中有記錄,$num就是一個大于0的數字,其結果為真,表示查詢到了此用戶名(當然,根據info數據表的設計原則,如果找到了數據,則一定只能找到一條數據,也就是$num要么為0,要么為1)。如果查詢到了此用戶名,則通過echo函數顯示JavaScript彈窗提示該用戶名已經被占用。參數描述string必需。規定要檢查的字符串表3.4.2

strlen()函數參數詳情

該函數如果執行成功,則返回字符串的長度,如果字符串為空,則返回0。如果返回0,對于if條件語句而言,結果就是false,因此,用“!”運算符取反就得到true。一旦用戶名為空,或者密碼為空,系統都會顯示彈窗。exit()函數可以輸出一條消息,并退出當前腳本(中止當前程序的執行)。該函數是

die()

函數的別名。3.4.3在PhpStorm中配置數據源

注冊功能已經完成了,可是,小王同學突然注意到,他在PhpStorm中所寫的SQL語句被標記有黃色底紋。同時,把鼠標指針移至底紋上,系統還出現了一些提示信息,如圖3.4.1所示。圖3.4.1

未配置數據源和SQLDialect的提示圖3.4.2

配置SQLDialect圖3.4.3

未配置數據源的提示

注意觀察,數據源配置界面下面有一個提示,即“missingdriverfiles”,表示系統缺少驅動文件。單擊前面的“Download”,系統會自動下載當前驅動程序。最后單擊“TestConnection”按鈕,測試是否能正常連接數據庫。由于PhpStorm的版本不同,此時可能會出現圖3.4.5所示的錯誤提示信息。此信息表明當前Web服務器時區配置錯誤,單擊“Settimezone”,將默認的UTC時區修改成PRC時區即可,如圖3.4.6所示。這個時區非常重要,關系到系統時間是否正確。圖3.4.4

配置數據源和驅動圖3.4.5

服務器時區配置錯誤圖3.4.6

配置服務器時區

配置好上述內容后,在PhpStorm的右側出現一個Database標簽,單擊可以展開,在其中可以看到當前member數據庫的詳細情況,如圖3.4.7所示。圖3.4.7

配置好的數據源子任務3.5表單驗證【任務實施】3.5.1重視數據驗證

數據驗證需要在前端和后端同時進行,這樣做的目的是保證系統安全,以及減輕服務器的壓力。比如,用戶明明沒有填寫用戶名,還去單擊“提交”按鈕,這顯然是沒有意義的。如果在前端不進行判斷和處理,那么這一次無效的交互仍然要占用服務器的資源。另外,本系統的后端主要是使用SQL語句和數據庫進行交互,如果在前端不加以限制,則可能會輸入一些危險字符,帶來SQL注入風險。3.5.2在前端驗證表單數據

前端數據驗證一般是使用JavaScript來進行的。為了避免前端繞過數據驗證,在后端接收到數據后,還需要再一次進行數據驗證。

在會員注冊表單中,需要驗證的內容如下。(1)用戶名。必填,內容只能是大小寫字母、數字,長度為3~10個字符。(2)密碼。必填,內容只能是大小寫字母、數字、“_”、“*”,長度為6~10個字符。(3)確認密碼。必填,且必須和密碼保持一致。(4)信箱。格式必須正確,可以不填。(5)愛好。可以不選。

在單擊“提交”按鈕時,要攔截系統提交,即先驗證數據,合格后再提交表單。只需要在<form>標簽中添加一個onsubmit事件,即可實現提交攔截。3.5.3在前端驗證數據

解讀一下小王同學寫的代碼。在代碼的第3行,document.

getElementsByName()讀取名字為“username”的元素,這樣就可以得到一個數組。但在整個注冊頁面中,只有一個username元素,因此,取此數組的第一個元素,然后讀取其value屬性,即可得到用戶輸入的用戶名,再使用“trim()”方法刪去其前后用戶可能不小心輸入的空格。3.5.4在后端驗證表單數據

在前端完成了數據驗證,為了提高安全性與可靠性,在后端也必須完成表單數據驗證。

在前端使用JavaScript來完成表單驗證,主要使用正則表達式來完成驗證。在后端同樣可以使用正則表達式來完成驗證,只是使用的方法有點不同。參數描述pattern要搜索的模式,為字符串形式subject輸入字符串matches如果提供了參數matches,則它將被填充為搜索結果。$matches[0]將包含完整模式匹配到的文本,$matches[1]將包含第一個捕獲子組匹配到的文本,以此類推flagsflags可以被設置為以下標記值。PREG_OFFSET_CAPTURE:如果傳遞了這個標記,則對于每一個出現的匹配返回時會附加字符串偏移量(相對于目標字符串)offset通常,搜索從目標字符串的開始位置開始。可選參數offset用于指定從目標字符串的某個位置開始搜索(單位是字節)表3.5.1

preg_match()函數參數詳情

作為計算機軟件從業人員,應當具備和遵守嚴格的職業道德規范,包括但不限于以下方面。(1)尊重客戶隱私。在工作中,不可避免地會接觸到客戶的各種信息。這些信息是客戶的隱私,僅限于工作過程中使用,不得泄露、傳播。(2)保護知識產權。在從事軟件開發的過程中,會涉及不同硬件、軟件的使用。這要求從業人員能夠保護知識產權,切不可侵權,否則要承擔相應的法律責任。(3)培養誠信、守時的意識和習慣。在工作崗位中,要重視合同、協議和指定的責任,要按照規定的時間,認真完成各項工作。【任務小結】

在任務3中,我們創建了數據庫,并完成了用戶注冊的功能。在用戶注冊時,還需要判斷用戶名是否重復。同時,為了保證數據的安全性和合法性,我們在前端和后端都進行了數據驗證,驗證的方法主要是使用正則表達式。正則表達式本身也較為復雜,有很多的語法規則,大家如果想全面了解正則表達式的相關內容,可以去網上查詢相關資料。牟奇春主編PHP動態網站開發項目教程(微課版)任務4會員管理系統用戶登錄、資料修改及注銷子任務4.1用戶登錄4.1.1創建用戶登錄文件

根據項目開始前完成的詳細需求分析,現在需要完成登錄頁面的制作。(1)選中member目錄并單擊鼠標右鍵,在快捷菜單中選擇“New”

→“PHPFile”命令,創建新文件login.php。(2)打開signup.php文件,把其中的內容復制到login.php中。因為登錄頁面和注冊頁面的靜態內容有一定的相似之處,所以可以直接把注冊頁面的內容復制過來,然后進行修改。(3)在login.php文件中修改導航欄中的當前欄目,在“會員登錄”鏈接上添加class樣式“current”。在表單中只保留用戶名和密碼控件,刪除其他控件。同理,在JavaScript方法check()中只保留用戶名和密碼的相關驗證內容。(4)選中member目錄并單擊鼠標右鍵,在快捷菜單中選擇“New”

→“PHPFile”命令,創建新文件postLogin.php。(5)在login.php文件中修改<form>標簽中的action屬性,將其值改成postLogin.php即可。4.1.2制作用戶登錄后端文件

在SQL語句中,通過select關鍵字來實現查詢,通過where子句來實現數據記錄的篩選。篩選的依據是,判斷username這一列是否存在數據等于用戶輸入的用戶名,pw這一列是否存在數據等于用戶輸入的密碼經過MD5加密后的結果。4.1.3通過Session變量保存登錄標志

PHP中的Session變量用于存儲關于用戶會話(Session)的信息,或者更改用戶會話的設置。Session變量存儲單一用戶的信息,并且對于應用程序中的所有頁面都是可用的。

存儲和取出Session變量的正確方法是使用PHP中的$_SESSION全局變量。如果要刪除某些Session變量,則可以使用unset()或session_destroy()函數。unset()函數用于釋放指定的Session變量,而session_destroy()可以刪除所有的Session變量。

需要注意,Session是有生命周期的,長時間不操作該網站,Session將會過期,過期的Session會被自動刪除。Session的默認生命周期是1440s,可以在php.ini配置文件中修改和設置,或者直接在PHP文件中使用代碼來重新設置生命周期。子任務4.2注銷登錄4.2.1在導航欄中使用文件包含

項目制作到這里,小王同學發現,頁面頂部的導航欄會在每一個頁面中顯示,這些代碼在每一個文件中重復出現,借鑒前面完成conn.php文件的經驗,應該也可以用同樣的方法,即將導航欄代碼放到一個單獨的文件中,以優化代碼。

選中member目錄并單擊鼠標右鍵,創建新文件nav.php,并將原來導航欄相關的CSS、HTML代碼移植過來。

修改index.php、signup.php、login.php文件,在原來導航欄代碼的位置用include_once()包含nav.php文件。需要注意的是,由于在nav.php文件中使用了Session,因此,在其他文件中引用此文件之前,都需要先開啟會話。

可以看到,小王同學在導航欄中添加了當前登錄者的用戶名和注銷登錄的鏈接。其中使用了一個函數isset(),這個函數用于判斷變量是否存在。if(isset($_SESSION['loggedUsername'])&&$_SESSION['loggedUsername']<>'')的作用是,首先判斷$_SESSION['loggedUsername']是否存在,如果不存在,則直接返回false;如果存在,則判斷$_SESSION['loggedUsername']是否為空。登錄成功后,$_SESSION['loggedUsername']中保存的是當前登錄者的用戶名。如果這兩個條件均為true,則if條件判斷語句結果為true,顯示當前登錄者的用戶名和注銷登錄的鏈接。4.2.2實現導航欄當前欄目高亮功能

完成導航欄的文件包含后,小王測試了一下項目,發現單擊導航欄中的各個欄目后,無法實現當前欄目的高亮顯示。通過思考他發現了問題,就是當前欄目會在當前鏈接的“<a>”標簽上添加一個樣式current。現在使用的是包含文件,無法知道當前是哪個欄目,樣式current也就不知道應該添加在哪個鏈接上。

經過反復研究,小王同學終于想到了一個辦法來解決此難題。他使用的具體方法是,在nav.php文件中的各個導航鏈接上添加一個id參數,當其他頁面包含nav.php文件后,在單擊鏈接跳轉時,會同時傳遞這個id參數,然后在nav.php中讀取這個參數,根據參數的值來決定給哪一個欄目添加當前欄目指示。這里就涉及PHP各個頁面之間參數傳遞的方法。一個簡單的頁面間傳參的方式是在URL后面添加參數,使用“?”進行地址和參數的分隔,用等號連接參數名和具體的值,如果有多個參數,則使用“&”連接即可。

其中地址欄傳遞過來的參數在后端頁面中可以使用$_GET讀取。在讀取之前,應該先用isset()函數判斷id參數是否存在。比如,當用戶第一次進入系統,打開首頁,這里包含的nav.php文件沒有id參數,自然也就無法讀取到id。只有單擊某個導航鏈接跳轉至新的頁面時,才會傳遞id參數。圖4.2.1

系統提示

在PhpStorm的右下角默認顯示有一個“PHP:5.6”鏈接,表示當前IDE設置的PHP版本是5.6,單擊可以設置PHP的版本,如圖4.2.2所示。根據前面Web服務器的配置(請參考圖2.2.1中的“PHP版本”),在這里將PHP的版本設置成7.3即可。經過重新設置,紅色波浪線會自動消失。圖4.2.2

設置PHP版本

session_destroy()函數的作用是刪除所有會話。當然需要注意的是,使用session_destroy()之前還是需要先開啟會話。刪除會話后,再使用header()函數即可直接跳轉至index.php文件。

接下來小王同學測試了項目的運行,得到了圖4.2.3所示的結果。圖4.2.3

登錄成功后在導航欄顯示登錄者的用戶名子任務4.3會員資料修改4.3.1優化登錄頁面跳轉邏輯

小王同學查看了已經做好的用戶登錄功能,當登錄成功后,保存了登錄標志,就沒有執行其他操作了,頁面也還是繼續停留在登錄頁面,這顯然不太合理。登錄成功后應該跳轉到首頁才比較合理。

小王同學把postLogin.php文件修改了一下,添加了登錄成功后的跳轉功能。如果登錄成功,則跳轉至首頁。如果登錄失敗,則返回至上一個頁面,讓用戶重新輸入用戶名和密碼進行登錄。4.3.2創建會員資料修改頁面

通過分析會員資料修改頁面的特點,小王同學梳理了制作的思路。(1)在member項目中新建文件modify.php。在制作導航欄時,已經在nav.php中的“個人資料修改”鏈接添加了目標鏈接頁面modify.php,但還未制作此文件,因此需要創建此文件。(2)從signup.php文件中復制代碼,然后粘貼到modify.php文件中。由于資料修改頁面和注冊頁面有較高的相似性,因此可以直接從signup.php文件中復制代碼,再進行適當修改。(3)在表單中顯示已有的各項資料。(4)修改資料后,單擊“提交”按鈕,將各項數據提交至后端,使用SQL中的update語句更新數據表記錄,即可完成資料更新操作。(5)修改資料時,要注意密碼的處理方式。可以考慮兩種方式:第一種方式是,密碼默認留空,如果要修改,就填寫新的密碼和確認密碼,不填寫就不修改密碼;第二種方式是,在密碼后面添加一個復選框,勾選代表要修改密碼,不勾選代表不修改密碼。(6)修改資料時,還要注意檢查當前是否處于登錄狀態。只有登錄以后才能修改資料。同時,一般來說,用戶名是不允許修改的。

通過上述分析,小王同學查詢了各種相關資料,順利地完成了修改資料的功能。參數描述result必需。規定由mysqli_query()、mysqli_store_result()或

mysqli_use_result()返回的結果集標識符resulttype可選。規定應該產生哪種類型的數組。可以是以下值中的任意一個:1.MYSQLI_ASSOC(關聯數組);2.MYSQLI_NUM(數字數組);3.MYSQLI_BOTH(二者兼有)表4.3.1

mysqli_fetch_array()函數參數詳情參數描述separator必需。規定在哪里分割字符串string必需。要分割的字符串limit可選。規定所返回的數組元素的數目。可能的值:

l

大于

0——返回包含最多

limit

個元素的數組;l

小于

0——返回包含除了最后的

limit

個元素以外的所有元素的數組;l0——會被當作1,返回包含一個元素的數組表4.3.2

explode()函數參數詳情參數描述needle必需。規定要在數組中搜索的值haystack必需。規定要搜索的數組strict可選。如果該參數設置為

TRUE,則

in_array()函數判斷搜索的數據與數組的值的類型是否相同表4.3.3

in_array()函數參數詳情4.3.3制作資料修改后端文件

完成了前端文件,接下來就是后端文件的制作了。單擊“提交”按鈕,將進入postModify.php文件。

小王同學新建了postModify.php文件,并在其中讀取了前端提交的各項數據,完成必要的數據驗證后,使用update語句更新數據庫,這樣就完成了修改資料的操作。【任務小結】

在本任務中主要實現了用戶的登錄和注銷功能。這兩個功能的實現都基于PHP中的一個關鍵技術,即會話(Session)。在使用Session時,一定要記得先開啟會話,且開啟會話的語句必須放在所有用于輸出的HTML代碼之前。

登錄成功,通過Session保存登錄標志。注銷則是刪除登錄成功后保存的Session。

修改資料最關鍵的是實現數據回顯,其中單選按鈕和多選按鈕的回顯方式和普通的文本框有所區別,要注意理解。牟奇春主編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”(全自動區分計算機和人類的圖靈測試)的縮寫,是一種區分用戶是計算機還是人的公

溫馨提示

  • 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯系上傳者。文件的所有權益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙,網頁內容里面會有圖紙預覽,若沒有圖紙預覽就沒有圖紙。
  • 4. 未經權益所有人同意不得將文件中的內容挪作商業或盈利用途。
  • 5. 人人文庫網僅提供信息存儲空間,僅對用戶上傳內容的表現方式做保護處理,對用戶上傳分享的文檔內容本身不做任何修改或編輯,并不能對任何下載內容負責。
  • 6. 下載文件中如有侵權或不適當內容,請與我們聯系,我們立即糾正。
  • 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論