Web程序設(shè)計(jì)（第2版） 電子教案 24-1209 任務(wù)二 設(shè)計(jì)查看日志文本文件網(wǎng)頁程序

教案課程名稱：動(dòng)態(tài)網(wǎng)頁制作（Web程序設(shè)計(jì)）0課題：任務(wù)二設(shè)計(jì)查看日志文本文件網(wǎng)頁程序0課時(shí)：2課時(shí)0主講教師：某某某教師0學(xué)校：某某某學(xué)校0日期：2019年12月9日0

教案教學(xué)對(duì)象某學(xué)校某專業(yè)授課日期2019年12月9日使用教材Web程序設(shè)計(jì)（第二版）出版單位電子工業(yè)出版社課題任務(wù)二設(shè)計(jì)查看日志文本文件網(wǎng)頁程序計(jì)劃學(xué)時(shí)2學(xué)時(shí)教學(xué)目標(biāo)能運(yùn)用FileStream類設(shè)計(jì)創(chuàng)建日志文本文件網(wǎng)頁程序知識(shí)目標(biāo)：FileStream類技能目標(biāo)：掌握運(yùn)用FileStream類設(shè)計(jì)創(chuàng)建日志文本文件的技能。態(tài)度目標(biāo)：端正態(tài)度，配合伙伴完成任務(wù)。德育目標(biāo)：養(yǎng)成良好的團(tuán)隊(duì)協(xié)作精神，學(xué)會(huì)彼此配合協(xié)作完成項(xiàng)目任務(wù)，成果分享。教學(xué)重點(diǎn)難點(diǎn)重點(diǎn)：完成查看日志文本文件網(wǎng)頁程序任務(wù)，掌握配套技能。難點(diǎn)：完成查看日志文本文件網(wǎng)頁程序任務(wù)，熟練掌握配套技能。教學(xué)設(shè)計(jì)說明1、教學(xué)內(nèi)容以崗位工作任務(wù)出現(xiàn)，為學(xué)生將來快速融入崗位工作打基礎(chǔ)。2、教學(xué)重點(diǎn)是培養(yǎng)學(xué)生熟練的操作技能。3、通過訓(xùn)練與強(qiáng)調(diào)，突破關(guān)鍵點(diǎn)。4、訓(xùn)練結(jié)束后，接軌企業(yè)實(shí)際，施工任務(wù)單技術(shù)歸檔的填寫，是崗位標(biāo)準(zhǔn)化技能訓(xùn)練的一部分。教學(xué)活動(dòng)流程教學(xué)步驟與內(nèi)容教學(xué)組織形式教學(xué)方法達(dá)成目標(biāo)1、新課導(dǎo)入復(fù)習(xí)：數(shù)據(jù)庫自動(dòng)備份與還原導(dǎo)入新課：任務(wù)二設(shè)計(jì)查看日志文本文件網(wǎng)頁程序以提問的方式展開與學(xué)生的互動(dòng)，引出本課堂教學(xué)內(nèi)容。項(xiàng)目串聯(lián)教學(xué)法通過復(fù)習(xí)，回憶表單與循環(huán)語句。2、講解示范任務(wù)描述網(wǎng)頁程序設(shè)計(jì)的工作過程中，有需要查詢保存過的日志文本文件。前面任務(wù)一完成的060101.aspx網(wǎng)頁程序僅能保存顯示一個(gè)文本文件，但在日常工作中，總是會(huì)保存許多日志文件。網(wǎng)絡(luò)信息部門負(fù)責(zé)人有了新的任務(wù)要求，第一能夠列表顯示公司W(wǎng)eb系統(tǒng)設(shè)計(jì)日志文本文件，第二能夠顯示選中文件的日志文件內(nèi)容。新的工作任務(wù)是設(shè)計(jì)顯示日志文本文件內(nèi)容網(wǎng)頁程序，根據(jù)任務(wù)需求，網(wǎng)絡(luò)信息部門小明工程師設(shè)計(jì)060201.aspx公司網(wǎng)頁。

