【正文】 { name=()。 } else{ name=游客 。 } 沈陽理工大學(xué)學(xué)士學(xué)位論文 21 ().setAttribute(name, name)。 //查詢熱門文章 NoteDao ndao=new NoteDao()。 ListNote notes= ()。 //查詢公告 AdviceDao adao=new AdviceDao()。 ListAdvice advices=()。 Advice advice= (Advice)(0)。 String title= ()。 //查詢最新圖片 PhotoDao pdao=new PhotoDao()。 ListPhoto photos= ()。% 系統(tǒng)登錄 注冊模塊 設(shè)計(jì) 點(diǎn)擊主頁右上角的“登錄 /注冊”會跳轉(zhuǎn)到登錄注冊畫面，如圖 所示： 圖 用戶登錄畫面 沈陽理工大學(xué)學(xué)士學(xué)位論文 22 登錄驗(yàn)證過程：要求輸入用戶名密碼以及驗(yàn)證碼， 驗(yàn)證碼的作用是告知服務(wù)器操作的對象是人 而非機(jī)器程序 ， 服務(wù)器會首先驗(yàn)證 驗(yàn)證碼是否正確，防止非法 以及惡意 操作 ，如果 驗(yàn)證碼 正確 ， 就會去查詢數(shù)據(jù)庫，檢測用 戶名和密碼是否正確，否則將跳轉(zhuǎn)回登錄畫面，頁面每刷新一次驗(yàn)證碼都會變換一次；當(dāng)輸入的用戶名和密碼正確的時(shí)候?qū)⒎祷厥醉?[16]。登錄驗(yàn)證 的流程圖 如圖 所示： 圖 登錄驗(yàn)證流程圖 沈陽理工大學(xué)學(xué)士學(xué)位論文 23 點(diǎn)擊登陸界面的注冊用戶將進(jìn)入用戶注冊畫面如圖 所示： 圖 用戶注冊畫面 注冊畫面會做注冊 的輸入 驗(yàn)證，當(dāng)輸入為空或者兩次輸入的密碼不一致時(shí)將出現(xiàn)彈出對話框提示， 本程序 通過 javascript 實(shí)現(xiàn)驗(yàn)證，主要實(shí)現(xiàn)代碼如下： //用戶注冊驗(yàn)證 function saveuser(){ if(==){ (請輸入用戶名！ )。 return false。 } if(==){ (請輸入用戶登錄密碼 ！ )。 return false。 } if(==){ (請輸入重復(fù)登錄密碼！ )。 return false。 } if (!=){ alert(您兩次輸入的密碼不一致，請重新輸入！ )。 沈陽理工大學(xué)學(xué)士學(xué)位論文 24 return false。 } if(==){ (請輸入個(gè)人簡介！ )。 return false。 } } 普通注冊用戶管理模塊設(shè)計(jì) 注冊成功將返回登錄畫面，用戶登錄 后可以在主頁單擊 “進(jìn)入后臺” 進(jìn)入 到注冊用戶 自己的管理界面如圖 所示： 圖 普通注冊用戶管理界面 普通 注冊 用戶 可以 在后臺實(shí)現(xiàn)日志管理，日志分類管理，照片管理，留言板管理和站內(nèi)應(yīng)用以及用戶信息管理等操作，用戶進(jìn)入用戶自己的后臺管理界面之后同樣可以 實(shí)現(xiàn) 退出，返回前臺，以及注銷用戶等操作 [17]?，F(xiàn)分別對各大模塊做詳細(xì)說明： 沈陽理工大學(xué)學(xué)士學(xué)位論文 25 日志管理模塊設(shè)計(jì) （ 1） 日志添加 因?yàn)橐砑?日志必須先添加日志分類所以對于新注冊的用戶 在 沒有添加日志分類的情況下， 添加日志 時(shí)會提示用戶先添加分類，跳轉(zhuǎn)到日志 類 別 添加畫面如圖 所示： 圖 提示添加文章類型畫面 文章類型添加之后點(diǎn) 擊添加日志將出現(xiàn)如圖 所示的日志添加畫面： 圖 日志添加畫面 沈陽理工大學(xué)學(xué)士學(xué)位論文 26 添加日志的時(shí)候首先要先向數(shù)據(jù)庫查詢 改用戶的所有的日志類別并且以下拉框的形式展示在日志添加畫面， 日志添加畫面流程圖如圖 所示： 圖 日志添加模塊流程圖 （ 2） 日志修改 添加日志完成之后將跳轉(zhuǎn)到日志列表畫面可以在該 頁面實(shí)現(xiàn)日志的修改以及刪除。日志修改時(shí)畫面如圖 所示： 圖 日志修改畫面 沈陽理工大學(xué)學(xué)士學(xué)位論文 27 修改畫面會 顯示上一次保存 的日志信息，因此修改之前應(yīng)該先查詢出所要修改的日志的信息， 系統(tǒng)流程圖如圖 所示 ： 圖 日志修改 模塊 流程圖 照片管理模塊設(shè)計(jì) 本模塊主要是涉及 到文件的上傳 和 下載，在這里我們用到了一個(gè) jspsmartupload 組件，通過該組件可以方便的在 jsp 中上傳和下載文件， 圖片會上傳到 WebContent/file 目錄下面，在數(shù)據(jù)庫中存放的是 照片的地址。 照片添加頁面如圖 所示 ： 沈陽理工大學(xué)學(xué)士學(xué)位論文 28 圖 照片添加畫面 因?yàn)樯婕暗轿募纳蟼?， 所以 jsp 頁面中的 form標(biāo)簽的 enctype 屬性值應(yīng)為multipart/formdate， 相關(guān) 代碼如下所示： form id=form1 name=form1 method=post action=%=path %/admin/photo?type=save enctype=multipart/formdata 上傳成功畫面如圖 所示： 圖 圖片列表畫面 留言板模塊設(shè)計(jì) 用戶可以通過站內(nèi)應(yīng)用的查看站內(nèi)用戶功能查看 站內(nèi)所有用戶并對用戶留言，用戶可以通過留言板模塊查看別人 的留言并回復(fù)留言，我的留言板如圖 所示： 沈陽理工大學(xué)學(xué)士學(xué)位論文 29 圖 留言板列表畫面 用戶可以回復(fù)留言如圖 所示： 圖 回復(fù)留言畫面 站內(nèi)應(yīng)用 模塊設(shè)計(jì) 注冊用戶可以通過站內(nèi)應(yīng)用 檢索站內(nèi)日志以及 與其 他注冊用戶進(jìn)行互動 等。 （ 1） 日志搜索 如圖 所示： 圖 日志搜索畫面 沈陽理工大學(xué)學(xué)士學(xué)位論文 30 搜索是根據(jù)關(guān)鍵詞進(jìn)行模糊查找，查找的條件 是 日志的標(biāo)題或者內(nèi)容中含有關(guān)鍵詞即可， 在 dao 層的 主要實(shí)現(xiàn)代碼如下： public ListNote queryit(String contents){ //獲取與數(shù)據(jù)庫的連接 Connection conn=()。 PreparedStatement ps=null。 //建立一個(gè) List來存儲 查詢到的 日志 ListNote notes=new ArrayListNote()。 try { //創(chuàng)建 模糊查詢語句 String sql=select * from blog where blogcontent like ? or blogtitle like ? order by createtime desc,viewnum 。 ps=(sql)。 String str1=%+contents+%。 (1, str1)。 (2, str1)。 //執(zhí)行查詢 并 將結(jié)果放到 ResultSet結(jié)果集中 ResultSet rs=()。 Note note=null。 //遍歷結(jié)果集 while(()){ note=new Note()。 ((blogcontent))。 ((blogtitle))。 ((viewnum))。 ((createtime))。 ((blogid))。 (note)。 } 沈陽理工大學(xué)學(xué)士學(xué)位論文 31 } catch (Exception e) { ()。 }finally{ (conn)。 } //返回日志信息 return notes。 } 查詢后的結(jié)果如圖 所示： 圖 查詢結(jié)果畫面 可以點(diǎn)擊標(biāo)題的超鏈接進(jìn)入文章正文 進(jìn)行瀏覽 和評論 。 （ 2） 站內(nèi)聊天 類似于 一個(gè)公共聊天室，所有的登錄用戶可以在里面進(jìn)行聊天，如圖 所示 為 模擬兩個(gè)用戶登錄聊天 的畫面 ： 沈陽理工大學(xué)學(xué)士學(xué)位論文 32 圖 聊天畫面 聊天頁面會 隔一定 時(shí)間刷新一次： 主要 實(shí)現(xiàn)代碼如下： % //設(shè)置編碼方式 UTF8 (utf8)。 String send = (send)。 (send)。 //判斷是否發(fā)送信息 if(null != send amp。amp。 發(fā)送 .equals(send)){ //獲取要發(fā)送的信息以及 用戶名，系統(tǒng)時(shí)間 String info = (info)。 String username = (String)(username)。 Date date = new Date()。 //將用戶名，輸入框中的信息以及系統(tǒng)時(shí)間拼接成字符串 str String str = username + , + date + br + info + br。 //從 JSP的內(nèi)置對象 application中獲取 lists，判斷 lists是否為空，為空的話新建 lists //并將 str放入 lists，不為空則將 str直接放入 lists Object obj = (lists)。 沈陽理工大學(xué)學(xué)士學(xué)位論文 33 ListString lists = null。 if(null == obj){ lists = new ArrayListString()。 (str)。 (lists, lists)。 } else { lists = (ListString)obj。 (str)。 (lists, lists)。 } } % 評論模塊設(shè)計(jì) 注冊用戶可以查看其他注冊用戶的文章并評論，該文章作者以及管理員可以刪除評論，游客不能 查看或者 發(fā)表評論，發(fā)表評論畫面如圖 所示： 圖 評論添加畫面 沈陽理工大學(xué)學(xué)士學(xué)位論文 34 對于瀏覽文章的用戶首先會判斷其身份（游客，文章作者 ，管理員，其他注冊用戶），根據(jù)不同情況展現(xiàn)不同的畫面， 實(shí)現(xiàn)不同的功能， 評論功能 流程圖如圖 所示： 圖 評論模塊流程圖 管理員管理模塊設(shè)計(jì) 管理員作為一種特殊的注冊用戶，可以實(shí)現(xiàn)普通注冊用戶的所有 功能，并且具有一些特殊的權(quán)限， 圖 為管理員登 錄后的畫面： 沈陽理工大學(xué)學(xué)士學(xué)位論文 35 圖 管理員后臺界面 可見管理員用戶比普通用戶多了用戶管理和公告管理 這 兩個(gè)功能，現(xiàn)在重點(diǎn)介紹管理員用戶特殊的功能及其實(shí)現(xiàn)： 公告管理模塊設(shè)計(jì) 公告用來顯示在首頁，可以被所有的瀏覽者看到，因?yàn)槭?多個(gè)用戶 共 用一個(gè)公共的主頁，所以只有管理員才有權(quán)限去管理公告， 圖 是添加公告的畫面： 圖 公告添加畫面 沈陽理工大學(xué)學(xué)士學(xué)位論文 36 上圖中點(diǎn)一下公告日期欄會彈出一個(gè)選擇公告日期的插件，管理員可以自己定義公告的日期 。 日志管理模塊設(shè)計(jì) 普通用戶只能查看修改自己的文章，管理員可以對所有的用戶的 日志進(jìn) 行查看和刪除操作，體現(xiàn)了管理員特殊的用戶權(quán)限，管理員查看日志如 圖 所示： 圖 管理員查看日志 畫面 沈陽理工大學(xué)學(xué)士學(xué)位論文 37 5 系統(tǒng)測試 基于 Web 的系統(tǒng)測試不僅要驗(yàn)證系統(tǒng)的功能是否按照計(jì)劃的要求運(yùn)行，還要評價(jià)系統(tǒng)在各瀏覽器下以及各分辨率下是否能夠正常顯示，最重要的是，要從最終客戶的角度對安全性和可用性進(jìn)行測試。 鏈接測試 鏈接是 Web 應(yīng)用的主要特征，頁面與頁面之間是靠鏈接聯(lián)系起來的，鏈接測試主要從以下幾個(gè)方面進(jìn)行測試。 （ 1）測試所鏈接的頁面是否連接到了指定的頁面，即 沒有死鏈接或者沒有鏈接錯(cuò)地方。 （ 2）測試系統(tǒng)是否存在孤立的頁面，即只有知道頁面的鏈接地址才能訪問的頁面。 測試結(jié)果如下： 表 鏈接測試結(jié)果 表單測試 當(dāng)用戶向 Web 服務(wù)器提交信息時(shí)，就需要使用表單操作，例如用戶注冊、登錄、發(fā)表日志、發(fā)表評論等提交的數(shù)據(jù)進(jìn)行驗(yàn)證，以保證提交給服務(wù)器的數(shù)據(jù)是合法的，如果數(shù)據(jù)不合法，系統(tǒng)是否會提示錯(cuò)誤語句。 本系統(tǒng)對需要的提交的表單都做出了有效性和合法性驗(yàn)證，首先是非 空驗(yàn)證，其次是非法字符驗(yàn)證，此外還包含對數(shù)據(jù)的存在性驗(yàn)證。相關(guān)錯(cuò)誤提供提示語句，保證了系統(tǒng)的友好交互性。 瀏覽器兼容測試 瀏覽器測試主要是測試在不同瀏覽器和分辨率下，系統(tǒng)的界面是否會產(chǎn)生變形。本次測試主要是針對目前市場上主流瀏覽器 IE8和 Firefox在分辨率 1024*768和 1280*1024下的頁面顯示情況。測試結(jié)果系統(tǒng)能夠在不同分辨率的瀏