当前位置：首页 > news >正文

【搭建】个人博客网站的搭建

news 2025/11/1 11:00:29

大概花了四天的时间完成了博客网站的搭建，以下是对博客网站搭建的过程记录

一、前言

环境：
JDK1.88u292
mysql5.7 （端口3307）
相关的jar包：

2025/10/29  17:09            78,492 jackson-annotations-2.17.2.jar
2025/10/29  17:09           581,927 jackson-core-2.17.2.jar
2025/10/29  17:09         1,649,454 jackson-databind-2.17.2.jar
2025/10/29  17:09            95,505 javax.servlet-api-4.0.1.jar
2025/10/29  17:09           231,811 logback-classic-1.2.12.jar
2025/10/29  17:09           448,860 logback-core-1.2.12.jar
2025/10/29  17:09         1,808,512 mybatis-3.5.15.jar
2025/10/29  17:09         1,006,904 mysql-connector-java-5.1.49.jar
2025/10/29  17:09            41,125 slf4j-api-1.7.36.jar

二、过程

先有一个思路，如果我想制作一个评论系统的话，该如何制作，首先脑海里构建一个清晰的思路，接着尝试用JavaScript模拟后端数据处理还有htmll、css实现页面布局，最终上传到gittee，这就是一个过程，详细可以看：
master分支

接着开始后端构建，配置过滤器（可以理解为前端的中间件）：

