【正文】 switch(configif)switch mode access switch(configif)switch access vlan 11 switch(configif)exit switch(config)interface fast 0/4 switch(configif)switch mode access switch(configif)switch access vlan 11 switch(configif)exit switch(config)interface fast 0/6 switch(configif)switch mode access switch(configif)switch access vlan 21 switch(configif)exit switch(config)interface fast 0/9 switch(configif)switch mode access switch(configif)switch access vlan 21 switch(configif)exit 配置 VLAN IP switchconfig t 天津工程師范學(xué)院 2021 屆本科生畢業(yè)設(shè)計(jì)（論文） 16 switch(config)interface vlan 11 switch(configif)ip address switch(configif)no shutdown switch(config)interface vlan 21 switch(configif)ip address switch(configif)no shutdown 全部配置完成后，在超級(jí)終端上運(yùn)行 switchshow vlan status 可以看到我們新建的 VLAN在同一 VLAN內(nèi)的 PC機(jī)可以互相 ping通，不同 VLAN內(nèi)的 PC機(jī)不能 ping 通，這樣就達(dá)到本次實(shí)驗(yàn)的目的， VLAN 在實(shí)際組網(wǎng)技術(shù)中作用很大，掌握 VLAN 的運(yùn)用非常有實(shí)際意義。我們開發(fā)設(shè)計(jì)了基于 WEB 的虛擬計(jì)算機(jī)網(wǎng)絡(luò)實(shí)驗(yàn)平臺(tái)， 同時(shí)， 該實(shí)驗(yàn)平臺(tái)的 系統(tǒng)目標(biāo)應(yīng)該和高校的教學(xué) 目標(biāo)一致 。 (2)各網(wǎng)絡(luò)實(shí)驗(yàn) 具有 簡(jiǎn)單 交互 和 演示功能 。 (4)系統(tǒng)穩(wěn)定性和兼容性好， 能在 各種 Windows 操作系統(tǒng) 正常運(yùn)行。 從以下三方面對(duì)能否實(shí)現(xiàn) 該實(shí)驗(yàn)平臺(tái)的 目標(biāo)進(jìn)行可行性分析 經(jīng)濟(jì)可行性 系統(tǒng) 開發(fā)、運(yùn)行和維護(hù)費(fèi)用主要包括：設(shè)備的購(gòu)買和安裝費(fèi)用 ； 人員費(fèi)用 ， 由于本項(xiàng)目的特殊性該部分費(fèi)用可節(jié)省 和 其它費(fèi)用。 技術(shù)可行性 從設(shè)計(jì)者角度來看：我們 主要 采用 JavaScript 和 ASP 技術(shù)進(jìn)行詳細(xì)設(shè)計(jì)， 就目前我們開發(fā)小組成員所掌握的技術(shù)和 指導(dǎo)老師的指點(diǎn) 以及 計(jì)算機(jī)網(wǎng)絡(luò)實(shí)驗(yàn)室提供的硬件設(shè)備， 我們可以順利完成該網(wǎng)絡(luò)實(shí)驗(yàn)平臺(tái)的開發(fā)。因此，無論從 哪種角度來看，該網(wǎng)絡(luò)實(shí)驗(yàn)平臺(tái)在技術(shù)上是完全可行的 運(yùn)行可行性 系統(tǒng)運(yùn)行后 可以為 高校 網(wǎng)絡(luò)課程的實(shí)驗(yàn) 教學(xué)工作帶來的 許多 便利和幫助 ，學(xué)生通過該虛擬網(wǎng)絡(luò)實(shí)驗(yàn)平臺(tái)對(duì)網(wǎng)絡(luò)相關(guān)技術(shù)和重點(diǎn)進(jìn)行學(xué)習(xí)和實(shí)踐。而整個(gè)網(wǎng)絡(luò)實(shí)驗(yàn)平臺(tái)采用友好的交互界面，簡(jiǎn)介明了。 天津工程師范學(xué)院 2021 屆本科生畢業(yè)設(shè)計(jì)（論文） 18 需求分析 基于 WEB的虛擬計(jì)算機(jī)網(wǎng)絡(luò)實(shí)驗(yàn)平臺(tái)主要是針對(duì)高校計(jì)算機(jī)專業(yè)網(wǎng)絡(luò)實(shí)驗(yàn)課程而開發(fā)設(shè)計(jì)的 ,該平臺(tái)是在開放式環(huán)境中使用 ,該系統(tǒng)的演示模塊是通過 Flash編譯成 SWF 格式 文件 ,交互模塊都是通過 ASP 技術(shù)來實(shí)現(xiàn)。同時(shí)在進(jìn)行網(wǎng)絡(luò)實(shí)驗(yàn)平臺(tái)的開發(fā)時(shí)，應(yīng)進(jìn)行綜合分析，該平臺(tái)應(yīng)具備標(biāo)準(zhǔn)性與主流性；實(shí)用性與經(jīng)濟(jì)性；易用性與擴(kuò)展性。 功能要求 要求系統(tǒng)能滿足高校師生對(duì)于計(jì)算機(jī)網(wǎng)絡(luò)實(shí)驗(yàn)課程教學(xué)工作的需要，能夠仿真真實(shí)路由器、交換機(jī)、無線網(wǎng)絡(luò)、網(wǎng)絡(luò)服務(wù)器進(jìn)行交互配置操作，如果命令輸入正確則可以順利進(jìn)入下一步或下一頁面，如果命令輸入錯(cuò)誤，則程序會(huì)給出錯(cuò)誤提示。 外部接口要求 用戶接口要求： 本 實(shí)驗(yàn)平臺(tái) 的用戶一般需要通過 IE 瀏覽器 ，進(jìn)入主界面后點(diǎn)擊相應(yīng)的窗口，分別進(jìn)入相對(duì)應(yīng)的界面 。盡可能真實(shí)模仿各種網(wǎng)絡(luò)實(shí)驗(yàn)界面窗口，配置過程及結(jié)果等。 性能要求 系統(tǒng)除應(yīng)必須滿足對(duì)定時(shí)約束或容量約束，通常包括速度（響應(yīng)時(shí)間）、信息量速率、主存容量、安全性等方面的需求。主要的性能要求如下： 時(shí)間需求 在運(yùn)行該平臺(tái)時(shí) ，響應(yīng)時(shí)間，更新處理時(shí)間 、鏈接時(shí)間 都 應(yīng) 比較快且迅速，完全滿足 高校網(wǎng)絡(luò)實(shí)驗(yàn)課教學(xué)的 要求。 故障處理 在開發(fā)階段 當(dāng)中，能夠?qū)δK測(cè)試 中測(cè)試出來的錯(cuò)誤進(jìn)行 隨 時(shí)的 修改 。 天津工程師范學(xué)院 2021 屆本科生畢業(yè)設(shè)計(jì)（論文） 20 6 系統(tǒng)總體設(shè)計(jì) 整個(gè)虛擬計(jì)算機(jī)網(wǎng)絡(luò)實(shí)驗(yàn)平臺(tái)，包括了目前網(wǎng)絡(luò)實(shí)驗(yàn)課程當(dāng)中比較普遍的也是目前開設(shè)網(wǎng)絡(luò)實(shí)驗(yàn)課程當(dāng)中重點(diǎn)部分，如：網(wǎng)絡(luò)互連設(shè)備（交換機(jī)、路由器等）配置、無線網(wǎng)絡(luò)（無線 AP、無線網(wǎng)卡）的配置、網(wǎng)絡(luò)服務(wù)器的配置等。系統(tǒng)總體框架如圖 61所示： 圖 61 系統(tǒng)總體框架 各實(shí)驗(yàn)的教學(xué)環(huán)節(jié)介紹了相關(guān)內(nèi)容基礎(chǔ)的、關(guān)鍵的、核心的知識(shí)，掌握每個(gè)的知識(shí)離不開親自動(dòng)手實(shí)驗(yàn)，實(shí)驗(yàn)演示環(huán)節(jié)為學(xué)習(xí)者全面演示了各實(shí)驗(yàn)的操作過程，實(shí)驗(yàn)指導(dǎo)部分提供了實(shí)驗(yàn)?zāi)康摹?shí)驗(yàn)環(huán)境及實(shí)驗(yàn)步驟，學(xué)習(xí)者通過該部分可以了解到實(shí)驗(yàn)的整個(gè)流程，模擬實(shí)訓(xùn)部分則為學(xué)習(xí)者提供了各種實(shí)驗(yàn)的模擬練習(xí)，學(xué)習(xí)者通過該部分的練習(xí)就可以基本掌握各種實(shí)驗(yàn)的實(shí)質(zhì)了。 Dreamweaver 是一種網(wǎng)頁版式設(shè)計(jì)軟件，能夠比較容易實(shí)現(xiàn)網(wǎng)頁的美工 ，配合 Flash 工具制作的一些動(dòng)畫，從而設(shè)計(jì)出畫面精美，內(nèi)容豐富的界面。系統(tǒng)主界面的設(shè)計(jì)框圖如圖 71所示。 我們建立的四個(gè)實(shí)驗(yàn)課程鏈接，可以讓學(xué)習(xí)者根據(jù)自己的實(shí)際需要進(jìn)行分項(xiàng)的學(xué)習(xí)，該主界面左側(cè)是公告攔和實(shí)驗(yàn)課程的鏈接地址。 主界面 頁面布局的整體結(jié)構(gòu)設(shè)計(jì)的思路是利用 HTML 語言的表格、框架、層、層疊式樣式表 （ CSS） 等技術(shù)結(jié)合起來控制其結(jié)構(gòu)。 利用表格的行、列顯示性質(zhì)可以很好的安排網(wǎng)頁中各種內(nèi)容元素的位置，它能對(duì)不同的對(duì)象加以處理，而又不用擔(dān)心不同對(duì)象之間的影響。這樣的布局可以使用戶一目了然，結(jié)構(gòu)清晰。 天津工程師范學(xué)院 2021 屆本科生畢業(yè)設(shè)計(jì)（論文） 23 （ 1） 打開 Dreamweaver，新建一個(gè) HTML 文件， 首先繪制布局表格，切換到布局視圖，在布局表格中，單擊對(duì)象面板中的繪制單元格按鈕，分別在頁面的頂部和左側(cè)拖動(dòng)鼠標(biāo)各繪制一個(gè)單元格。 圖 73 頂部單元格屬性圖 （ 3）在頂部表格插入 flash 后，在光標(biāo)處再插入一個(gè)一行六列的表格，在每個(gè)單元格中插入已用 firework 和 photoshop 編輯好的導(dǎo)航圖標(biāo)。 圖 74 導(dǎo)航圖標(biāo) （ 4） 在主內(nèi)容區(qū)根據(jù)需要插入嵌套表格和單元格，并按照實(shí)際要求進(jìn)行拆分單元格和合并單元格，在單元格中添加所需的內(nèi)容，主要利用 HTML 實(shí)現(xiàn)。 天津工程師范學(xué)院 2021 屆本科生畢業(yè)設(shè)計(jì)（論文） 24 圖 75 主內(nèi)容區(qū)設(shè)計(jì)圖 （ 5）在頁腳部分插入一行一列的表格，添加頁腳內(nèi)容署名版權(quán)。 網(wǎng)絡(luò)互連設(shè)備互動(dòng)模塊的設(shè) 計(jì) 互動(dòng)模塊的設(shè)計(jì)是整個(gè)實(shí)驗(yàn)平臺(tái)開發(fā)的重點(diǎn)也是難點(diǎn)，通過實(shí)現(xiàn)互動(dòng)模塊，可以使學(xué)習(xí)者對(duì)重點(diǎn)知識(shí)學(xué)習(xí)之后檢驗(yàn)自己的學(xué)習(xí)效果以及對(duì)重點(diǎn)知識(shí)的掌握情況。 對(duì)于用戶而言，人機(jī)界面就是系統(tǒng)本身。 該網(wǎng)絡(luò)實(shí)驗(yàn)平臺(tái)是以鍵盤為主的交互方 式的可視化設(shè)計(jì)平臺(tái)，人機(jī)界面的發(fā)展總是伴隨新技術(shù) 的產(chǎn)生。一方面，人向機(jī)器輸入時(shí)應(yīng)當(dāng)盡量采取自然的方式 。還有，不能把內(nèi)部的處理、加工與人機(jī)界面混在一起，以免互相干擾，影響速 度。最忌 諱的是每換一個(gè)屏幕用戶就要換一套操作命令與操作方法。 3) 界面必須能夠提供幫助 讓用戶駕馭軟件，而不是軟件駕馭用戶。有關(guān)的提示、信息、說明 應(yīng)該放在隨手可得的位置。原則上，對(duì)某一軟件來說，用戶的思維方式應(yīng)當(dāng)是一致的，操作與控制的方式也應(yīng)當(dāng)是一致的。另外還應(yīng)當(dāng)讓它們有一定的靈活性，能夠自由地選擇某些功能的操作方式。通過 Flash Action Script 腳本修改及擴(kuò)充了路由器部分的互動(dòng)模塊?；?dòng)模塊流程圖如 圖 76 所示。這時(shí)用戶可以刪除錯(cuò)誤的部分再輸入正確的命令回車重新加以確認(rèn)即可。路由器互動(dòng)模塊的路由器配置模式如圖 77 所示。 AKIndex = 1。 BE_1 = Enable 命令丟失 .。 if (eval(CE_ add Index) eq ) { ErrorMessage = eval(BE_ add Index)。 天津工程師范學(xué)院 2021 屆本科生畢業(yè)設(shè)計(jì)（論文） 28 } // 如果輸入的命令非空但是錯(cuò)誤則會(huì)顯示“ Enable 命令輸入錯(cuò)誤” } else { Alternative = 1。 } if (Check) { if (Alternative) { if (AAIndex CEIndex) { Check = 0。 } } else if (AKIndex CEIndex) { Check = 0。 圖 79 模擬交換機(jī)配置模式 開始 輸入命令并按回車提交處理輸入的命令 系統(tǒng)判斷 載入下 一個(gè)程序段 結(jié)束 Y N 天津工程師范學(xué)院 2021 屆本科生畢業(yè)設(shè)計(jì)（論文） 30 模擬實(shí)訓(xùn)部分初始狀態(tài)是第一個(gè)關(guān)鍵詞顯示，即 SWITCH顯示，而光標(biāo)隨著輸入的字符移動(dòng)，此功能代 碼實(shí)現(xiàn)片段如下 function sw1(){ =inline =none} if(==13){ judge()。} } =getfocus。_39。39。 =(0,len1)+tip} else{ tip=39。 =+tip} if(ttime100) ttime=0 zhi=setTimeout(flash(),200) } 當(dāng)用戶進(jìn)入進(jìn)入交換機(jī)特權(quán)模式將會(huì)在下方將要對(duì)下一步配置進(jìn) 行提示，實(shí)現(xiàn)代碼如下： function sw1(){ =inline =none =39。 =39。}//提示 實(shí)現(xiàn)效果如下圖所示： 天津工程師范學(xué)院 2021 屆本科生畢業(yè)設(shè)計(jì)（論文） 31 圖 710 實(shí)現(xiàn)效果圖 當(dāng)用戶輸入指令錯(cuò)誤后將會(huì)提示 Bad mand of file name,鍵入退格鍵后將會(huì)重新進(jìn)入輸入狀態(tài)。Bad mand or file name39。enable39。conf t39。host sw139。ena se c139。line vty 0 1539。pass c239。int fe 0/139。int fe 0/239。switchport mode access39。int vlan 139。ip add 39。no shut39。end39。copy run start39。39。啟用該端口 39。當(dāng)輸入的命令正確時(shí)，將進(jìn)入下一步實(shí)驗(yàn)；若天津工程師范學(xué)院 2021 屆本科生畢業(yè)設(shè)計(jì)（論文） 34 輸入錯(cuò)誤，則彈出錯(cuò)誤信息，用戶根據(jù)錯(cuò)誤信息改正命令后可繼續(xù)進(jìn)行下面的實(shí)驗(yàn)。實(shí)驗(yàn)練習(xí)部分是 通過 ASP 進(jìn)行腳本編程實(shí)現(xiàn)的。 以交換機(jī)基本參數(shù)配置為例，頁面文本框和按鈕分別起名，每個(gè)文本框和按鈕區(qū)分開，點(diǎn)擊按鈕有一個(gè)觸發(fā)的函數(shù)，用來傳遞參數(shù)。 ()。 天津工程師范學(xué)院 2021 屆本科生畢業(yè)設(shè)計(jì)（論文） 35 8 測(cè)試 測(cè)試是軟件開發(fā)時(shí)期的最后一個(gè)階段，也是軟件質(zhì)量保證中至關(guān)重要的一個(gè)環(huán)節(jié)。 任務(wù)是通過在計(jì)算機(jī)上執(zhí)行程序，暴露程序中潛在的錯(cuò)誤并消除軟件故障，保證程序的可靠運(yùn)行。圖中表 明，每一次測(cè)試都要準(zhǔn)備好若干必要的測(cè)試數(shù)據(jù)，與被測(cè)程序一道送入計(jì)算機(jī)執(zhí)行。每個(gè)測(cè)試用例產(chǎn)生一個(gè)相應(yīng)的“測(cè)試結(jié)果”。測(cè)試階段的信息流如圖 81 所示： 圖 81：測(cè)試階段的信息流 在整個(gè)系統(tǒng)的創(chuàng)作過程中，我們經(jīng)過指導(dǎo)老師的指導(dǎo)，和同組同學(xué)之間的討論，我們對(duì)系統(tǒng)進(jìn)行了模塊測(cè)試，把每個(gè)模塊作為單獨(dú)的實(shí)體來測(cè)試，盡早的發(fā)現(xiàn)錯(cuò)誤并進(jìn)行修改，目的是為了保證每個(gè)單元（模塊）能正 常運(yùn)行。然后在系統(tǒng)的深入創(chuàng)作過程中，對(duì)各子系統(tǒng)進(jìn)行了鏈接和可用性測(cè)試。 天津工程師范學(xué)院 2021 屆本科生畢業(yè)設(shè)計(jì)（論文） 36 9 總結(jié) 畢業(yè)設(shè)計(jì)是我們?cè)谖迥甏髮W(xué)學(xué)習(xí)中經(jīng)歷的最重要的一個(gè)環(huán)節(jié)，它是對(duì)我們?cè)诖髮W(xué)階段所學(xué)的理論知識(shí)的一次系統(tǒng)的應(yīng)用，是檢驗(yàn)我們的實(shí)際動(dòng)手能力和創(chuàng)新思想的一次重要的過程。有了本教學(xué)系統(tǒng)學(xué)生們可以不需要進(jìn)入實(shí)驗(yàn)室就能通過操作本系統(tǒng)進(jìn)行一些網(wǎng)絡(luò)實(shí)驗(yàn)課