各人好，我是 Java陈序员。
今天，给各人介绍一款基于 Vue + SpringBoot 前后端分离的开源博客体系！
关注微信公众号：【Java陈序员】，获取开源项目分享、AI副业分享、超200本经典盘算机电子书籍等。
项目介绍
shiyi-blog —— 拾壹博客，一款基于 Vue + SpringBoot 前后端分离的博客体系，文件支持本地和七牛云存储，集成 QQ、微信等第三方登录，并实现即时通讯聊天室功能。
功能特色：
- 前后端分离模式开发，使用最新的前后端开发技术实现
- 采用 Markdown 编辑器，支持代码高亮和复制、图片预览、深色模式等功能
- 文章支持考核、评论、点赞、留言等功能
- 接入第三方登录，支持 QQ、微信、微博、Github、Gitee 登录
- 提供后台管理、PC Web 端和 Uniapp 移动端
- 后台管理提供强大的设置功能，网站信息、友情链接、评论打赏、公告等支持个性化设置
- 使用 Netty + Websocket 技术实现博客群聊和单聊功能
技术栈：
- 前端：Vue3.0 + Element-Plus
- 后端：SpringBoot + Sa-Token + MyBatisPlus + MySQL + Redis + ElasticSearch
- 其他：接入 QQ、微博、码云、微信公众号等第三方登录，接入七牛云对象存储
功能截图
后台管理
PC 客户端
移动端
本地开发
情况准备
1、开发情况
- Node.js
- JDK 1.8
- MySQL
- Redis
- Elasticsearch(可选)
2、克隆代码- git clone https://gitee.com/quequnlong/shiyi-blog.git
- shiyi-blog
- ├──blog -- 后台服务
- │ ├── shiyi-admin -- 后台管理系统的controller模块
- │ ├── shiyi-common -- 通用模块
- │ ├── shiyi-generate -- 代码生成模块
- │ ├── shiyi-quartz -- 定时任务模块
- │ ├── shiyi-server -- 博客启动类模块
- │ └── shiyi-web -- 门户接口模块
- ├──blog-admin -- 后台管理
- ├──blog-web -- PC 客户端
- └──uniapp-blog -- Uniapp 移动端
1、将整个项目以 Maven 工程的形式导入到 IDEA 中
2、创建数据库 blog- CREATE DATABASE `blog` DEFAULT CHARACTER SET utf8mb4 COLLATE utf8mb4_bin;
4、修改 shiyi-blog/blog/shiyi-common/src/main/resources/application.yml 设置文件中的 MySQL、Redis、ElasticSearch(可选，默认不启用)的连接信息
5、运行主启动类 shiyi-blog/blog/shiyi-server/src/main/java/com/shiyi/Application.java 启动服务
6、服务启动乐成后，欣赏器访问如下地点查阅 API 文档- http://localhost:8800/shiyi/doc.html
后台管理端
- ## 进入后台管理
- cd blog-admin
- ## 安装依赖
- pnpm install
- ## 运行服务
- pnpm run dev
- ## 浏览器访问
- http://localhost:3000
如用户名暗码错误，可通过后台服务 AesEncryptUtil 类中的主函数重新天生暗码，并更新到数据表 b_user 表中的用户暗码。- public class AesEncryptUtil {
- final static String key = "shiyi2022";
- /**
- * 校验内容是否一致
- */
- public static boolean validate(String target, String target1) {
- return target.equalsIgnoreCase(aesEncrypt(target1));
- }
- /**
- * AES加密
- *
- * @param password：密码
- * @return
- */
- public static String aesEncrypt(String password){
- return SaSecureUtil.aesEncrypt(key, password);
- }
- public static void main(String[] args) {
- System.out.println(aesEncrypt("123456"));
- }
- }
- ## 进入 PC 客户端
- cd blog-web
- ## 安装依赖
- pnpm install
- ## 运行服务
- pnpm run dev
- ## 浏览器访问
- http://localhost:8000
1、将 uniapp-blog 目次导入到 HBuilderX 中
2、修改 request.js 中的后台服务地点- export default function request(options) {
- //后端接口地址
- const baseUrl = 'http://localhost:8800/shiyi';
- }
shiyi-blog 作为一款开源的博客体系，可以说功能齐全，采用最新的开发模式和技术栈完备地实现了一套博客体系，是一个十分优秀的开源博客体系！- 项目地址：https://gitee.com/quequnlong/shiyi-blog
推荐的开源项目已经收录到 GitHub 项目，欢迎 Star：- https://github.com/chenyl8848/great-open-source-project
- https://chencoding.top:8090/#/
各人的点赞、收藏和评论都是对作者的支持，如文章对你有资助还请点赞转发支持下，谢谢！
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。 |
