Files
graduation-design/README.md
ikmkj 6ed9f73732 docs(README): 更新前后端部署说明
- 优化数据库配置步骤,增加创建数据库和导入SQL文件的详细说明
- 更新配置文件修改说明,提供更具体的配置示例
- 补充API文档访问说明
- 完善前端部署步骤,包括运行开发服务器和生产构建
- 增加SnowflakeIdUtil和TimeUtil工具类
2025-07-29 23:00:58 +08:00

254 lines
6.5 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
# 音乐播放应用系统
## 项目概述
这是一个功能完整的音乐播放应用系统,包含前后端两部分。系统支持用户注册登录、音乐播放、歌单管理、歌手管理、评论互动等功能,为用户提供全面的音乐体验。
### 系统架构
本项目采用前后端分离架构:
- 前端基于Vue 3的单页面应用
- 后端基于Spring Boot的RESTful API服务
- 数据库MySQL关系型数据库
- 缓存Redis缓存服务
## 技术栈
### 后端技术栈
- **核心框架**Spring Boot 3.x
- **ORM框架**Spring Data JPA + Hibernate
- **安全认证**Sa-Token
- **数据库**MySQL 8.x
- **缓存**Redis
- **API文档**Knife4j/Swagger
- **文件处理**:自定义文件上传服务
### 前端技术栈
- **核心框架**Vue 3 (组合式API)
- **构建工具**Vite
- **状态管理**Pinia
- **UI组件**Element Plus
- **路由管理**Vue Router
- **HTTP请求**Axios
- **音频处理**Web Audio API
## 功能模块
### 1. 用户系统
- 用户注册与登录
- 个人信息管理
- 收藏管理(音乐、歌单、歌手)
- 播放历史记录
- 权限控制(普通用户/管理员)
### 2. 音乐播放系统
- 音乐播放、暂停、上一首、下一首
- 播放列表管理
- 播放模式(顺序播放、单曲循环、列表循环)
- 歌词同步显示
- 进度控制与音量调节
- 播放统计
### 3. 音乐管理系统
- 音乐上传与编辑
- 音乐分类管理
- 音乐搜索
- 热门音乐推荐
- 最新音乐展示
### 4. 歌手管理系统
- 歌手信息管理
- 歌手分类
- 歌手音乐关联
- 歌手搜索
### 5. 歌单管理系统
- 歌单创建与编辑
- 歌单分类
- 歌单音乐管理
- 歌单收藏
- 官方推荐歌单
### 6. 评论系统
- 发表评论
- 回复评论
- 评论管理
### 7. 首页推荐系统
- 轮播图展示
- 热门音乐推荐
- 最新音乐展示
- 推荐歌单
- 热门歌手
## 数据模型
### 核心实体
1. **用户(User)**:用户基本信息
2. **音乐(Music)**:音乐信息、文件路径、歌词
3. **歌手(Singer)**:歌手信息
4. **歌单(Playlist)**:歌单信息
5. **评论(Comment)**:评论内容
6. **类型(Type)**:音乐类型、歌手类型、歌单类型
7. **轮播图(Banner)**:首页轮播图
### 核心关系
1. **用户-音乐**:收藏关系、播放历史
2. **用户-歌单**:创建关系、收藏关系
3. **用户-歌手**:收藏关系
4. **音乐-歌手**:多对多关系
5. **音乐-类型**:多对多关系
6. **歌单-音乐**:多对多关系
7. **歌手-类型**:多对一关系
8. **歌单-类型**:多对一关系
## 部署指南
### 环境要求
- JDK 17+
- Node.js 16+
- MySQL 8.x
- Redis 6.x
### 后端部署
1. **配置数据库**
在您的MySQL服务器中创建一个名为 `music_db` 的数据库,并使用 `utf8mb4` 字符集。
```sql
CREATE DATABASE music_db CHARACTER SET utf8mb4 COLLATE utf8mb4_general_ci;
```
然后,将 `sql/music_db.sql` 文件导入到 `music_db` 数据库中,以创建所有必需的表和初始数据。
2. **修改配置文件**
- 打开 `music-houduan/src/main/resources/application.yml` 文件。
- **数据库连接**:找到 `spring.datasource` 部分,并更新 `url`、`username` 和 `password` 以匹配您的MySQL配置。
```yaml
url: jdbc:mysql://localhost:3306/music_db?useUnicode=true&characterEncoding=utf-8&serverTimezone=Asia/Shanghai
username: your-mysql-username
password: your-mysql-password
```
- **Redis连接**:找到 `spring.redis` 部分,并更新 `host` 和 `port`。
```yaml
host: localhost
port: 6379
```
- **文件上传路径**:找到 `file.upload` 部分,并配置您希望存储上传文件的路径,或者保留不修改。
```yaml
path: /path/to/your/upload/folder/
```
请确保此目录存在并且您的应用程序具有写入权限。
3. **构建项目**
在 `music-houduan` 目录下使用Maven构建项目。
```bash
cd music-houduan
mvn clean package -DskipTests
```
4. **运行项目**
构建成功后运行生成的jar文件。
```bash
java -jar target/music-houduan-1.0.0.jar
```
默认情况下,后端服务将在 `http://localhost:8085` 上运行。
5. **API文档**
您可以通过以下URL访问API文档
- **Swagger UI**: [http://localhost:8085/swagger-ui/index.html](http://localhost:8085/swagger-ui/index.html)
- **Knife4j**: [http://localhost:8085/doc.html](http://localhost:8085/doc.html)
### 前端部署
1. **安装依赖**
在 `music-qianduan` 目录下使用npm安装项目依赖项。
```bash
cd music-qianduan
npm install
```
2. **修改配置**
- 在 `music-qianduan` 根目录中,创建一个名为 `.env.development` 的文件(用于开发环境)或 `.env.production` 的文件(用于生产环境)。
- 在此文件中,设置 `VITE_API_URL` 变量以指向您的后端API。
```
VITE_API_URL=http://localhost:8085
```
3. **运行开发服务器**
对于开发请使用以下命令启动Vite开发服务器
```bash
npm run dev
```
前端应用程序将在 `http://localhost:5173` 上可用。
4. **构建项目**
对于生产,请使用以下命令构建项目:
```bash
npm run build
```
5. **部署静态资源**
- 构建完成后,将 `music-qianduan/dist` 目录的内容部署到您的Web服务器例如Nginx、Apache
- 确保您的Web服务器配置正确以处理单页应用程序SPA的路由。对于Nginx您可能需要添加如下配置
```nginx
location / {
try_files $uri $uri/ /index.html;
}
```
## 使用说明
### 管理员账号
- 用户名admin
- 密码123456
### 普通用户
- 可以自行注册或使用以下测试账号:
- 用户名test
- 密码123456
### 基本操作流程
1. **音乐播放**
- 在首页或音乐列表页选择音乐
- 点击播放按钮开始播放
- 使用播放器控制播放进度、音量等
2. **歌单管理**
- 登录后可创建个人歌单
- 添加音乐到歌单
- 收藏其他用户的歌单
3. **音乐上传(管理员)**
- 登录管理员账号
- 进入后台管理
- 上传音乐文件和封面
4. **评论互动**
- 在音乐、歌单、歌手详情页发表评论
- 回复其他用户的评论
## 系统截图
(此处可添加系统主要页面的截图)
## 开发团队
- 前端开发XXX
- 后端开发XXX
- 产品设计XXX
- 测试XXX