劉磊

摘 要： 設計并實現(xiàn)了一個基于B/S架構(gòu)的個人博客管理系統(tǒng)，包括游客瀏覽博客、用戶發(fā)表博客及使用爬蟲抓取網(wǎng)絡新聞等功能。系統(tǒng)前端使用當前流行的響應式布局框架Bootstrap開發(fā)，頁面能匹配不同分辨率；后端使用Hibernate、Spring、Struts三大經(jīng)典組合框架開發(fā)，系統(tǒng)擴展性強。本文論述了本系統(tǒng)的功能設計、流程設計、數(shù)據(jù)模型設計、效果實現(xiàn)等軟件開發(fā)關(guān)鍵階段的開發(fā)過程。

關(guān)鍵詞： Web框架； SSH框架； Bootstrap框架； 個人博客； 網(wǎng)絡爬蟲

中圖分類號：TP393.02 文獻標志碼：A 文章編號：1006-8228（2017）05-20-04

Design and implementation of blog management system based on Web framework

Liu Lei

（The Open University of Guangdong（Guangdong Polytechnic Institute）， Guangzhou， Guangdong 510000， China）

Abstract： In this paper， a personal blog management system based on B/S architecture is designed and implemented， which includes the functions of the visitors browsing the blog， the blog users publishing the blog and the crawler crawling the network news. The front end of the system is developed with Bootstrap， which makes the page can be matched with different resolutions， and the back-end is developed with the classic combination framework combined with Hibernate， Spring and Struts， which makes the system scalable. This paper discusses the developing process of the software development， such as function design， process design， data model design and the realization of the effects.

Key words： Web framework； SSH framework； Bootstrap framework； personal blog； Web crawler

0 引言

博客，又稱網(wǎng)絡日志，是一種表達個體思想、彰顯個人風格的互聯(lián)網(wǎng)工具，通常為個人自主管理的網(wǎng)站。用戶可以自由的在博客上發(fā)表文章，最新的文章排列在最前顯示，游客可以瀏覽博文；除了提供信息展示的功能，博客還提供評論、回復評論的交互功能，以提高博客的用戶粘連度。一個典型的博客囊括了文字、圖像、其他博客或網(wǎng)站的鏈接，以及相關(guān)媒體，博客是社會媒體網(wǎng)絡的一部分。博客系統(tǒng)是指，使用計算機語言編寫、安裝，方便用戶在互聯(lián)網(wǎng)上建立個人博客的一整套系統(tǒng)[1]。

本文嘗試從軟件工程的角度，詳細闡述個人博客管理系統(tǒng)的功能設計、流程設計和數(shù)據(jù)模型設計，技術(shù)選型使用經(jīng)典的J2EE企業(yè)級開發(fā)框架SSH和響應式前端框架Bootstrap，最后分析了系統(tǒng)關(guān)鍵功能實現(xiàn)。

1 功能結(jié)構(gòu)設計

本文設計的博客系統(tǒng)主要實現(xiàn)三個功能：發(fā)表和瀏覽日志、新聞爬蟲與收藏、內(nèi)容評論與回復。

1.1 發(fā)表日志

權(quán)限控制：未注冊的用戶只能查看公開日志；需要登錄才能增刪改，查看隱藏日志。

需要實現(xiàn)的模塊有七個。①用戶登錄：用戶使用帳號密碼登錄系統(tǒng)，認證成功則轉(zhuǎn)入個人主頁，失敗則顯示錯誤信息；②用戶注冊：填寫用戶名、密碼、個人信息，提交數(shù)據(jù)庫保存；③個人資料：填寫博主基本信息，包括博客名、作者簡介、性別、郵箱等；④發(fā)表日志：用戶發(fā)表日志，內(nèi)容包括主題主題、正文、圖片、媒體等信息，可以選擇是否公；⑤刪除日志：用戶可以選擇刪除已經(jīng)發(fā)表的日志，系統(tǒng)會從數(shù)據(jù)庫刪除這些信息；⑥查看日志：用戶或游客可以瀏覽公開的日志內(nèi)容；⑦修改日志：用戶修改已經(jīng)發(fā)表的日志，系統(tǒng)保存修改內(nèi)容。

1.2 新聞爬蟲與收藏

權(quán)限控制：未注冊用戶只能查看爬蟲新聞，需要登錄才能設置爬蟲篩選條件和進行收藏。

需要實現(xiàn)的模塊有二個。①新聞爬蟲：博客用戶可以設置篩選條件，爬蟲程序根據(jù)預定義規(guī)則獲取網(wǎng)絡信息并存儲到系統(tǒng)數(shù)據(jù)庫；②收藏：博客用戶可以收藏本網(wǎng)站其他用戶的日志，查看收藏記錄。

1.3 評論與回復

權(quán)限控制：允許匿名用戶發(fā)表評論，只有被評論的日志作者有權(quán)限回復、刪除評論。

