# Blog **Repository Path**: code00001/blog ## Basic Information - **Project Name**: Blog - **Description**: MyBlog 是一个极简洁,基于 RuoYi-Vue 框架开发的个人博客管理系统，提供完整的文章管理、分类管理、标签管理和评论管理功能。系统采用前后端分离架构，后端基于 Spring Boot，前端基于 Vue.js + Element UI，支持多用户权限管理。 - **Primary Language**: Unknown - **License**: MIT - **Default Branch**: main - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 0 - **Forks**: 2 - **Created**: 2026-02-25 - **Last Updated**: 2026-02-25 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README # MyBlog - 个人博客管理系统 ## 项目简介 MyBlog 是一个基于 RuoYi-Vue 框架开发的个人博客管理系统，提供完整的文章管理、分类管理、标签管理和评论管理功能。系统采用前后端分离架构，后端基于 Spring Boot，前端基于 Vue.js + Element UI，支持多用户权限管理。 ### 主要特性 - **文章管理**：支持文章发布、编辑、删除、草稿、置顶、推荐等功能 - **分类管理**：支持树形分类结构，方便文章分类管理 - **标签管理**：灵活的标签系统，支持多标签关联 - **评论管理**：完整的评论系统，支持评论审核和管理 - **友情链接**：友情链接管理功能 - **权限管理**：基于角色的权限控制，细粒度的菜单和按钮权限 - **代码生成**：一键生成前后端代码，提高开发效率 ## 技术栈 ### 后端技术 | 技术 | 版本 | 说明 | | --- | --- | --- | | Spring Boot | 2.5.15 | 应用开发框架 | | Spring Security | 5.7.14 | 安全框架 | | MyBatis | 3.5.x | ORM 框架 | | MySQL | 5.7+ | 数据库 | | Redis | 6.0+ | 缓存数据库 | | JWT | 0.9.1 | Token 生成与解析 | | Druid | 1.2.27 | 数据库连接池 | | FastJson | 2.0.60 | JSON 处理 | | Swagger | 3.0.0 | API 文档生成 | | PageHelper | 1.4.7 | MyBatis 分页插件 | ### 前端技术 | 技术 | 版本 | 说明 | | --- | --- | --- | | Vue.js | 2.6.12 | 渐进式 JavaScript 框架 | | Element UI | 2.15.14 | UI 组件库 | | Vue Router | 3.4.9 | 路由管理器 | | Vuex | 3.6.0 | 状态管理模式 | | Axios | 0.28.1 | HTTP 请求库 | | ECharts | 5.4.0 | 数据可视化图表库 | | Quill | 2.0.2 | 富文本编辑器 | ## 项目架构 ### 模块说明 ``` MyBlog/ ├── blog-admin/ # 后台管理入口模块 │ └── Web 服务入口，包含 Controller 层 ├── blog-framework/ # 核心框架模块 │ └── 包含安全配置、日志、缓存等核心功能 ├── blog-system/ # 系统业务模块 │ ├── domain/ # 实体类 │ ├── mapper/ # Mapper 接口 │ └── service/ # 业务逻辑层 ├── blog-common/ # 通用工具模块 │ └── 工具类、注解、常量等 ├── blog-generator/ # 代码生成模块 │ └── 提供代码生成器功能 ├── blog-quartz/ # 定时任务模块 │ └── 定时任务调度管理 ├── blog-ui/ # 前端 UI │ ├── api/ # API 接口 │ ├── components/ # 公共组件 │ ├── layout/ # 布局组件 │ ├── router/ # 路由配置 │ ├── store/ # Vuex 状态管理 │ └── views/ # 页面视图 └── sql/ # 数据库脚本 ├── blog_tables.sql # 博客核心表 ├── blog_menu.sql # 菜单配置 └── blog_comment_table.sql # 评论表 ``` ### 数据库设计 系统包含以下核心表： - **blog_article**：文章表，存储文章标题、内容、摘要、封面图片等信息 - **blog_category**：文章分类表，支持树形结构 - **blog_tag**：文章标签表 - **blog_article_tag**：文章标签关联表，实现多对多关系 - **blog_comment**：评论表，存储文章评论 - **blog_link**：友情链接表 ## 功能特性 ### 已实现功能 #### 文章管理 - ✅ 文章列表查询（支持标题、分类、状态筛选） - ✅ 新增/编辑/删除文章 - ✅ 文章发布（草稿转发布） - ✅ 浏览量统计 - ✅ 置顶/推荐设置 - ✅ 文章封面上传 #### 分类管理 - ✅ 分类列表查询 - ✅ 新增/编辑/删除分类 - ✅ 树形结构支持 - ✅ 显示顺序管理 #### 标签管理 - ✅ 标签列表查询 - ✅ 新增/编辑/删除标签 - ✅ 文章数量统计 #### 评论管理 - ✅ 评论列表查询 - ✅ 评论审核/删除 - ✅ 评论状态管理 #### 友情链接管理 - ✅ 链接列表查询 - ✅ 新增/编辑/删除链接 - ✅ 显示顺序管理 #### 系统功能（继承自 RuoYi） - ✅ 用户管理 - ✅ 角色管理 - ✅ 菜单管理 - ✅ 部门管理 - ✅ 岗位管理 - ✅ 字典管理 - ✅ 参数配置 - ✅ 通知公告 - ✅ 日志管理 - ✅ 在线用户 - ✅ 定时任务 - ✅ 代码生成 - ✅ 系统监控 - ✅ 缓存监控 ### 待完善功能 - 📋 文章富文本编辑器增强 - 📋 前台展示页面开发 - 📋 文章搜索功能 - 📋 文章归档功能 - 📋 统计分析（热门文章、访问量统计） - 📋 SEO 优化 - 📋 社交分享功能 - 📋 RSS 订阅 ## 系统演示图
## 快速开始 ### 环境要求 - JDK 1.8+ - MySQL 5.7+ - Redis 6.0+ - Node.js 12+ - Maven 3.6+ ### 后端启动 1. **导入数据库** ```bash # 创建数据库 CREATE DATABASE blog DEFAULT CHARACTER SET utf8mb4 COLLATE utf8mb4_general_ci; # 导入 SQL 脚本 mysql -u root -p blog < sql/ry_20250522.sql mysql -u root -p blog < sql/blog_tables.sql ``` 2. **修改数据库配置** 编辑 `blog-admin/src/main/resources/application-druid.yml`： ```yaml spring: datasource: druid: master: url: jdbc:mysql://localhost:3306/blog?useUnicode=true&characterEncoding=utf8&zeroDateTimeBehavior=convertToNull&useSSL=true&serverTimezone=GMT%2B8 username: root password: your_password ``` 3. **修改 Redis 配置** 编辑 `blog-admin/src/main/resources/application.yml`： ```yaml spring: redis: host: localhost port: 6379 password: ``` 4. **启动后端服务** ```bash # 进入项目目录 cd MyBlog # Maven 编译打包 mvn clean install # 启动服务（方式一） java -jar blog-admin/target/blog-admin.jar # 启动服务（方式二） ./ry.sh ``` 后端默认运行在 `http://localhost:8080` ### 前端启动 1. **安装依赖** ```bash cd blog-ui npm install ``` 2. **启动开发服务器** ```bash npm run dev ``` 前端默认运行在 `http://localhost:80` 3. **生产环境构建** ```bash npm run build:prod ``` ### 访问系统 - 后端接口文档：http://localhost:8080/swagger-ui/index.html - 前端管理页面：http://localhost:80 - 默认账号：admin / admin123 ## API 文档 ### 文章相关接口 | 接口路径 | 请求方式 | 说明 | | --- | --- | --- | | /blog/article/list | GET | 查询文章列表 | | /blog/article/{articleId} | GET | 获取文章详情 | | /blog/article | POST | 新增文章 | | /blog/article | PUT | 修改文章 | | /blog/article/{articleIds} | DELETE | 删除文章 | | /blog/article/publish/{articleId} | PUT | 发布文章 | | /blog/article/view/{articleId} | PUT | 增加浏览量 | ### 分类相关接口 | 接口路径 | 请求方式 | 说明 | | --- | --- | --- | | /blog/category/list | GET | 查询分类列表 | | /blog/category/{categoryId} | GET | 获取分类详情 | | /blog/category | POST | 新增分类 | | /blog/category | PUT | 修改分类 | | /blog/category/{categoryIds} | DELETE | 删除分类 | ### 标签相关接口 | 接口路径 | 请求方式 | 说明 | | --- | --- | --- | | /blog/tag/list | GET | 查询标签列表 | | /blog/tag/{tagId} | GET | 获取标签详情 | | /blog/tag/article/{articleId} | GET | 根据文章ID查询标签 | | /blog/tag | POST | 新增标签 | | /blog/tag | PUT | 修改标签 | | /blog/tag/{tagIds} | DELETE | 删除标签 | ### 评论相关接口 | 接口路径 | 请求方式 | 说明 | | --- | --- | --- | | /blog/comment/list | GET | 查询评论列表 | | /blog/comment/{commentId} | GET | 获取评论详情 | | /blog/comment | PUT | 修改评论状态 | | /blog/comment/{commentIds} | DELETE | 删除评论 | 完整 API 文档请访问 Swagger：http://localhost:8080/swagger-ui/index.html ## 项目结构 ### 后端目录结构 ``` blog-system/src/main/java/com/blog/blog/ ├── domain/ # 实体类 │ ├── BlogArticle.java # 文章实体 │ ├── BlogCategory.java # 分类实体 │ ├── BlogTag.java # 标签实体 │ ├── BlogArticleTag.java # 文章标签关联 │ ├── BlogComment.java # 评论实体 │ └── BlogLink.java # 友情链接实体 ├── mapper/ # Mapper 接口 │ ├── BlogArticleMapper.java │ ├── BlogCategoryMapper.java │ ├── BlogTagMapper.java │ ├── BlogArticleTagMapper.java │ ├── BlogCommentMapper.java │ └── BlogLinkMapper.java └── service/ # 业务逻辑层 ├── IBlogArticleService.java ├── IBlogCategoryService.java ├── IBlogTagService.java ├── IBlogCommentService.java ├── IBlogLinkService.java └── impl/ # 业务实现类 ``` ### 前端目录结构 ``` blog-ui/src/ ├── api/blog/ # 博客相关 API │ ├── article.js # 文章 API │ ├── category.js # 分类 API │ ├── tag.js # 标签 API │ ├── comment.js # 评论 API │ └── link.js # 友情链接 API └── views/blog/ # 博客页面 ├── article/index.vue # 文章管理页面 ├── category/index.vue # 分类管理页面 ├── tag/index.vue # 标签管理页面 ├── comment/index.vue # 评论管理页面 └── link/index.vue # 友情链接管理页面 ``` ## 开发指南 ### 新增业务模块 1. **设计数据库表** - 在 `sql/` 目录下创建表结构 SQL 文件 - 执行 SQL 创建表 2. **使用代码生成器** - 访问 系统工具 > 代码生成 - 导入数据库表 - 生成代码（包含 Entity、Mapper、Service、Controller、Vue 页面） - 将生成的代码复制到对应目录 3. **配置菜单权限** - 访问 系统管理 > 菜单管理 - 新增菜单 - 配置权限标识 ### 开发规范 - **后端规范** - 遵循 RESTful API 设计规范 - Controller 层负责参数校验和请求转发 - Service 层负责业务逻辑处理 - Mapper 层负责数据库操作 - 使用统一的异常处理机制 - 使用统一的返回结果封装 - **前端规范** - 遵循 Vue 官方风格指南 - 组件采用 PascalCase 命名 - API 接口统一管理 - 使用 Vuex 管理全局状态 - 路由采用懒加载方式 ## 部署说明 ### Docker 部署（推荐） 1. **构建镜像** ```bash # 构建后端镜像 docker build -t myblog-admin:latest . # 构建前端镜像 cd blog-ui docker build -t myblog-ui:latest . ``` 2. **使用 Docker Compose** ```bash docker-compose up -d ``` ### 传统部署 1. **后端部署** ```bash # 打包 mvn clean package # 运行 java -jar blog-admin/target/blog-admin.jar --spring.profiles.active=prod ``` 2. **前端部署** ```bash # 构建 npm run build:prod # 部署到 Nginx cp -r dist/* /usr/share/nginx/html/ ``` 3. **Nginx 配置** ```nginx server { listen 80; server_name your-domain.com; location / { root /usr/share/nginx/html; index index.html; try_files $uri $uri/ /index.html; } location /prod-api/ { proxy_pass http://localhost:8080/; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; } } ``` ## 常见问题 ### 1. 后端启动失败 - 检查 MySQL 和 Redis 是否启动 - 检查数据库配置是否正确 - 检查端口 8080 是否被占用 ### 2. 前端无法访问后端接口 - 检查后端是否正常启动 - 检查前端代理配置 `vue.config.js` - 检查浏览器控制台是否有跨域错误 ### 3. 登录失败 - 检查 Redis 是否启动 - 检查验证码是否正确 - 检查用户名密码是否正确 ## 更新日志 ### v3.9.1 (2026-02-13) - 初始化博客系统 - 完成文章、分类、标签、评论、友情链接管理功能 - 集成 RuoYi-Vue 框架 ## 技术支持 - 项目地址：[GitHub](https://github.com) - 问题反馈：[Issues](https://github.com/issues) - 基础框架：[RuoYi-Vue](http://doc.ruoyi.vip) ## 许可证 本项目基于 MIT 协议开源，仅供学习和研究使用。 ## 致谢 感谢 [RuoYi-Vue](http://ruoyi.vip) 提供的优秀基础框架。 ## 更多信息 > _请查看微信公众号：_ > - 公众号：V5codings > > ![](https://gitee.com/HRuinger/HRuinger_0412/raw/master/src/main/resources/static/img/Snipaste_2021-04-13_18-18-31-v5.png) > - 公众号：若依框架教程 > > ![](https://gitee.com/HRuinger/HRuinger_0412/raw/master/src/main/resources/static/img/Snipaste_2021-04-13_18-17-01-ry.png)