JSP實現(xiàn)網(wǎng)站新聞管理系統(tǒng).ppt

1、JSP實現(xiàn)網(wǎng)站新聞管理系統(tǒng),本章主要內(nèi)容,新聞管理系統(tǒng)總體設計 新聞管理系統(tǒng)數(shù)據(jù)庫設計 新聞管理系統(tǒng)的基本框架 新聞系統(tǒng)各功能模塊的設計與實現(xiàn) 新聞系統(tǒng)的部署和發(fā)布,13.1 系統(tǒng)總體設計,系統(tǒng)功能及模塊 (1)瀏覽新聞 用戶能夠通過瀏覽器查看新聞，如果有多條新聞，要求可以分頁顯示 (2)新聞的錄入（發(fā)布） 要求是通過瀏覽器來完成，并且可以編輯新聞的格式 (3)新聞的修改 要求通過瀏覽器來完成 (4)刪除新聞 根據(jù)需要，可以刪除新聞 (5)系統(tǒng)驗證 對系統(tǒng)進行管理前，必須經(jīng)過登陸系統(tǒng)驗證。用戶不必登陸即可隨便查看新聞，系統(tǒng)管理員必須要經(jīng)過身份驗證才能管理系統(tǒng),根據(jù)功能需求，系統(tǒng)包括如下模塊：

2、(1)新聞瀏覽主頁面 (2)新聞瀏覽最終頁面 (3)系統(tǒng)管理主頁面 (4)發(fā)布新聞模塊 (5)修改新聞模塊 (6)刪除新聞模塊,系統(tǒng)實現(xiàn)方案 開發(fā)數(shù)據(jù)庫應用系統(tǒng)一般來說有兩種數(shù)據(jù)庫體系結構：C/S（Client/Server,客戶機/服務器）結構和B/S結構（Browser/Server,瀏覽器/服務器）結構。 C/S是Client/Server的縮寫，服務器通常采用高性能的PC、工作站或小型機，并采用大型數(shù)據(jù)庫系統(tǒng)，如Oracle、Sybase、Informix或 SQL Server?？蛻舳诵枰惭b專用的客戶端軟件 B/S 是Brower/Server的縮寫，客戶機上只要安裝一個瀏覽器（B

3、rowser），如Netscape Navigator或Internet Explorer，服務器安裝Oracle、Sybase、Informix或 SQL Server等數(shù)據(jù)庫。用戶界面完全通過WWW瀏覽器實現(xiàn)，主要事務邏輯在服務器端實現(xiàn)。瀏覽器通過Web Server 同數(shù)據(jù)庫進行數(shù)據(jù)交互。,13.2系統(tǒng)數(shù)據(jù)庫設計,數(shù)據(jù)庫需求分析 根據(jù)本系統(tǒng)功能要求，新聞管理系統(tǒng)需要以下數(shù)據(jù)項 (1)新聞資料 新聞標題、新聞內(nèi)容、發(fā)布日期、發(fā)布人 (2)用戶密碼資料 用戶名、密碼、是否為管理員、姓名,數(shù)據(jù)表設計 設計兩個表，分別為新聞文章表和用戶表，這兩個表的結構如下所示：,新聞文章表(article),

4、用戶表（password）,以上兩個數(shù)據(jù)表，我們將其放在數(shù)據(jù)庫newmanage中。,13.3 系統(tǒng)基本框架,新聞管理系統(tǒng)的功能是用戶可以通過瀏覽器查看新聞，管理員也可以通過瀏覽器發(fā)布和管理新聞。 新聞管理系統(tǒng)的基本結構圖如下所示：,本系統(tǒng)的程序目錄結構如下所示：,13.4 公共模塊設計,公共模塊一共包含4個JSP文件和一個CSS文件：”common.jsp”、“connectdb.jsp”、“check.jsp”、“codefilter.jsp”、 style.css common.jsp：包含其他JSP文件中需要導入的JAVA類和包，這樣其他的JSP文件就可以只需要將”common.jsp

5、”文件包含進來即可，而不必逐一包含Java類和包。 connectdb.jsp:用來連接數(shù)據(jù)庫 check.jsp：用來判斷是否是以系統(tǒng)管理員的身份登陸系統(tǒng)，防止非法用戶直接進入系統(tǒng)管理后臺對系統(tǒng)進行破壞 codefilter.jsp：用于對新聞文章的內(nèi)容進行轉換，將一般格式與HTML格式之間的轉換，如一般格式的回車換行，在HTML中就是一個標記等。,13.4.1“common.jsp”文件 內(nèi)容如下： 其他JSP文件只需要加載這個文件即可。,13.4.1“connectdb.jsp”文件 ,變量title是一個全局變量，將在包含“connectdb.jsp”的JSP文件中使用。,“check

