摘    要：　　介紹了個人博客網站設計的相關技術，以及其設計與實現過程，該過程以MVC設計模型和主流的Spring Data JPA、Spring MVC、Spring Boot等框架技術為主進行系統架構的開發，將整個系統劃分為表現層、業務層、持久層3層架構，充分利用各個框架的優勢來完成系統的開發；使用Spring Data JPA來完成持久層的工作，它封裝了對數據庫的繁瑣操作，使得用戶可以方便的操作數據庫中的數據；Spring MVC框架通過調用業務層來負責處理用戶的請求以及響應用戶的操作；最后使用Spring Boot對系統進行解耦合并簡化用戶整體的開發步驟。

　　關鍵詞 :     網絡交流;個人博客; MVC設計模型;

　　如果把個人博客網站比作是一個舞臺，那么其中的表演者就是所有的博客。通過博客用戶可以把自己有價值的、積極的一面展示在網絡世界中，相互交流學習。隨著互聯網技術的高速發展以及生活節奏的加快，博客被越來越多的人選擇作為學習和交流的主要工具。國內目前也已經存在了許多優秀的博客平臺，比如新浪博客、網易博客、博客園等。但是有的用戶不希望受這些博客平臺的限制，希望能夠擁有自己的個人博客網站，對自己的博客擁有最大限度的管理權限。因此，個人博客系統也是目前許多用戶的不二之選。

　　1 、個人博客網站設計的相關技術介紹

　　主要開發工具簡介：

　　1.1 、MVC架構

　　MVC的全稱是Model、View、Controller, 是模型-視圖-控制器的縮寫，它是一種主流的軟件開發的模型。它可以把用戶編寫的程序分為Controller、Model、View 3個部分，各個部分各司其職，互不干擾。Controller負責接收前端頁面用戶發送過來的請求，然后調用Model生成用戶所需要的業務數據，最后將數據傳遞給View, 最終將View響應給用戶。

　　1.2 、Spring MVC簡介

　　Spring MVC是一款基于Java語言編寫并實現了MVC設計模型的輕量級Web表現層框架，隸屬于Spring公司旗下的一個框架，是目前最主流的Web框架，在開發的時候也可以和Spring框架非常方便地整合在一起使用。它其實就是MVC設計模型的一種具體的實現方式，它幫助開發者屏蔽了很多Web開發的底層代碼，開放出了一些接口，讓開發者可以非常輕松、便捷的完成基于MVC模型的Web項目的開發。從而幫助開發者簡化開發，提高開發效率。

　　1.3 、Java Bean簡介

　　Java Bean是在開發中所需要的實體類。它的特點：首先“類”需要是公共的、每一個字段都要是私有的、必須要有一個空參構造方法、對外提供公共的Getter和Setter方法。使用Java Bean可以非常方便地幫助用戶封裝一些實體類型，提高用戶的開發效率。
 

　　1.4、 Spring Boot簡介

　　Spring Boot是Spring公司推出的一款全新框架，它的目的是用來簡化用戶的開發過程。它內部采用一種約定大于配置的理念，替用戶開啟了各種依賴的自動裝配，從而簡化用戶代碼的開發，讓用戶不用寫太多的配置文件，甚至可以不寫配置文件，只需要引入相對應的場景啟動器便可以快速搭建一個項目，開箱即用。

　　1.5 、MySQL簡介

　　MySQL是軟件開發中常用的一款主流的關系型數據庫系統，主要是用來在各種軟件項目的開發中存儲大規模數據以及對數據進行各種增刪改查操作。

　　2 、個人博客系統的設計與實現

　　本系統分為前臺展示模塊和后臺管理模塊兩個大模塊。前臺展示模塊主要包括首頁博客展示、博客分類、博客標簽、博客歸檔、博客評論、作者介紹。后臺管理模塊主要包括管理員的登錄與退出、博客管理(博客的發布，修改，刪除，查詢)、博客分類管理、博客標簽管理、博客評論管理。系統總體結構如圖1所示。

　　圖1 系統總體結構

　　本系統將使用Java語言為載體，SpringBoot+Spring Data Jpa等框架作為后臺實現技術，HTML+Java Script+Thymeleaf模板引擎等技術進行前臺展示功能的實現，在數據的存儲方面使用了MySQL數據庫來進行存儲數據，項目的構建和管理使用了Maven。整個系統采用MVC設計模型進行開發。在系統結構上，本系統采用的是主流的B/S架構，即瀏覽器(Browser)/服務器(Server)結構，B/S架構如圖2所示。

　　圖2 B/S架構

　　2.1 、系統分層

　　本系統主要拆分為3層架構，從上到下依次為表現層，業務層，持久層，用戶的請求首先到達表現層進行處理，表現層再調用業務層進行具體的業務處理，業務層繼續調用持久層去數據庫操作數據，最后通過表現層將視圖返回用戶。如圖3所示。

　　圖3 系統分層

　　2.2 、系統功能模塊實現

　　本系統采用了主流的前后端完全分離的項目開發方式，前端部分主要分為頁面的填充，數據的展示和用戶的基本操作。后端部分主要負責接收用戶從前端發來的請求并進行對應的處理操作，把對應的數據等信息以Json的格式響應給前端獲取，然后進行頁面的渲染并顯示。