需要實現(xiàn)的模塊有四個。①發(fā)表評論：系統(tǒng)允許訪客匿名評論所閱讀的日志；②回復評論：日志作者可以對日志的評論進行回復，與訪客進行互動；③刪除評論：博客用戶可以指定刪除對日志的評論；④自動顯示：評論自動顯示在對應日志的下方。

系統(tǒng)總體功能結(jié)構(gòu)設計如圖1所示。

2 業(yè)務流程設計

本系統(tǒng)角色包括游客與用戶，游客可以瀏覽博客文章列表、查看博主詳細資料、查看博文內(nèi)容、發(fā)表匿名評論等；游客無需登錄，進入系統(tǒng)主頁后，點擊菜單即可使用博客功能。用戶注冊賬號即成為博主，可以發(fā)表博文、編輯博文、刪除博文、編輯個人資料；同時系統(tǒng)提供了從互聯(lián)網(wǎng)抓取最新新聞到博客系統(tǒng)的功能，用戶可以啟動新聞爬蟲抓取新聞、刪除新聞內(nèi)容等。系統(tǒng)業(yè)務流程設計如圖2所示。

3 數(shù)據(jù)庫模型設計

個人博客管理系統(tǒng)主要關(guān)注博客文章的發(fā)表，分析系統(tǒng)需求，博客系統(tǒng)最關(guān)鍵的是用戶實體、文章欄目實體和文章內(nèi)容實體，本系統(tǒng)加入了評論和新聞爬取功能，所以需要提供評論和新聞兩個實體。數(shù)據(jù)庫模型設計如圖3所示。

4 技術(shù)框架選型

本系統(tǒng)前端選用流行的Bootstrap框架，Bootstrap是目前很受歡迎的HTML、CSS和JS框架，用于開發(fā)響應式布局、移動設備優(yōu)先的Web項目，它簡潔靈活，使得Web開發(fā)更加快捷，Bootstrap基于HTML5、CSS3、jQuery開發(fā)，Bootstrap內(nèi)置的CSS媒體查詢（Media Query）功能，可以開發(fā)出響應式布局的網(wǎng)頁，自動適應不同分辨率效果；同時提供了豐富的Web組件，包括下拉菜單、按鈕組、按鈕下拉菜單、導航、導航條、路徑導航、分頁、排版、縮略圖、警告對話框、進度條、媒體對象等。使用這些組件，可以快速地搭建一個漂亮、功能完備的網(wǎng)站前端[5-6]。

本系統(tǒng)后端選用經(jīng)典的SSH集成框架開發(fā)，SSH集成框架是Hibernate、Spring、Struts三大框架的組合，基于SSH框架的系統(tǒng)從職責上分為四層：表示層、業(yè)務邏輯層、數(shù)據(jù)持久層和域模塊層，可以幫助開發(fā)人員在短期內(nèi)搭建結(jié)構(gòu)清晰、可復用性好、維護方便的Web應用程序。其中使用Struts作為系統(tǒng)的整體基礎架構(gòu)，負責MVC的分離，在Struts框架的模型部分，控制業(yè)務跳轉(zhuǎn)，利用Hibernate框架對持久層提供支持，Spring做管理，管理Struts和Hibernate。具體做法是：首先用面向?qū)ο蟮姆治龇椒ǎ鶕?jù)需求提出一些模型，將這些模型實現(xiàn)為基本的Java對象；然后編寫基本的DAO（Data Access Objects）接口，并給出Hibernate的DAO實現(xiàn)，采用Hibernate架構(gòu)實現(xiàn)的DAO類來實現(xiàn)Java類與數(shù)據(jù)庫之間的轉(zhuǎn)換和訪問；其次使用Struts連接業(yè)務邏輯和視圖展現(xiàn)，接收、處理、發(fā)送數(shù)據(jù)并控制流程；最后由Spring做整合，管理Struts和Hibernate，提供IOC容器使代碼松耦合以及AOP框架的切面功能[2-4]。

5 關(guān)鍵功能與實現(xiàn)

本系統(tǒng)的關(guān)鍵功能包括發(fā)布博客日志、新聞爬蟲等模塊，用戶登錄成功后可以發(fā)表博客、啟動新聞爬蟲可以抓取互聯(lián)網(wǎng)上的新聞鏈接和內(nèi)容，下面分析關(guān)鍵功能的實現(xiàn)。

5.1 發(fā)布博客日志

