快捷導(dǎo)航

Javaweb實現(xiàn)完整個人博客系統(tǒng)流程

更新時間：2022年03月30日 12:29:08 作者：dhdhdhdhg

這篇文章主要介紹了怎樣用Java來實現(xiàn)一個完整的個人博客系統(tǒng)，我們通過實操上手的方式可以高效的鞏固所學(xué)的基礎(chǔ)知識，感興趣的朋友一起來看看吧

一、項目背景

在學(xué)習(xí)完JavaWeb相關(guān)知識后，有了基礎(chǔ)能力就想通過完成一個Javaweb項目來回顧和加強(qiáng)已經(jīng)學(xué)過的知識，并且希望在這個過程中發(fā)現(xiàn)自己的不足并加以改正。
由于之前一直都在CSDN上分享自己的學(xué)習(xí)過程，對CSDN博客系統(tǒng)的功能有了一定的了解，因此便嘗試完成了個人博客系統(tǒng)。

二、項目功能

1.用戶登錄：

在這里插入圖片描述

2.用戶主頁：

在這里插入圖片描述

3.查看全文：

在這里插入圖片描述

4.寫文章：

在這里插入圖片描述

5.注銷回到登錄頁面：

在這里插入圖片描述

三、項目的基本流程

1.準(zhǔn)備工作

pom.xml中引入的依賴包

<dependencies>
    <dependency>
        <groupId>org.thymeleaf</groupId>
        <artifactId>thymeleaf</artifactId>
        <version>3.0.12.RELEASE</version>
    </dependency>

    <!-- Servlet依賴包：官方提供的servlet標(biāo)準(zhǔn) -->
    <dependency>
        <groupId>javax.servlet</groupId>
        <artifactId>javax.servlet-api</artifactId>
        <version>3.1.0</version>
        <!-- 開發(fā)編譯時需要這個依賴包，運行時不需要 -->
        <scope>provided</scope>
    </dependency>

    <dependency>
        <groupId>mysql</groupId>
        <artifactId>mysql-connector-java</artifactId>
        <version>5.1.49</version>
    </dependency>
    
	<!-- 數(shù)據(jù)綁定包，提供JAva對象與JSON數(shù)據(jù)格式進(jìn)行序列化 -->
    <dependency>
        <groupId>com.fasterxml.jackson.core</groupId>
        <artifactId>jackson-databind</artifactId>
        <version>2.12.3</version>
    </dependency>
    
    <!--    引入單元測試框架，方便我們做測試    -->
    <dependency>
        <groupId>junit</groupId>
        <artifactId>junit</artifactId>
        <version>4.13.1</version>
    </dependency>
</dependencies>

引入Jackson依賴是為了進(jìn)行序列化、反序列化的操作
作用：使數(shù)據(jù)和對象之間可以相互轉(zhuǎn)換，保證數(shù)據(jù)的完整性

Jackson是一個Java用來處理JSON格式數(shù)據(jù)的類庫，性能非常好，經(jīng)常被用來JSON序列化（將對象轉(zhuǎn)換為JSON字符串）和反序列化（將JSON字符串轉(zhuǎn)換為指定的數(shù)據(jù)類型）

序列化和反序列化操作:

public class WebUtil {

    //判斷是否登錄，通過請求對象獲取session，如果session存在且登錄時
    // 保存的鍵為user，值是用戶對象，這個數(shù)據(jù)存在，就表示已登錄
    //返回user：已登錄就返回session中保存的用戶，未登錄返回null
    public static User checkLogin(HttpServletRequest req){
        User user = null;
        //如果從tomcat保存的session的map數(shù)據(jù)結(jié)構(gòu)中，獲取session，false表示獲取不到，返回null
        HttpSession session = req.getSession(false);
        if(session!=null){
            user = (User)session.getAttribute("user");
        }
        return user;
    }

    //這個對象可以使用單例
    private static ObjectMapper M = new ObjectMapper();

    //反序列化：轉(zhuǎn)換一個輸入流中包含的json字符串為一個java對象
    //使用泛型：傳一個什么類型給我，就返回一個該類型的對象
    public static <T> T read(InputStream is,Class<T> clazz){
        try {
            return M.readValue(is,clazz);
        } catch (IOException e) {
            throw new RuntimeException("json反序列化出錯",e);
        }
    }

