教案序號：.課題項(xiàng)目四任務(wù)3會(huì)員登錄注冊功能數(shù)據(jù)庫的設(shè)計(jì)授課形式√理論□理實(shí)一體□實(shí)訓(xùn)(驗(yàn))□其它：學(xué)時(shí)安排本單元總學(xué)時(shí)：2（其中：理論2學(xué)時(shí)、實(shí)踐學(xué)時(shí)）教學(xué)內(nèi)容及目標(biāo)掌握注冊登錄功能相關(guān)數(shù)據(jù)表的設(shè)計(jì)了解電子商務(wù)網(wǎng)站用戶登錄驗(yàn)證系統(tǒng)設(shè)計(jì)過程中的要點(diǎn)。教學(xué)重點(diǎn)及難點(diǎn)重點(diǎn)、難點(diǎn)：注冊、登錄功能數(shù)據(jù)表的設(shè)計(jì)。授課對象學(xué)情分析學(xué)生接觸網(wǎng)站建設(shè)的相關(guān)內(nèi)容時(shí)間不長，雖然有網(wǎng)頁制作的基礎(chǔ)，但基礎(chǔ)較差，需要在講授過程中，教師進(jìn)行巡回指導(dǎo)或同學(xué)間小組討論。教學(xué)媒介機(jī)房授課地點(diǎn)5405一、課前回顧：1、注冊登錄功能前臺(tái)設(shè)計(jì)中應(yīng)該注意的問題？二、新課內(nèi)容：項(xiàng)目四任務(wù)3會(huì)員登錄注冊功能數(shù)據(jù)庫的設(shè)計(jì)任務(wù)3會(huì)員登錄注冊功能數(shù)據(jù)庫的設(shè)計(jì)一、任務(wù)引出數(shù)據(jù)庫的設(shè)計(jì)合理與否直接關(guān)系到網(wǎng)站訪問的效率問題。在本任務(wù)中，將要來完成諸暨市吉爾特機(jī)械有限公司注冊登錄功能相關(guān)數(shù)據(jù)表的設(shè)計(jì)，使數(shù)據(jù)庫設(shè)計(jì)符合要求。二、任務(wù)預(yù)覽三、實(shí)踐操作1、設(shè)計(jì)數(shù)據(jù)庫表啟動(dòng)Access程序，新建一個(gè)名為“webdata.mdb”的數(shù)據(jù)庫，然后在數(shù)據(jù)庫中創(chuàng)建張名為“member”的數(shù)據(jù)表?！癿ember”數(shù)據(jù)表由“id”、“username”、“password”、“email”、“realname”、“sex”、“birthday”、“edu”、“address”、“phone”、“addtime”、“grade”12個(gè)字段構(gòu)成，其屬性和說明具體情況見下表。表4-1“member”數(shù)據(jù)表各個(gè)字段的數(shù)據(jù)類型及說明字段名稱數(shù)據(jù)類型備注說明Id自動(dòng)編號用戶編號Username文本會(huì)員用戶名Password文本用戶密碼Email文本注冊郵箱realname文本真實(shí)姓名sex文本性別birthday文本出生日期Edu文本學(xué)歷層次Address文本通信地址Phone數(shù)字聯(lián)系電話Addtime日期/時(shí)間注冊時(shí)間grade數(shù)字用戶等級注意：“grade”字段表示用戶等級，其值分為兩種：當(dāng)普通用戶時(shí)，“grade”字段值為“0”；當(dāng)網(wǎng)站管理員時(shí)，“grade”字段值為“1”?！癵rade”字段的默認(rèn)值設(shè)為“0”。為了網(wǎng)站管理的方便，在“member”數(shù)據(jù)表手動(dòng)添加名為“admin”的管理員，密碼也設(shè)置為“admin”。2、建立站點(diǎn)數(shù)據(jù)庫連接的網(wǎng)頁在Dreamweaver環(huán)境下，新建“webdesign”站點(diǎn)，選擇【文件】→【新建命令】，創(chuàng)建ASPVBScript頁面，并將網(wǎng)頁保存為“conn.asp”。切換到【代碼視圖】，刪除“conn.asp”頁面中的代碼，再輸入數(shù)據(jù)庫連接的代碼，然后點(diǎn)擊【保存】按鈕。“conn.asp”頁面中輸入的數(shù)據(jù)庫連接的代碼為：<%connstr="DBQ="+server.MapPath("jatodata/jatodata.mdb")+";defaultdir=;driver={microsoftaccessdriver(*.mdb)};"setconn=server.CreateObject("adodb.connection")conn.openconnstrwebname="諸暨市吉爾特機(jī)械有限公司"%>“conn.asp”為進(jìn)行數(shù)據(jù)庫連接的網(wǎng)頁，要以后的網(wǎng)站功能模塊制作中，可以根據(jù)需要通過【服務(wù)器端包含】指令隨時(shí)調(diào)用，方便網(wǎng)站制作需要。四、小結(jié)會(huì)員注冊登錄功能是商務(wù)網(wǎng)站中必不可少的功能之一，該功能主要是幫助瀏覽者成功地注冊成網(wǎng)站會(huì)員，為以后開展相關(guān)的商務(wù)活動(dòng)作準(zhǔn)備。本任務(wù)主要是完成了公司注冊功能模塊前臺(tái)頁面、的設(shè)計(jì)。教學(xué)隨筆：課后任務(wù)：預(yù)習(xí)實(shí)驗(yàn)四會(huì)員注冊功能制作教學(xué)后記：注：此表為全院統(tǒng)一格式，不得隨意更改。教案序號：.課題實(shí)驗(yàn)四會(huì)員注冊功能制作授課形式□理論□理實(shí)一體√實(shí)訓(xùn)(驗(yàn))□其它：學(xué)時(shí)安排本單元總學(xué)時(shí)：2（其中：理論學(xué)時(shí)、實(shí)踐2學(xué)時(shí)）教學(xué)內(nèi)容及目標(biāo)通過本實(shí)驗(yàn)掌握會(huì)員注冊、登錄模塊前臺(tái)界面的設(shè)計(jì)與后臺(tái)ASP代碼的編寫方法。會(huì)員登錄功能實(shí)現(xiàn)需要涉及的頁面。教學(xué)重點(diǎn)及難點(diǎn)重點(diǎn)、難點(diǎn)：注冊功能的ASP代碼編寫方法授課對象學(xué)情分析學(xué)生接觸網(wǎng)站建設(shè)的相關(guān)內(nèi)容時(shí)間不長，雖然有網(wǎng)頁制作的基礎(chǔ)，但基礎(chǔ)較差，需要在講授過程中，教師進(jìn)行巡回指導(dǎo)或同學(xué)間小組討論。教學(xué)媒介機(jī)房授課地點(diǎn)5405實(shí)驗(yàn)四會(huì)員注冊登錄功能制作一、實(shí)驗(yàn)?zāi)康?/p>