任務(wù)分析經(jīng)對(duì)任務(wù)需求多次商討分析，小明工程師迅速通過圖書館、互聯(lián)網(wǎng)查找技術(shù)資料，確定用DropDownList控件，DirectoryInfo、FileInfo、GetFiles、DataSource、DataBind、FileStream、FileMode.Open、ReadLine技術(shù)進(jìn)行代碼設(shè)計(jì)，可以通過代碼程序在網(wǎng)頁中實(shí)現(xiàn)在服務(wù)器web中文本文件的下拉列表查看。設(shè)計(jì)060201.aspx用到的控件和屬性。1教師做中教2學(xué)生做中學(xué)3運(yùn)用多媒體教學(xué)手段4輔助教學(xué)運(yùn)用VMware虛擬機(jī)技術(shù)與真實(shí)環(huán)境相結(jié)合項(xiàng)目串聯(lián)教學(xué)法控件與控件屬性按照要求設(shè)計(jì)出網(wǎng)頁與程序3、操作訓(xùn)練安排學(xué)生按照施工任務(wù)訓(xùn)練，掌握相關(guān)技能。通過任務(wù)二設(shè)計(jì)查看日志文本文件網(wǎng)頁程序，完成任務(wù)二設(shè)計(jì)查看日志文本文件網(wǎng)頁程序的工作任務(wù)，來學(xué)習(xí)相關(guān)Directory類的技能方法，實(shí)現(xiàn)設(shè)計(jì)查看日志文本文件網(wǎng)頁程序。填寫施工技術(shù)文檔，培養(yǎng)企業(yè)崗位真實(shí)工作場(chǎng)景。1教師做中教2學(xué)生做中學(xué)3運(yùn)用多媒體教學(xué)手段4輔助教學(xué)運(yùn)用VMware虛擬機(jī)技術(shù)與真實(shí)環(huán)境相結(jié)合項(xiàng)目串聯(lián)教學(xué)法通過任務(wù)訓(xùn)練使學(xué)生掌握控件與屬性，掌握運(yùn)用控件的技能方法4、課堂小結(jié)\教師點(diǎn)評(píng)對(duì)項(xiàng)目任務(wù)完成過程中情況回顧，強(qiáng)調(diào)本次課程重點(diǎn)，問題關(guān)鍵點(diǎn)強(qiáng)調(diào)。利用多媒體等手段，強(qiáng)調(diào)知識(shí)與技能要點(diǎn)進(jìn)行總結(jié)，并布置課后的作業(yè)內(nèi)容。全體

講授對(duì)項(xiàng)目任務(wù)完成過程中情況回顧，強(qiáng)調(diào)本次課程重點(diǎn)，問題關(guān)鍵點(diǎn)強(qiáng)調(diào)。課外作業(yè)建立網(wǎng)頁程序jianlixianshi.apx，把任務(wù)一與任務(wù)二功能合并。界面布局自行安排，按鈕一可以建立文本文件，按鈕二可以顯示文本文件。教學(xué)回顧通過本次課，能熟悉相關(guān)概念，培養(yǎng)學(xué)生動(dòng)手操作能力以及完成任務(wù)過程中遇到問題、思考問題和解決問題的能力；培養(yǎng)學(xué)生正確認(rèn)識(shí)本門課程學(xué)習(xí)的意義及遵守行業(yè)規(guī)范的職業(yè)道德規(guī)范和綜合職業(yè)素養(yǎng)。

任務(wù)二設(shè)計(jì)查看日志文本文件網(wǎng)頁程序

任務(wù)描述網(wǎng)頁程序設(shè)計(jì)的工作過程中，有需要查詢保存過的日志文本文件。前面任務(wù)一完成的060101.aspx網(wǎng)頁程序僅能保存顯示一個(gè)文本文件，但在日常工作中，總是會(huì)保存許多日志文件。網(wǎng)絡(luò)信息部門負(fù)責(zé)人有了新的任務(wù)要求，第一能夠列表顯示公司W(wǎng)eb系統(tǒng)設(shè)計(jì)日志文本文件，第二能夠顯示選中文件的日志文件內(nèi)容。新的工作任務(wù)是設(shè)計(jì)顯示日志文本文件內(nèi)容網(wǎng)頁程序，根據(jù)任務(wù)需求，網(wǎng)絡(luò)信息部門小明工程師設(shè)計(jì)060201.aspx公司網(wǎng)頁，如圖7-2-1所示：圖7-2-1060201.aspx設(shè)計(jì)視圖

