PHP動態(tài)網(wǎng)站開發(fā)項目教程（微課版） 課件 項目3、4 會員管理系統(tǒng)用戶注冊；會員管理系統(tǒng)用戶登錄、資料修改及注銷

牟奇春主編PHP動態(tài)網(wǎng)站開發(fā)項目教程（微課版）任務(wù)3會員管理系統(tǒng)用戶注冊子任務(wù)3.1獲取表單數(shù)據(jù)【任務(wù)實施】3.1.1從后端獲取前端表單數(shù)據(jù)

如果前端使用“GET”方式提交數(shù)據(jù)，則使用“$_GET”；如果前端使用“POST”方式提交數(shù)據(jù)，則使用“$_POST”。當(dāng)然，也可以使用“$_REQUEST”全局?jǐn)?shù)組來讀取前端表單提交的數(shù)據(jù)，這種方式就不區(qū)分GET和POST了，均可以讀取前端表單提交的數(shù)據(jù)。圖3.1.1

后端文件讀取前端表單數(shù)據(jù)3.1.2書寫PHP代碼

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

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

單擊“+創(chuàng)建數(shù)據(jù)庫”按鈕，可以創(chuàng)建新的數(shù)據(jù)庫，并設(shè)置訪問的用戶名和密碼。管理員用戶名默認(rèn)是“root”，密碼也是“root”，此賬號可以訪問和管理當(dāng)前服務(wù)器中的所有數(shù)據(jù)庫，是最高權(quán)限的用戶。圖3.2.1

小皮面板數(shù)據(jù)庫管理3.2.2安裝可視化數(shù)據(jù)庫管理工具

小王同學(xué)在查詢資料時從網(wǎng)絡(luò)上看到，MySQL數(shù)據(jù)庫可以使用命令行方式來進(jìn)行相關(guān)操作。但這種方式對初學(xué)者極不友好，難度太大。

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

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

數(shù)據(jù)庫工具(客戶端)

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

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

在軟件管理中安裝phpMyAdmin

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

在phpMyAdmin中管理數(shù)據(jù)庫3.2.3創(chuàng)建數(shù)據(jù)庫和數(shù)據(jù)表

圖3.2.4左側(cè)區(qū)域顯示的是系統(tǒng)中已經(jīng)有的數(shù)據(jù)庫。接下來，單擊左側(cè)的“新建”，然后在右側(cè)輸入數(shù)據(jù)庫的名稱“member”，并單擊“創(chuàng)建”按鈕，即可創(chuàng)建數(shù)據(jù)庫member。創(chuàng)建好的數(shù)據(jù)庫member如圖3.2.5所示。圖3.2.5

創(chuàng)建好的數(shù)據(jù)庫member

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

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

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

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

mysqli_connect()函數(shù)參數(shù)詳情

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

在實際使用時，一般來說，主機名都使用“l(fā)ocalhost”，代表本地主機，也就是當(dāng)前運行PHP文件的服務(wù)器。用戶名和密碼都使用的是“root”，這是默認(rèn)的最高權(quán)限的賬戶。第4個參數(shù)是默認(rèn)使用的數(shù)據(jù)庫，在這里使用的是“member”。最后兩個參數(shù)可以不用填寫，直接使用默認(rèn)值。

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

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

該函數(shù)的參數(shù)詳情如表3.3.2所示。參數(shù)描述connection必需。規(guī)定要使用的MySQL連接query必需。規(guī)定查詢字符串resultmode可選。一個常量，可以是下列值中的任意一個：（1）MYSQLI_USE_RESULT（如果需要檢索大量數(shù)據(jù)，則使用這個）；（2）MYSQLI_STORE_RESULT（默認(rèn)）表3.3.2

mysqli_query()函數(shù)參數(shù)詳情

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

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

上述代碼的第9行使用結(jié)構(gòu)化查詢語言（StructuredQueryLanguage，SQL）設(shè)置了一個查詢語句。SQL是一種具有特殊目的的編程語言，是一種數(shù)據(jù)庫查詢和程序設(shè)計語言，用于存取數(shù)據(jù)，以及查詢、更新和管理關(guān)系數(shù)據(jù)庫系統(tǒng)。