一篇博客日志可以由文字、圖片、視頻、音頻等元素組成，發(fā)布博客日志功能包括添加日志標題、添加發(fā)布時間、添加日志內(nèi)容等。其中添加日志內(nèi)容最復雜，需要實現(xiàn)添加各種元素和布局排版元素，添加日志內(nèi)容通常使用富文本編輯器實現(xiàn)。本系統(tǒng)使用UEditor編輯器，UEditor是百度公司開發(fā)的所見即所得富文本web編輯器，具有輕量級、可定制、注重用戶體驗等特點，開源基于MIT協(xié)議，提供了基本文檔格式化、網(wǎng)絡圖片、視頻、地圖、表情等豐富的功能，適合于編輯復雜的圖文內(nèi)容。在JSP頁面嵌入UEditor的關(guān)鍵代碼如下：

<！-- 加載編輯器的容器 -->

<！-- 配置文件 -->

<！-- 編輯器源碼文件 -->

<！-- 實例化編輯器 -->

發(fā)布博客日志功能效果如圖4所示。

5.2 獲取網(wǎng)絡新聞

通過新聞爬蟲程序獲取網(wǎng)絡新聞，新聞爬蟲是一種按照一定的規(guī)則，自動地抓取互聯(lián)網(wǎng)新聞的程序。新聞爬蟲程序通常包括控制器、解析器、資源庫三部分?？刂破髦饕撠熃o多線程中的各個爬蟲線程分配工作任務；解析器主要負責下載網(wǎng)頁，進行頁面的處理，主要是將規(guī)則外的JS腳本標簽、CSS代碼內(nèi)容、HTML標簽、空格字符等內(nèi)容處理掉，解析器是爬蟲程序的主要部分；資源庫用于存儲下載到的網(wǎng)頁資源[7]。本系統(tǒng)使用HttpClient實現(xiàn)了一個輕量級新聞爬蟲，主要包括四個類。①CrawlBase類：模擬http請求的基類；②CrawlListPageBase類：CrawlBase的子類，實現(xiàn)了從頁面中獲取鏈接的URL信息基類；③DoRegex類：封裝的一些基于正則表達式字符串匹配查找類；④CharsetUtil類：編碼方式檢測類。部分關(guān)鍵代碼如下：

public void crawl（）throws Throwable {

while（continueCrawling（）） {

CrawlerUrl url=getNextUrl（）；

//獲取待爬取隊列中的下一個URL

if（url！=null） {

printCrawlInfo（）；

String content=getContent（url）； //獲取URL的文本信息

//聚焦爬蟲，只爬取與主題內(nèi)容相關(guān)的網(wǎng)頁，這里采用正則匹配簡單處理

if（isContentRelevant（content，this.regexpSearchPattern）） {

saveContent（url，content）； //保存網(wǎng)頁至本地

//獲取網(wǎng)頁內(nèi)容中的鏈接，并放入待爬取隊列中

Collection urlStrings=extractUrls（content，url）；

addUrlsToUrlQueue（url，urlStrings）；

} else {

程序System.out.println（url+"舍棄"）；

}

//延時防止被對方屏蔽

Thread.sleep（this.delayBetweenUrls）；

}

}

closeOutputStream（）；

}

6 結(jié)束語

博客是互聯(lián)網(wǎng)發(fā)表信息的重要工具，本文以發(fā)表博客、新聞獲取的需求為出發(fā)點，設計并實現(xiàn)了通用的個人博客管理系統(tǒng)，技術(shù)方案選用SSH框架開發(fā)后端，具有穩(wěn)定、高效、可擴展性強得優(yōu)點；使用Bootstrap框架開發(fā)前端，頁面簡潔大方，兼容性強，能自動響應匹配不同終端設備的分辨率。本文實現(xiàn)的個人博客管理系統(tǒng)能方便的發(fā)布到互聯(lián)網(wǎng)，供不同用戶注冊使用，且基于成熟框架，系統(tǒng)運行穩(wěn)定，相信對于讀者進行軟件開發(fā)有一定的參考意義，但系統(tǒng)的安全性本文沒有涉及，這些還需要進一步研究。

參考文獻（References）：

[1] 谷巖.博客系統(tǒng)的設計與實現(xiàn)初探[J].電腦知識與技術(shù)，2013.35.

[2] 李雷孝，劉志強，杜慧敏，冀強.Struts和Hibernate整合框架研究與應用[J].內(nèi)蒙古工業(yè)大學學報（自然科學版），2010.3.

[3] 屠曉云.基于SSH的學生學習交流平臺的設計與實現(xiàn)[J].電腦知識與技術(shù)，2012.25.

[4] 周利江.基于SSH框架的J2EE應用研究[J].電腦編程技巧與維護，2012.12.

[5] 李金亮，李春青.基于BootStrap的Web開發(fā)設計研究[J].中小企業(yè)管理與科技（中旬刊），2014.5.

[6] 張子杰，莊育飛.基于Bootstrap和SSH的求職招聘系統(tǒng)設計與實現(xiàn)[J].軟件導刊，2016.10.

[7] 孫立偉，何國輝，吳禮發(fā).網(wǎng)絡爬蟲技術(shù)的研究[J].電腦知識與技術(shù)，2010.15.