任務(wù)分析經(jīng)對(duì)任務(wù)需求多次商討分析，小明工程師迅速通過圖書館、互聯(lián)網(wǎng)查找技術(shù)資料，確定用DropDownList控件，DirectoryInfo、FileInfo、GetFiles、DataSource、DataBind、FileStream、FileMode.Open、ReadLine技術(shù)進(jìn)行代碼設(shè)計(jì)，可以通過代碼程序在網(wǎng)頁中實(shí)現(xiàn)在服務(wù)器web中文本文件的下拉列表查看。設(shè)計(jì)060201.aspx用到的控件和屬性，如表7-2-1所示：表7-2-1控件屬性說明Label1ID="Label1"Text="Label1"顯示文件夾的物理路徑Label2ID="Label2"Text="Label2"顯示網(wǎng)頁程序的相對(duì)路徑Label4ID="Label4"Text="Label4"顯示文本文件數(shù)量DropDownList1AutoPostBack="True"控件發(fā)生變化就會(huì)自動(dòng)觸發(fā)事件Button1Text="顯示日志文本文件"執(zhí)行對(duì)應(yīng)程序代碼Label3ID="Label3"Text="Label3"顯示“內(nèi)容：”文字TextBox1Height="200px"ReadOnly="True"TextMode="MultiLine"Width="520px"用來顯示選中txt日志內(nèi)容任務(wù)二設(shè)計(jì)查看日志文本文件網(wǎng)頁程序簡易流程圖方法和步驟 START1．設(shè)計(jì)060201.aspx網(wǎng)頁程序準(zhǔn)備工作，在C盤根目錄下建立文件夾0602，單擊“開始、程序、MicrosoftVisualStudio2010”啟動(dòng)MicrosoftVisualStudio2010，單擊菜單“文件、新建網(wǎng)站”，顯示“新建網(wǎng)站”對(duì)話框，在已安裝的模板處選擇“VisualC#”單擊，在右側(cè)“ASP.NET空網(wǎng)站”處單擊，在下方Web位置處選擇“文件系統(tǒng)”，在右側(cè)輸入“c:\0602”后，單擊“確定”按鈕，如圖7-1-2新建網(wǎng)站。把素材01.gif、02.gif復(fù)制粘貼到路徑c:\0602文件夾0602中。在“解決方案資源管理器”處右擊，在快捷菜單“添加新項(xiàng)”處單擊，在添加新項(xiàng)對(duì)話框中單擊選擇“VisualC#”、單擊選擇“Web窗體”后，刪除默認(rèn)文件名“Default.aspx”，輸入“060201.aspx”文件名，單擊“添加”按鈕，如圖7-2-2。圖7-2-2新建網(wǎng)頁程序文件060201.aspx當(dāng)在打開060201.aspx網(wǎng)頁狀態(tài)下，鼠標(biāo)在左下角單擊“設(shè)計(jì)”視圖，光標(biāo)處適當(dāng)回車5次，在“解決方案資源管理器”中鼠標(biāo)單擊拖動(dòng)“01.gif”和“02.gif”圖片至設(shè)計(jì)視圖中如圖7-2-1所示位置，參考如圖7-2-1位置輸入“公司W(wǎng)eb系統(tǒng)設(shè)計(jì)日志文本查看”文字，回車換行，輸入“公司系統(tǒng)日志文件所在文件夾的物理路徑為：”文字，在工具欄標(biāo)準(zhǔn)中雙擊Label插入Label1控件，按圖7-2-1修改Text屬性為Label1，回車，輸入“以相對(duì)路徑顯示調(diào)用的網(wǎng)頁程序名稱為：”文字，工具欄標(biāo)準(zhǔn)中雙擊Label插入Label2控件，按圖7-2-1修改Text屬性為Label2，輸入“當(dāng)前網(wǎng)站日志txt文件夾中共有文本文件數(shù)量為：”文字，工具欄標(biāo)準(zhǔn)中雙擊Label插入控件，修改Text屬性為Label4，修改ID屬性為Label4，回車2次，輸入“請(qǐng)選擇日志文件：”文字，工具欄標(biāo)準(zhǔn)中雙擊DropDownList插入控件DropDownList1，修改屬性AutoPostBack="True"，鍵盤輸入空格，工具欄標(biāo)準(zhǔn)中雙擊Button插入控件Button1，回車，輸入“內(nèi)容：”文字，工具欄標(biāo)準(zhǔn)中雙擊Label插入Label3控件，回車，工具欄標(biāo)準(zhǔn)中雙擊TextBox插入控件TextBox1，修改屬性Height="200px"ReadOnly="True"TextMode="MultiLine"Width="520px"。按表7-2-1對(duì)文字和控件進(jìn)行屬性調(diào)整，效果見圖7-2-1。060201.aspx網(wǎng)頁源碼如下：01<%@PageLanguage="C#"AutoEventWireup="true"CodeFile="060201.aspx.cs"Inherits="_060201"%>02<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""/TR/xhtml1/DTD/xhtml1-transitional.dtd">03<htmlxmlns="/1999/xhtml">04<headrunat="server">05<title>公司W(wǎng)eb系統(tǒng)設(shè)計(jì)日志文本查看</title>06</head>07<body>08<formid="form1"runat="server">09<div>10<imgalt=""src="601.gif"/><br/>11<strong>公司W(wǎng)eb系統(tǒng)設(shè)計(jì)日志文本查看</strong><br/><br/>12公司系統(tǒng)日志文件所在文件夾的物理路徑為：<asp:LabelID="Label1"runat="server"Text="Label1"></asp:Label><br/>13以相對(duì)路徑顯示調(diào)用的網(wǎng)頁程序名稱為：<asp:LabelID="Label2"runat="server"Text="Label2"></asp:Label><br/>14當(dāng)前網(wǎng)站日志txt文件夾中共有文本文件數(shù)量為：<asp:LabelID="Label4"runat="server"Text="Label4"></asp:Label><br/><br/>15請(qǐng)選擇日志文件：<asp:DropDownListID="DropDownList1"runat="server"AutoPostBack="True"OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged">16</asp:DropDownList>17<asp:ButtonID="Button1"runat="server"OnClick="Button1_Click"Text="顯示日志文本文件"/><br/>18內(nèi)容：<asp:LabelID="Label3"runat="server"Text="Label3"></asp:Label><br/>19<asp:TextBoxID="TextBox1"runat="server"Height="200px"ReadOnly="True"TextMode="MultiLine"Width="520px"></asp:TextBox><br/>20<imgalt=""src="602.gif"/></div>21</form>22</body>23</html>2．設(shè)計(jì)060201.aspx.cs網(wǎng)頁程序在060201.aspx設(shè)計(jì)視圖中，雙擊Button1按鈕控件進(jìn)入060201.aspx.cs程序代碼編輯模式，輸入其中protectedvoidPage_Load(objectsender,EventArgse)見代碼編號(hào)06-25行，輸入其中protectedvoidButton1_Click(objectsender,EventArgse)見代碼編號(hào)16-42行?；氐?60201.aspx設(shè)計(jì)視圖中，雙擊DropDownList1控件進(jìn)入程序代碼編輯模式，輸入其中protectedvoidDropDownList1_SelectedIndexChanged(objectsender,EventArgse)見代碼編號(hào)43-47行。060201.aspx.cs網(wǎng)頁程序完整源代碼如下：01usingSystem;02usingSystem.IO;03usingSystem.Text;04publicpartialclass_060201:System.Web.UI.Page05{06protectedvoidPage_Load(objectsender,EventArgse)07{08if(!IsPostBack)//功能為僅在本網(wǎng)頁程序第一次加載運(yùn)行是執(zhí)行下面9-24之間語句09{10stringpathName=Server.MapPath("~/txt/");//返回與Web服務(wù)器上txt文本文件所在文件夾虛擬路徑相對(duì)應(yīng)的物理路徑。11Label1.Text=pathName;//在網(wǎng)頁界面上通過Label1.Text顯示出txt文本文件所在文件夾的物理路徑。12Label2.Text=Server.HtmlEncode(Request.CurrentExecutionFilePath);//在網(wǎng)頁界面上通過Label2.Text顯示出txt文本文件所在文件夾的相對(duì)路徑。13Label3.Text="";14DirectoryInfodir=newDirectoryInfo(pathName);//指定您想要操作的目錄是~/txt/15FileInfo[]fileList=dir.GetFiles();//數(shù)組FileInfo[]獲得文件夾中文本文件列表16DropDownList1.DataSource=fileList;//為控件設(shè)置數(shù)據(jù)源，設(shè)置將文件列表關(guān)聯(lián)到DropDownList1控件17DropDownList1.DataTextField="Name";//獲取或設(shè)置為列表項(xiàng)提供文本內(nèi)容的數(shù)據(jù)源字段。18DropDownList1.DataValueField="Name";//獲取或設(shè)置為各列表項(xiàng)提供值的數(shù)據(jù)源字段。19DropDownList1.DataBind();//將數(shù)據(jù)源綁定到被調(diào)用的DropDownList控件20intiii=0;21foreach(varfiiiindir.GetFiles())//統(tǒng)計(jì)日志文件夾中文件的數(shù)量22{iii=iii+1;}23Label4.Text=iii+"個(gè)。";24}25}26protectedvoidButton1_Click(objectsender,EventArgse)27{28stringfileName=DropDownList1.SelectedItem.ToString();//獲取選擇的日志文件名29FileStreamfs=newFileStream(Server.MapPath("~/txt/")+fileName,FileMode.Open,FileAccess.Read);//在指定的路徑、讀取指定的文件。path當(dāng)前FileStream創(chuàng)建文件的相對(duì)路徑或絕對(duì)路徑。FileMode.Open讀取文件模式。FileAccess.Read文件讀訪問,可將數(shù)據(jù)從文件讀出。30StreamReadersr=newStreamReader(fs,Encoding.