（1）通過本實(shí)驗(yàn)掌握會(huì)員登錄模塊前臺(tái)界面的設(shè)計(jì)方法（2）后臺(tái)ASP代碼的編寫方法。二、實(shí)驗(yàn)內(nèi)容

1、會(huì)員登錄功能實(shí)現(xiàn)需要涉及到哪些頁面？2、要求新建以member命名的數(shù)據(jù)庫?數(shù)據(jù)表的名稱用學(xué)號表示。3、正確書寫連接數(shù)據(jù)庫的代碼？4、登錄功能實(shí)現(xiàn)的ASP代碼？三、實(shí)驗(yàn)指導(dǎo)（1）用Access建立一個(gè)用戶數(shù)據(jù)庫表，用于記錄圖所示的信息。（2）為步驟（1）中建立的數(shù)據(jù)庫表配置一個(gè)系統(tǒng)數(shù)據(jù)源。（3）建立一個(gè)ASP頁，編程實(shí)現(xiàn)將圖所示的注冊信息寫入用戶數(shù)據(jù)庫表中。（4）運(yùn)用查詢語句查詢數(shù)據(jù)庫中的結(jié)果（5）創(chuàng)建一個(gè)實(shí)現(xiàn)登錄響應(yīng)處理的ASP頁，對登錄信息進(jìn)行驗(yàn)證，并給出驗(yàn)證結(jié)果。（6）在《Web程序設(shè)計(jì)》課程網(wǎng)站首頁中加入登錄處理頁的鏈接。三、小結(jié)本次實(shí)驗(yàn)主要是要求學(xué)生會(huì)員注冊登錄功能制作，熟練掌握相關(guān)的操作步驟，以提高學(xué)生實(shí)踐動(dòng)手的能力。教學(xué)隨筆：課后任務(wù)：預(yù)習(xí)項(xiàng)目四任務(wù)4會(huì)員注冊功能后臺(tái)ASP網(wǎng)頁制作任務(wù)5會(huì)員登錄功能后臺(tái)ASP網(wǎng)頁制作教學(xué)后記：注：此表為全院統(tǒng)一格式，不得隨意更改。教案序號：.課題項(xiàng)目四任務(wù)4會(huì)員注冊功能后臺(tái)ASP網(wǎng)頁制作任務(wù)5會(huì)員登錄功能后臺(tái)ASP網(wǎng)頁制作授課形式√理論□理實(shí)一體□實(shí)訓(xùn)(驗(yàn))□其它：學(xué)時(shí)安排本單元總學(xué)時(shí)：2（其中：理論2學(xué)時(shí)、實(shí)踐學(xué)時(shí)）教學(xué)內(nèi)容及目標(biāo)掌握注冊登錄功能相關(guān)數(shù)據(jù)表的設(shè)計(jì)了解電子商務(wù)網(wǎng)站用戶登錄驗(yàn)證系統(tǒng)設(shè)計(jì)過程中的要點(diǎn)。教學(xué)重點(diǎn)及難點(diǎn)重點(diǎn)、難點(diǎn)：注冊、登錄功能數(shù)據(jù)表的設(shè)計(jì)。授課對象學(xué)情分析學(xué)生接觸網(wǎng)站建設(shè)的相關(guān)內(nèi)容時(shí)間不長，雖然有網(wǎng)頁制作的基礎(chǔ)，但基礎(chǔ)較差，需要在講授過程中，教師進(jìn)行巡回指導(dǎo)或同學(xué)間小組討論。教學(xué)媒介機(jī)房授課地點(diǎn)5405一、課前回顧：1、注冊功能前臺(tái)設(shè)計(jì)中應(yīng)該注意的問題？二、新課內(nèi)容：項(xiàng)目四任務(wù)4會(huì)員注冊功能后臺(tái)ASP網(wǎng)頁制作任務(wù)5會(huì)員登錄功能后臺(tái)ASP網(wǎng)頁制作任務(wù)4會(huì)員登錄注冊功能數(shù)據(jù)庫的設(shè)計(jì)一、任務(wù)引出會(huì)員登錄模塊是會(huì)員進(jìn)入會(huì)員管理系統(tǒng)的入口，只有登錄的會(huì)員才有管理網(wǎng)站的功能。會(huì)員登錄主要通過判斷用戶輸入的會(huì)員名和密碼是否與數(shù)據(jù)庫中的會(huì)員名和密碼相等來實(shí)現(xiàn)，相等則登錄成功，如果不相等，則彈出提示信息。現(xiàn)在許多網(wǎng)站在登錄頁面中利用驗(yàn)證碼技術(shù)，阻止一些非法的操作。在本任務(wù)中，將為“諸暨市吉爾特機(jī)械有限公司”網(wǎng)站完成用戶登錄功能的頁面制作，以方便用戶的管理操作。二、任務(wù)預(yù)覽打開并運(yùn)行站點(diǎn)文件夾里登錄頁面文件“l(fā)ogin.asp”?？梢钥吹?，登錄頁面中主要包含“賬號”、“密碼”和“驗(yàn)證碼”這些內(nèi)容。網(wǎng)頁具體的預(yù)覽效果如圖所示。當(dāng)管理員要登錄時(shí)，分別在“賬號”、“密碼”和“驗(yàn)證碼”所對應(yīng)的文本框中輸入相應(yīng)的信息，點(diǎn)擊登錄按鈕時(shí)，如果所輸入的信息與數(shù)據(jù)庫中已經(jīng)存在的帳號和密碼相一致的話，便可以成功地登錄到網(wǎng)站中去，登錄成功的頁面，預(yù)覽效果如圖所示。如果所輸入的信息與數(shù)據(jù)庫中已經(jīng)存在的帳號和密碼不一致的話，便會(huì)給出登錄失敗的提示信息，具體效果如圖4-8所示。圖“諸暨市吉爾特機(jī)械有限公司”網(wǎng)站管理登錄界面圖網(wǎng)站管理登錄成功界面圖登錄失敗時(shí)所彈出的信息框三、實(shí)踐操作1、用戶登錄頁面的制作在Dreamweaver環(huán)境下，選擇【文件】→【新建命令】，創(chuàng)建ASPVBScript頁面，并將網(wǎng)頁保存為“l(fā)ogin.asp”。具體的制作效果如圖所示。圖用戶登錄界面選中“帳號”字段所對應(yīng)的文本框，命名為“username”；選中“密碼”字段所對應(yīng)的文本框，將其命名為“password”；選中“驗(yàn)證碼”字段所對應(yīng)的文本框，將其命名為“verifycode”，并在該文本框后面新建“<img>”標(biāo)簽，并將其源文件設(shè)置為“code.asp”，如圖所示，“code.asp”中的代碼將在下面的內(nèi)容中講到。圖4-10驗(yàn)證碼顯示功能設(shè)置添加表單，使表單的開始標(biāo)簽與結(jié)束標(biāo)簽包圍整個(gè)會(huì)員登錄模塊。同時(shí)選中表單“form”，將表單的“action”屬性設(shè)置為“l(fā)ogin1.asp”，“method”屬性設(shè)置為“post”，具體如下圖所示。圖4-11表單動(dòng)作定義界面2、設(shè)計(jì)驗(yàn)證碼顯示功能“code.asp”中的代碼“code.asp”中的代碼主要功能是當(dāng)網(wǎng)頁刷新的時(shí)候，實(shí)現(xiàn)隨機(jī)出現(xiàn)四位數(shù)的驗(yàn)證碼的功能。3、設(shè)計(jì)登錄功能后臺(tái)處理頁面“l(fā)ogin1.asp”利用前面的模板，登錄信息后臺(tái)處理頁面“l(fā)ogin1.asp”，設(shè)計(jì)如圖所示。圖登錄功能后臺(tái)頁面設(shè)計(jì)4、登錄功能實(shí)現(xiàn)的后臺(tái)處理代碼會(huì)員登錄主要通過判斷用戶輸入的會(huì)員名和密碼是否與數(shù)據(jù)庫中的會(huì)員名和密碼相等來實(shí)現(xiàn)，相等則登錄成功，如果不相等，則彈出提示信息。具體功能實(shí)現(xiàn)的過程如下：①首先必須連接數(shù)據(jù)庫，調(diào)用連接數(shù)據(jù)庫的語句：<!--#includefile="conn.asp"-->②用戶登錄功能實(shí)現(xiàn)的ASP代碼：<%username=replace(request.form("username"),"'","")'收集“username”文本框中的信息password=replace(request.form("password"),"'","")'收集“password”文本框中的信息ifusername=""andpassword=""then'檢查“username”和“password”的值是否為空response.Write"<scriptLANGUAGE='javascript'>alert('您的管理ID或密碼有誤！');history.go(-1);</script>"response.endendififcstr(session("getcode"))<>cstr(trim(request("verifycode")))then'檢查驗(yàn)證碼輸入是否正確response.Write"<scriptLANGUAGE='javascript'>alert('請輸入正確的驗(yàn)證碼！');history.go(-1);</script>"response.endendifsetrs=server.CreateObject("adodb.recordset")sql="select*frommenberwhereusername='"&username&"'andpassword='"&password&"'"rs.opensql,connifrs.eofandrs.bofthenresponse.Write"<scriptLANGUAGE='javascript'>alert('登陸失?。?);history.go(-1);</script>"response.endsession("username")=username'Session變量的定義session("grade")=rs("grade")rs.closesetrs=nothingendif%>5、保存網(wǎng)頁進(jìn)行預(yù)覽測試在預(yù)覽測試之前，打開“webdata.mdb”的數(shù)據(jù)庫，打開“member