# 音乐播放应用系统

## 项目概述

这是一个功能完整的音乐播放应用系统，包含前后端两部分。系统支持用户注册登录、音乐播放、歌单管理、歌手管理、评论互动等功能，为用户提供全面的音乐体验。

### 系统架构

本项目采用前后端分离架构：
- 前端：基于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