6、.jsp”文件 程序代碼如下： ,“codefilter.jsp”文件 源代碼如下所示： = 0) output.append(str_source.substring(posStart,pos); output.append(str_new); posStart = pos + lengOfold; if(posStart lengOfsource) output.append(str_source.substring(posStart); return output.toString(); ,String toHtml(String s) s = Replace(s, %,定義了3個方法：

7、Replace()方法是內(nèi)部方法，供其他兩個方法調(diào)用的，其他程序只調(diào)用toHtml() 和unHtml()方法。 Replace()方法功能是：將某個字符串中的特殊子串替換為其他的字符子串，它共有3個參數(shù)，str_source 表示蒸個字符串，str_original表示要替換的原來的子串， str_new表示要替換的新子串。方法返回的是替換后的整個字符串 toHtml()：將一般格式的字符串轉換為html格式的字符串，unHtml（）方法則相反。,“Style.css”文件,A:link FONT-SIZE: 9pt; COLOR: #000000; TEXT-DECORATION: und

8、erline A:hover FONT-SIZE: 9pt; COLOR: #ff0000; TEXT-DECORATION: underline A:visited FONT-SIZE: 9pt; COLOR: #0000ff; TEXT-DECORATION: underline .text FONT-SIZE: 9pt; COLOR: #000000; TEXT-DECORATION: none .title FONT-SIZE: 16px; COLOR: #000000; TEXT-DECORATION: none .body FONT-SIZE: 12pt; COLOR: #0000

9、00; TEXT-DECORATION: none ,【新聞瀏覽】主界面,index.jsp主界面, , target=_blank ,【新聞瀏覽最終頁面】主界面,Article.jsp頁面：, , , , ,后臺管理系統(tǒng),新聞管理系統(tǒng)的后臺管理用來發(fā)布、修改、刪除新聞。只有擁有相應權限的管理員才能管理系統(tǒng), 管理員登錄 ,管理員登陸登陸系統(tǒng)login.jsp 作用：用來讓管理員輸入用戶名和密碼,15 ) alert(請輸入正確的用戶名 ！) return false; if( form.password.value.length15 ) alert(請輸入正確的登錄密碼 ！) return

10、false; - , 用戶名： 密 % ,login.jsp頁面運行結果：,Checklogin.jsp文件作用:與數(shù)據(jù)庫連接驗證此用戶是否是管理員。, ,當管理員輸入正確的用戶名和密碼后，就進入了系統(tǒng)管理主頁面”main.jsp”。 系統(tǒng)管理主頁面”main.jsp”是系統(tǒng)后臺管理的中心，通過該頁面可以發(fā)布、修改、刪除新聞。, 管理 ,main.jsp代碼,系統(tǒng)管理后臺 發(fā)布新聞 刷新 while(_rs.next() % ,”編 輯新聞 )刪除新聞 ,【發(fā)布新聞】模塊 由兩個文件組成：”addarticle.jsp”和”savearticle.jsp” 用戶在”addarticle.jsp

11、”頁面中添加新聞，然后提交表單，通過“savearticle.jsp”頁面將添加的新聞保存到數(shù)據(jù)庫newmanage的數(shù)據(jù)表article中。, 管理 function check_input(theForm) if (theForm.newstitle.value = ) alert(請輸入新聞標題); theForm.newstitle.focus(); return (false); ,if (theForm.newsbody.value = ) alert(請輸入新聞的內(nèi)容); theForm.newsbody.focus(); return (false); if (theForm.

12、newstitle.value.length 100) alert(新聞的標題長度應小于50個字.); theForm.newstitle.focus(); return (false); 發(fā)布新聞 *為必填項目 , 新聞標題 *不得超過 50個漢字 ,addarticle.jsp運行結果：, 管理 % try String newstitle = new String(request.getParameter(newstitle).getBytes(ISO8859_1),utf-8); String newsbody = new String(request.getParameter(new

13、sbody).getBytes(ISO8859_1),utf-8); java.util.Date cur_time = new java.util.Date(); SimpleDateFormat formatter = new SimpleDateFormat(yyyy-MM-dd HH:mm:ss); String dateString = formatter.format(cur_time); String adduser=(String)session.getValue(username); sql = INSERT INTO article(TITLE,BODY,ADDDATE,A

14、DDUSER) values(?,?,?,?);,savearticle.jsp： 將添加的新聞保存到 數(shù)據(jù)庫,PreparedStatement prepstmt = null; prepstmt=con.prepareStatement(sql); prepstmt.setString(1,newstitle); prepstmt.setString(2,(toHtml(newsbody); prepstmt.setString(3,dateString); prepstmt.setString(4,adduser); prepstmt.executeUpdate(); catch(Exc

15、eption e) out.println(錯誤信息:+e.getMessage(); % 新聞發(fā)布成功 本頁面將在3秒鐘后自動返回管理頁面，您可以選擇以下操作： 返回新聞首頁 繼續(xù)發(fā)布新聞 , function countDown(secs)last.innerText=secs;if(-secs0)setTimeout(countDown(+secs+),1000);countDown(3); ,savearticle.jsp運行結果,【編輯新聞】模塊 由兩個文件組成：”editarticle.jsp”和”editarticleover.jsp” ” editarticle.jsp”頁面

16、將待修改的新聞和內(nèi)容顯示出來，供管理員修改。 “editarticleover.jsp”頁面用于將修改后的新聞保存到數(shù)據(jù)庫newmanage的數(shù)據(jù)表article中 下面是editarticle.jsp源代碼:, 管理 , function check_input(theForm) if (theForm.newstitle.value = ) alert(請輸入新聞標題.); theForm.newstitle.focus(); return (false); if (theForm.newsbody.value = ) alert(請輸入新聞的內(nèi)容.); theForm.newsbody.

17、focus(); return (false); if (theForm.newstitle.value.length 100) alert(新聞標題長度應小于50個字.); theForm.newstitle.focus(); return (false); , onsubmit=return check_input(this) 修改新聞 *為必填項目 新聞標題 *不得超過50個漢字 , , 管理 % try String newstitle = new String(request.getParameter(newstitle).getBytes(ISO8859_1),utf-8); St

18、ring newsbody = new String(request.getParameter(newsbody).getBytes(ISO8859_1),utf-8); int id = Integer.parseInt(request.getParameter(id); sql = UPDATE article SET TITLE=?, BODY=? WHERE ID=?; PreparedStatement prepstmt = null; prepstmt=con.prepareStatement(sql); prepstmt.setString(1,newstitle); prepstmt.setString(2,(toHtml(newsbody); prepstmt.setInt(3,id); prepstmt.executeUpdate(); ,edit