在這里，小王同學(xué)使用INSERTINTO語句向數(shù)據(jù)表中插入新記錄。INSERTINTO語句有兩種編寫形式。

第一種形式無須指定要插入數(shù)據(jù)的列名，只需提供被插入的值。INSERTINTO

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

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

table_name

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

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

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

輸入信息進(jìn)行會員注冊

在PHP程序中，如果執(zhí)行代碼時出現(xiàn)錯誤，則會在頁面中根據(jù)錯誤的級別進(jìn)行相應(yīng)的錯誤提示。PHP中的典型錯誤有以下幾種。（1）E_ERROR：這是一種致命的錯誤，遇到這種錯誤時，程序?qū)⑦M(jìn)行錯誤提示，并終止腳本繼續(xù)運行。（2）E_WARNING：這是一種非致命的錯誤，遇到這種錯誤時，程序?qū)⑦M(jìn)行錯誤提示，但是不會終止腳本繼續(xù)運行。（3）E_PARSE：這是一種腳本語法錯誤，是級別最高的錯誤。當(dāng)出現(xiàn)這種錯誤時，整個腳本根本不會執(zhí)行。（4）E_NOTICE：這是一種運行時通知消息，表示腳本遇到可能會表現(xiàn)為錯誤的情況，但是在可以正常運行的腳本中也可能會有類似的通知。

在上面將注冊信息寫入數(shù)據(jù)庫的代碼中，如果故意將mysqli_

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

重新修改為正確的密碼后，刷新瀏覽器，系統(tǒng)彈出“數(shù)據(jù)插入成功”的提示，如圖3.3.3所示。

圖3.3.2

會員注冊出錯

圖3.3.3

會員注冊成功

此時，進(jìn)入數(shù)據(jù)庫，查看結(jié)果，可以看到新插入的一條數(shù)據(jù)記錄，如圖3.3.4所示。3.3.5項目階段性成果

圖3.3.4

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

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

3.4.2使用SQL中的SELECT語句

參數(shù)描述result必需。規(guī)定由

mysqli_query()、mysqli_store_result()或

mysqli_use_result()返回的結(jié)果集標(biāo)識符表3.4.1

mysqli_num_rows()函數(shù)參數(shù)詳情

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

strlen()函數(shù)參數(shù)詳情

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

die()

函數(shù)的別名。3.4.3在PhpStorm中配置數(shù)據(jù)源

注冊功能已經(jīng)完成了，可是，小王同學(xué)突然注意到，他在PhpStorm中所寫的SQL語句被標(biāo)記有黃色底紋。同時，把鼠標(biāo)指針移至底紋上，系統(tǒng)還出現(xiàn)了一些提示信息，如圖3.4.1所示。圖3.4.1

未配置數(shù)據(jù)源和SQLDialect的提示圖3.4.2

配置SQLDialect圖3.4.3

未配置數(shù)據(jù)源的提示

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

配置數(shù)據(jù)源和驅(qū)動圖3.4.5

服務(wù)器時區(qū)配置錯誤圖3.4.6

配置服務(wù)器時區(qū)

配置好上述內(nèi)容后，在PhpStorm的右側(cè)出現(xiàn)一個Database標(biāo)簽，單擊可以展開，在其中可以看到當(dāng)前member數(shù)據(jù)庫的詳細(xì)情況，如圖3.4.7所示。圖3.4.7

配置好的數(shù)據(jù)源子任務(wù)3.5表單驗證【任務(wù)實施】3.5.1重視數(shù)據(jù)驗證

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

前端數(shù)據(jù)驗證一般是使用JavaScript來進(jìn)行的。為了避免前端繞過數(shù)據(jù)驗證，在后端接收到數(shù)據(jù)后，還需要再一次進(jìn)行數(shù)據(jù)驗證。