    //序列化：將一個任意類型的java對象，轉(zhuǎn)換為一個json字符串
    public static String write(Object o){
        try {
            return M.writeValueAsString(o);
        } catch (JsonProcessingException e) {
            throw new RuntimeException("json序列化出錯",e);
        }
    }

2.數(shù)據(jù)庫設(shè)計

1.創(chuàng)建所需表：

user（用戶表）
acticle（文章表）

2.設(shè)計與之對應(yīng)的數(shù)據(jù)庫實體類：

在這里插入圖片描述

3.數(shù)據(jù)庫連接工具：

//數(shù)據(jù)庫工具類：提供獲取數(shù)據(jù)庫連接，釋放資源的統(tǒng)一代碼
public class DBUtil {
    //靜態(tài)變量，是類加載的時候初始化，只執(zhí)行一次
    private static MysqlDataSource ds;
    //一個程序，連接一個數(shù)據(jù)庫，只需要一個連接池，其中保存了多個數(shù)據(jù)庫連接對象
    //1.獲取連接池，內(nèi)部使用，不開放
    private static DataSource getDataSource(){
        //ds類加載的時候，初始化為null，方法使用的時候，每次都判斷一下
        if(ds==null){//判斷為空，就創(chuàng)建及初始化屬性
            ds=new MysqlDataSource();
            ds.setURL("jdbc:mysql://127.0.0.1:3306/blog");
            ds.setUser("root");
            ds.setPassword("010124");
            ds.setUseSSL(false);//不安全連接，如果不設(shè)置，也不影響，只是有警告
            ds.setCharacterEncoding("UTF-8");
        }
        return ds;
    }

    //2.獲取數(shù)據(jù)庫連接對象：開放給外部的jdbc代碼使用
    public static Connection getConnection(){
        try {
            return getDataSource().getConnection();
        } catch (SQLException e) {
            throw new RuntimeException("獲取數(shù)據(jù)庫連接出錯，可能是url，賬號密碼寫錯了",e);
        }
    }
    
    //3.釋放資源
    //查詢操作需要釋放三個資源，更新操作（插入，修改，刪除）只需要釋放前兩個資源
    public static void close(Connection c, Statement s, ResultSet r){
        try {
            if(r!=null) r.close();
            if(s!=null) s.close();
            if(c!=null) c.close();
        } catch (SQLException e) {
            throw new RuntimeException("釋放數(shù)據(jù)庫資源出錯",e);
        }
    }

    //提供更新操作方便的釋放資源功能
    public static void close(Connection c, Statement s){
        close(c,s,null);
    }

    public static void main(String[] args) {
        System.out.println(getConnection());
    }
}

4.用戶表和文章表的CRUD操作（Dao類）：

在這里插入圖片描述

3.準(zhǔn)備前端頁面

1.把之前寫好的前端靜態(tài)頁面部署到webapp目錄下

2.封裝ajax：

在前后端交互中我們需要用到ajax進(jìn)行數(shù)據(jù)交互
把之前封裝好的ajax函數(shù)拷貝過來，放到一個單獨的js文件中，方便后續(xù)使用

function ajax(args){//var ajax = function(){}
    let xhr = new XMLHttpRequest();
    // 設(shè)置回調(diào)函數(shù)
    xhr.onreadystatechange = function(){
        // 4: 客戶端接收到響應(yīng)后回調(diào)
        if(xhr.readyState == 4){
            // 回調(diào)函數(shù)可能需要使用響應(yīng)的內(nèi)容，作為傳入?yún)?shù)
            args.callback(xhr.status, xhr.responseText);
        }
    }
    xhr.open(args.method, args.url);
    //如果args中，contentType屬性有內(nèi)容，就設(shè)置Content-Type請求頭
    if(args.contentType){//js中，if判斷，除了判斷boolean值，還可以判斷字符串，對象等，有值就為true
        xhr.setRequestHeader("Content-Type", args.contentType);
    }
    //如果args中，設(shè)置了body請求正文，調(diào)用send(body)
    if(args.body){
        xhr.send(args.body);
    }else{//如果沒有設(shè)置，調(diào)用send()
        xhr.send();
    }
}

3.設(shè)計一個類：用于返回給前端ajax回調(diào)

//設(shè)計一個類，用于返回給前端ajax回調(diào)
public class JsonResult {
    private boolean ok;//表示執(zhí)行一個操作是否成功
    private Object data;//操作成功，且是一個查詢操作，需要返回一些數(shù)據(jù)給前端

	//同樣省略getter、setter和toString
}