package com.example.api.config;import javax.servlet.*;
import javax.servlet.annotation.WebFilter;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;/*** 全局 UTF-8 编码过滤器* 作用于所有 /* 请求，保证请求体、响应体均为 UTF-8* 过滤器的顺序按照字母大小进行排序也可以在web.xml进行指定顺序*/
@WebFilter(filterName = "utf8Filter", urlPatterns = "/*")
public class Utf8Filter implements Filter {@Overridepublic void init(FilterConfig filterConfig) {// 无初始化资源}@Overridepublic void doFilter(ServletRequest request,ServletResponse response,FilterChain chain)throws IOException, ServletException {HttpServletRequest req = (HttpServletRequest) request;HttpServletResponse resp = (HttpServletResponse) response;//三件套设置，servlet请求返回的接口数据必须为json格式// 关键：必须在第一次读取请求参数或 getInputStream 之前req.setCharacterEncoding("UTF-8");// 关键：必须在第一次调用 getWriter 之前resp.setCharacterEncoding("UTF-8");chain.doFilter(req, resp);}@Overridepublic void destroy() {// 无资源释放}
}

创建数据库blog，分别创建表格，注意这里的数据库和数据表编码格式是utf8_general_ci,
创建表格article：

CREATE TABLE IF NOT EXISTS `article` (`id` int(11) NOT NULL AUTO_INCREMENT,`title` varchar(30) NOT NULL,`content` text NOT NULL,`viewCount` int(11) NOT NULL,`userId` int(11) NOT NULL,`categoryId` int(11) NOT NULL,`create_time` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP,PRIMARY KEY (`id`)
) ENGINE=MyISAM  DEFAULT CHARSET=utf8 AUTO_INCREMENT=16 ;

创建表格article_tag：

CREATE TABLE IF NOT EXISTS `article_tag` (`id` int(11) NOT NULL AUTO_INCREMENT,`articleId` int(11) NOT NULL,`tagId` int(11) NOT NULL,`create_time` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP,PRIMARY KEY (`id`)
) ENGINE=MyISAM  DEFAULT CHARSET=utf8 AUTO_INCREMENT=58 ;

创建表格category

CREATE TABLE IF NOT EXISTS `category` (`id` int(11) NOT NULL AUTO_INCREMENT,`name` varchar(30) NOT NULL,`description` varchar(30) NOT NULL,`userId` int(11) NOT NULL,`create_time` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP,PRIMARY KEY (`id`)
) ENGINE=MyISAM  DEFAULT CHARSET=utf8 AUTO_INCREMENT=5 ;

创建表格comment


CREATE TABLE IF NOT EXISTS `comment` (`id` int(11) NOT NULL AUTO_INCREMENT,`content` text CHARACTER SET utf8 COLLATE utf8_unicode_ci NOT NULL,`articleId` int(11) NOT NULL,`userId` int(11) NOT NULL,`replyId` int(11) NOT NULL,`rootId` int(11) NOT NULL,`create_time` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP,PRIMARY KEY (`id`)
) ENGINE=MyISAM  DEFAULT CHARSET=utf8 AUTO_INCREMENT=192 ;

创建表格user:


CREATE TABLE IF NOT EXISTS `tag` (`id` int(11) NOT NULL AUTO_INCREMENT,`color` varchar(30) NOT NULL,`name` varchar(30) NOT NULL,`description` varchar(30) NOT NULL,`userId` int(11) NOT NULL,`create_time` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP,PRIMARY KEY (`id`)
) ENGINE=MyISAM  DEFAULT CHARSET=utf8 AUTO_INCREMENT=6 ;

于是，根据创建的数据表写对应的接口：
分支commont_version1.0

三、改进

现在博客系统已经完成的差不多了，新增一个多用户的功能。然后用户可可以在用户界面发表和管理自己的博客文章。详细的代码实现：

private SqlSession sqlSession = MyBatisUtil.getSession();private UserMapper mapper = sqlSession.getMapper(UserMapper.class);// 路径认证配置：路径 -> 允许的方法列表private static final Map<String, Set<String>> PATH_AUTH_CONFIG = new HashMap<>();private static final Map<String, Set<String>> PATH_PERMISSION_CONFIG = new HashMap<>();private static final Map<String, Set<String>> PATH_VIP_CONFIG = new HashMap<>();//验证tokenprivate final TokenVerify tokenVerify = new TokenVerify();static {// 完全公开的路径（所有方法都不需要认证）PATH_AUTH_CONFIG.put("/login", Collections.singleton("ALL"));PATH_AUTH_CONFIG.put("/register", Collections.singleton("ALL"));PATH_AUTH_CONFIG.put("/front/article", Collections.singleton("ALL"));PATH_AUTH_CONFIG.put("/front/user", Collections.singleton("ALL"));PATH_AUTH_CONFIG.put("/front/category", Collections.singleton("ALL"));PATH_AUTH_CONFIG.put("/front/tag", Collections.singleton("ALL"));PATH_AUTH_CONFIG.put("/verifyUser", Collections.singleton("ALL"));PATH_AUTH_CONFIG.put("/upload", Collections.singleton("ALL"));// 方法级控制的路径 运行get请求，但是不允许其他的post、put、delete请求,比如没有post，需要token进行登录PATH_AUTH_CONFIG.put("/front/comment", new HashSet<>(Arrays.asList("GET", "OPTIONS")));// 静态资源PATH_AUTH_CONFIG.put("/css/", Collections.singleton("ALL"));PATH_AUTH_CONFIG.put("/index.html", Collections.singleton("ALL"));PATH_AUTH_CONFIG.put("/js/", Collections.singleton("ALL"));PATH_AUTH_CONFIG.put("/images/", Collections.singleton("ALL"));PATH_AUTH_CONFIG.put("/favicon.ico", Collections.singleton("ALL"));}//下面这两个是完全相反的static {PATH_PERMISSION_CONFIG.put("/manage/comment", Collections.singleton("ALL"));PATH_PERMISSION_CONFIG.put("/manage/article", Collections.singleton("ALL"));PATH_PERMISSION_CONFIG.put("/manage/user", Collections.singleton("ALL"));PATH_PERMISSION_CONFIG.put("/manage/tag", Collections.singleton("ALL"));PATH_PERMISSION_CONFIG.put("/manage/category", Collections.singleton("ALL"));// 方法级控制的路径 不可以运行get请求，但是其他post、put、delete请求可以运行PATH_PERMISSION_CONFIG.put("/manage/test", new HashSet<>(Arrays.asList("GET", "OPTIONS")));}static{PATH_VIP_CONFIG.put("/vip/list", Collections.singleton("ALL"));// 方法级控制的路径 不可以运行get请求，但是其他post、put、delete请求可以运行PATH_VIP_CONFIG.put("/vip/test", new HashSet<>(Arrays.asList("GET", "OPTIONS")));}