在會員注冊表單中，需要驗證的內(nèi)容如下。（1）用戶名。必填，內(nèi)容只能是大小寫字母、數(shù)字，長度為3～10個字符。（2）密碼。必填，內(nèi)容只能是大小寫字母、數(shù)字、“_”、“*”，長度為6～10個字符。（3）確認(rèn)密碼。必填，且必須和密碼保持一致。（4）信箱。格式必須正確，可以不填。（5）愛好?？梢圆贿x。

在單擊“提交”按鈕時，要攔截系統(tǒng)提交，即先驗證數(shù)據(jù)，合格后再提交表單。只需要在<form>標(biāo)簽中添加一個onsubmit事件，即可實現(xiàn)提交攔截。3.5.3在前端驗證數(shù)據(jù)

解讀一下小王同學(xué)寫的代碼。在代碼的第3行，document.

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

在前端完成了數(shù)據(jù)驗證，為了提高安全性與可靠性，在后端也必須完成表單數(shù)據(jù)驗證。

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

preg_match()函數(shù)參數(shù)詳情

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

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

根據(jù)項目開始前完成的詳細(xì)需求分析，現(xiàn)在需要完成登錄頁面的制作。（1）選中member目錄并單擊鼠標(biāo)右鍵，在快捷菜單中選擇“New”

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

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

在SQL語句中，通過select關(guān)鍵字來實現(xiàn)查詢，通過where子句來實現(xiàn)數(shù)據(jù)記錄的篩選。篩選的依據(jù)是，判斷username這一列是否存在數(shù)據(jù)等于用戶輸入的用戶名，pw這一列是否存在數(shù)據(jù)等于用戶輸入的密碼經(jīng)過MD5加密后的結(jié)果。4.1.3通過Session變量保存登錄標(biāo)志

PHP中的Session變量用于存儲關(guān)于用戶會話（Session）的信息，或者更改用戶會話的設(shè)置。Session變量存儲單一用戶的信息，并且對于應(yīng)用程序中的所有頁面都是可用的。

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

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

項目制作到這里，小王同學(xué)發(fā)現(xiàn)，頁面頂部的導(dǎo)航欄會在每一個頁面中顯示，這些代碼在每一個文件中重復(fù)出現(xiàn)，借鑒前面完成conn.php文件的經(jīng)驗，應(yīng)該也可以用同樣的方法，即將導(dǎo)航欄代碼放到一個單獨的文件中，以優(yōu)化代碼。

選中member目錄并單擊鼠標(biāo)右鍵，創(chuàng)建新文件nav.php，并將原來導(dǎo)航欄相關(guān)的CSS、HTML代碼移植過來。

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

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

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

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

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

系統(tǒng)提示

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

設(shè)置PHP版本

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

接下來小王同學(xué)測試了項目的運行，得到了圖4.2.3所示的結(jié)果。圖4.2.3

登錄成功后在導(dǎo)航欄顯示登錄者的用戶名子任務(wù)4.3會員資料修改4.3.1優(yōu)化登錄頁面跳轉(zhuǎn)邏輯

小王同學(xué)查看了已經(jīng)做好的用戶登錄功能，當(dāng)?shù)卿洺晒?，保存了登錄?biāo)志，就沒有執(zhí)行其他操作了，頁面也還是繼續(xù)停留在登錄頁面，這顯然不太合理。登錄成功后應(yīng)該跳轉(zhuǎn)到首頁才比較合理。

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

通過分析會員資料修改頁面的特點，小王同學(xué)梳理了制作的思路。（1）在member項目中新建文件modify.php。在制作導(dǎo)航欄時，已經(jīng)在nav.php中的“個人資料修改”鏈接添加了目標(biāo)鏈接頁面modify.php，但還未制作此文件，因此需要創(chuàng)建此文件。（2）從signup.php文件中復(fù)制代碼，然后粘貼到modify.php文件中。由于資料修改頁面和注冊頁面有較高的相似性，因此可以直接從signup.php文件中復(fù)制代碼，再進(jìn)行適當(dāng)修改。（3）在表單中顯示已有的各項資料。（4）修改資料后，單擊“提交”按鈕，將各項