　　圖4 項目結構

　　本系統中的用戶信息管理模塊、博客信息管理模塊、留言評論管理模塊、根據關鍵字模糊查詢博客等模塊的具體實現代碼都在Java目錄下，所有的頁面代碼都在Template目錄下，如圖4所示。每個功能模塊的實現都離不開前后端的相互配合。在前后端分離的開發方式下，前端與后端相互獨立，完全解耦合，主要以提供Api接口的形式進行Json類型的數據交互。

　　2.2.1、 用戶管理。

　�、俟芾韱T登錄。系統管理員登錄模塊主要是需要管理員在前臺登錄頁面輸入賬號密碼，通過點擊表單登錄按鈕將數據傳輸到后臺，然后后臺與數據庫中的數據進行比對驗證，數據一致則登錄成功轉發到管理頁面，否則登錄失敗，重定向到登錄頁面并返回一個用戶名或密碼錯誤的友好提示。②管理員退出。管理員退出系統主要是管理員首頁面點擊注銷按鈕觸發一個請求到后臺的注銷登錄模塊，然后后臺清空用戶的登錄數據，最后重定向到登錄頁面。

　　2.2.2、 博客管理。

　�、俨┛褪醉�。博客首頁是訪客進入系統后看到的第一個頁面，網站的首頁大致可以分為上中下3個部分。頭部分別是首頁、分類、標簽、歸檔、作者簡介、根據關鍵字全局搜索博客這6個部分。②個人博客首頁。個人博客首頁是用于顯示管理員發布的所有博客的頁面，當管理員登錄后便可看到所顯示的信息，未登錄無法進入該頁面。該頁面分為上中下3部分，上邊主要包括博客，分類，標簽，管理員登錄信息及注銷登錄這4個模塊。中間部分主要包括已發布的所有博客標題、類型、發布時間、修改博客、刪除博客、新增博客等模塊。下邊是一個公共的部分，主要包括系統管理員的一些個人簡介以及聯系方式等信息。在這個頁面系統管理員可以根據博客標題，博客分類等信息查詢自己發布過的博客，可以在這里發布新的博客內容，也可以對自己以及發布的博客進行一些修改和刪除等操作。

　　2.2.3、 留言管理。

　　留言評論管理主要是針對訪客對博客內容的留言進行對應的管理，訪客在瀏覽了任意一篇博客以后，都可以在博客的最下方留言區域對博客進行一個評論，發表自己的看法等信息，在發表留言的同時也要輸入自己的姓名和郵箱等信息。系統管理員可以在后臺看到訪客發表的評論，管理員可以對其進行回復也可以刪除留言，這個功能的實現可以使訪客和博主之間進行交流學習，從而提高用戶的體驗。

　　2.2.4 、查詢管理。

　�、僭L客查詢。訪客進入系統之后便會來到博客首頁中，在首頁的右上角設立了一個搜索欄，訪客可以根據博客的標題、內容、標簽、分類、發布時間等信息關鍵詞進行檢索自己想要查看的博客，查詢功能的實現主要是采用了數據庫模糊查詢的方式，根據訪客提交的關鍵詞去數據庫中檢索信息，把符合條件的博客顯示出來供訪客瀏覽，從而提升訪客的體驗效果。②管理員查詢。當系統管理員登錄之后，便會來到管理員頁面。在這個頁面會顯示管理員以及發布過的所有博客信息，比如博客的標題、類型、狀態、發布時間等等一些信息。管理員在這個頁面中可以根據博客的標題，發哪類，是否被推薦等信息模糊批查詢以及發布過的所有博客。

　　2.3、 博客編輯

　　在博客的編輯頁面，本系統采用的是主流的MarkDown語法格式。

　　博客的編輯工具欄提供了一些常用的Markdown語法操作�？梢酝ㄟ^點擊該工具欄對應的按鈕對博客內容的樣式進行快速排版，通過使用快捷工具欄可以免去手動輸入常用的Markdown語法的繁瑣步驟，同時也可以幫助不熟悉Markdown語法的用戶也能快速的使用Markdown語法對自己的博客進行快速排版。

　　3 、結束語

　　隨著以后研究的不斷深入，本系統還有一些功能模塊需要進一步優化和補充，使得本系統的功能更加的全面和強大，視覺體驗和用戶交互也更加的美觀和人性，讓用戶使用起來更加方便。

　　參考文獻

　　[1]金楓Web前端MVC框架的意義與前端發展方向展望[J] .電腦知識與技術, 2018(3).
　　[2]吳以欣,陳小寧.JavaScript腳本程序設計+[M]北京:人民郵電出版社，2017.
　　[3]王春梅基于MVC個人博客系統設計與開發[J].信息通信, 2019(7).
　　[4]劉彬JSP數據庫高級教程[M].北京:清華大學出版社, 2017:151-145.
　　[5]朱丹霞中國博客的發展與商業價值研究[M].北京:電子工業出版社, 2018: 125-172.
　　[6] Patrick Chan.The Java Developers Almanac 1 .4[M] New York: AddisonWesley,2016.
　　[7] Rick Cattell Scalable SQL and NoSQL data stores[J].ACM SIGMOD Record,2019(4).