# blog-server **Repository Path**: ma_hua_bin/blog-server ## Basic Information - **Project Name**: blog-server - **Description**: No description available - **Primary Language**: Unknown - **License**: Not specified - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 0 - **Forks**: 0 - **Created**: 2025-10-21 - **Last Updated**: 2025-10-29 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README # 博客系统技术框架 基于 `Java (Spring Boot + MyBatis-Plus) + Vue3` 构建的动态博客系统,包含前台用户浏览与后台管理功能,支持文章发布、用户管理、评论互动等核心功能。 ## 项目概述 ### 核心功能 * **前台**:文章浏览、详情查看、分类标签筛选、评论互动、用户登录 / 注册 * **后台**:文章管理(发布 / 编辑 / 删除)、用户管理、分类标签管理、评论审核 ## 技术栈选型 ### 后端技术栈 | 模块 | 技术 / 框架 | 版本 | 说明 | | ------ | ------------------- | ------ | ------------------------------ | | 基础框架 | Spring Boot | 3.2.x | 快速开发 Spring 应用 | | ORM 框架 | MyBatis-Plus | 3.5.5 | 简化数据库 CRUD,支持分页、Lambda 查询 | | 数据库 | MySQL | 8.0.x | 存储用户、文章、评论等结构化数据 | | 安全框架 | Spring Security | 6.2.x | 处理登录认证、权限控制(前台 / 后台) | | API 文档 | Knife4j(Swagger) | 4.3.x | 自动生成接口文档,方便前后端对接 | | 工具类 | Lombok | 1.18.x | 简化实体类代码(省略 get/set) | | 数据校验 | Hibernate Validator | 8.0.x | 请求参数校验(非空、长度限制等) | | JDK 版本 | JDK | 17+ | Spring Boot 3.x 最低要求,推荐 LTS 版本 | ### 前端技术栈(前台 + 后台通用) | 模块 | 技术 / 框架 | 版本 | 说明 | | ----------- | ------------ | ------------- | ---------------------------- | | 基础框架 | Vue3 + Vite | 3.3.x + 4.4.x | 前端开发与构建工具,支持 Composition API | | 路由管理 | Vue Router | 4.2.x | 页面路由跳转(前台 / 后台路由隔离) | | 状态管理 | Pinia | 2.1.x | 管理全局状态(用户登录信息等) | | UI 组件库 | Element Plus | 2.4.x | 前台展示与后台管理的 UI 组件 | | HTTP 请求 | Axios | 1.6.x | 调用后端 API 接口 | | Markdown 编辑 | mavon-editor | 2.10.x | 文章编辑与展示(支持代码高亮) | ## 系统架构设计 ### 整体架构 ``` 用户层 → 前端层(前台Vue3 + 后台Vue3) → API网关(Nginx) → 后端服务(Spring Boot) → 数据层(MySQL) ``` ### 核心模块划分 | 模块 | 前台功能 | 后台功能 | | ---- | -------------- | ------------------- | | 用户模块 | 登录 / 注册、个人信息展示 | 用户列表、禁用 / 启用、角色分配 | | 文章模块 | 列表浏览、详情查看、搜索 | 发布 / 编辑 / 删除文章、草稿管理 | | 分类标签 | 分类筛选、标签聚合 | 分类 / 标签的增删改查 | | 评论模块 | 发表评论、查看评论 | 评论列表、审核 / 删除评论 | | 系统管理 | - | 网站配置、数据统计、日志查看 | ## 后端框架搭建 ### 项目目录结构 ``` blog-server/ ├── src/ │ ├── main/ │ │ ├── java/com/example/blog/ │ │ │ ├── BlogApplication.java # 启动类 │ │ │ ├── config/ # 配置类 │ │ │ │ ├── MyBatisPlusConfig.java # 分页插件等配置 │ │ │ │ ├── SecurityConfig.java # 认证/权限配置 │ │ │ │ └── Knife4jConfig.java # API文档配置 │ │ │ ├── controller/ # 控制器(按模块划分) │ │ │ │ ├── front/ # 前台接口(/api/front/\*) │ │ │ │ └── admin/ # 后台接口(/api/admin/\*) │ │ │ ├── entity/ # 实体类(与数据库表对应) │ │ │ ├── mapper/ # MyBatis-Plus Mapper接口 │ │ │ ├── service/ # 服务层(含impl实现) │ │ │ ├── security/ # 安全相关(认证、JWT等) │ │ │ ├── dto/ # 数据传输对象(请求/响应) │ │ │ ├── vo/ # 响应视图对象(前端展示用) │ │ │ └── common/ # 通用类(统一响应、常量等) │ │ └── resources/ │ │ ├── application.yml # 主配置文件 │ │ ├── application-dev.yml # 开发环境配置 │ │ └── mapper/ # MyBatis XML映射文件 │ └── test/ # 单元测试 └── pom.xml # Maven依赖 ``` ### 核心配置示例 #### 1. 主配置文件(`application.yml`) ```yaml spring: profiles: active: dev # 激活开发环境 datasource: driver-class-name: com.mysql.cj.jdbc.Driver jackson: date-format: yyyy-MM-dd HH:mm:ss time-zone: GMT+8 # MyBatis-Plus配置 mybatis-plus: mapper-locations: classpath:mapper/\*.xml type-aliases-package: com.example.blog.entity configuration: map-underscore-to-camel-case: true # 下划线转驼峰 global-config: db-config: id-type: auto # 主键自增 # 服务器配置 server: port: 8080 servlet: context-path: /api # API统一前缀 ``` #### 2. 统一响应类(`Result.java`) ```java package com.example.blog.common; import lombok.AllArgsConstructor; import lombok.Data; import lombok.NoArgsConstructor; @Data @AllArgsConstructor @NoArgsConstructor public class Result { private int code; // 状态码:200成功,400失败,401未登录 private String msg; // 消息 private T data; // 数据 // 成功响应(带数据) public static Result success(T data) { return new Result<>(200, "success", data); } // 失败响应 public static Result fail(String msg) { return new Result<>(400, msg, null); } } ``` ## 前端框架搭建 ### 项目目录结构 ``` blog-frontend/ ├── public/ # 静态资源 ├── src/ │ ├── api/ # API请求(按模块划分) │ │ ├── front/ # 前台API │ │ └── admin/ # 后台API │ ├── assets/ # 图片、样式等资源 │ ├── components/ # 通用组件(公共/前台/后台) │ ├── router/ # 路由配置(前台/后台路由分离) │ ├── store/ # Pinia状态管理 │ ├── utils/ # 工具类(Axios封装、权限工具等) │ ├── views/ # 页面组件 │ │ ├── front/ # 前台页面(首页、文章详情等) │ │ └── admin/ # 后台页面(管理面板等) │ ├── App.vue # 根组件 │ └── main.js # 入口文件 ├── .env.development # 开发环境变量 ├── .env.production # 生产环境变量 └── vite.config.js # Vite配置 ``` ## 数据库设计(核心表) | 表名 | 说明 | 核心字段(示例) | | --------------- | --------- | ---------------------------------------------- | | `t_user` | 用户信息 | `id`、`username`、`password`、`role`(USER/ADMIN) | | `t_article` | 文章内容 | `id`、`title`、`content`、`user_id`、`category_id` | | `t_category` | 文章分类 | `id`、`name`、`parent_id`(二级分类) | | `t_tag` | 文章标签 | `id`、`name` | | `t_article_tag` | 文章 - 标签关联 | `article_id`、`tag_id` | | `t_comment` | 文章评论 | `id`、`content`、`article_id`、`user_id` | ## 部署流程 ### 后端部署 1. 打包:`mvn clean package -Dmaven.test.skip=true` 生成 `jar` 文件 2. 服务器运行:`nohup java -jar blog-server-1.0.0.jar --spring.profiles.active=prod &` ### 前端部署 1. 打包:`npm run build` 生成 `dist` 目录 2. Nginx 配置: ``` server { listen 80; server\_name your-domain.com; # 前台页面 location / { root /path/to/blog-frontend/dist; index index.html; } # 后台页面 location /admin { root /path/to/blog-frontend/dist; index index.html; } # 反向代理后端API location /api { proxy\_pass http://localhost:8080; } } ``` ## 扩展建议 * **性能优化**:添加 Redis 缓存热门文章、使用 CDN 加速静态资源 * **安全加固**:密码 BCrypt 加密、接口限流防恶意请求 * **功能扩展**:文章点赞 / 收藏、站内搜索(Elasticsearch)、数据导出(Excel)