182 lines
4.5 KiB
Markdown
Executable File
182 lines
4.5 KiB
Markdown
Executable File
# 🎵 歌单功能部署指南
|
||
|
||
## ✨ 新增功能
|
||
|
||
### 1. 后端 API
|
||
- ✅ **POST /api/favorite/add** - 添加歌曲到"我喜欢"
|
||
- ✅ **POST /api/favorite/remove** - 从"我喜欢"移除歌曲
|
||
- ✅ **GET /api/favorite/list** - 获取"我喜欢"列表
|
||
- ✅ **GET /api/favorite/check** - 检查歌曲是否已收藏
|
||
|
||
### 2. 前端界面
|
||
- ✅ 现代化的音乐播放器界面（类似 QQ 音乐风格）
|
||
- ✅ 搜索功能
|
||
- ✅ "我喜欢"歌单管理
|
||
- ✅ 在线播放功能
|
||
- ✅ 收藏/取消收藏功能
|
||
- ✅ 响应式设计，支持手机和电脑
|
||
|
||
### 3. 新增文件
|
||
- `playlist.go` - 歌单管理后端
|
||
- `themes/index.html` - 现代化前端界面
|
||
- `files/playlists.json` - 歌单数据存储（自动生成）
|
||
|
||
---
|
||
|
||
## 📦 部署步骤
|
||
|
||
### 第一步：上传更新文件到云服务器
|
||
|
||
#### 方法 1：通过远程桌面
|
||
1. **连接到阿里云服务器**的远程桌面
|
||
2. **复制文件** `D:\music-server-update.zip` 到云服务器
|
||
3. **解压到** `C:\music-server\MeowEmbeddedMusicServer`
|
||
|
||
#### 方法 2：通过 PowerShell（本地）
|
||
```powershell
|
||
# 如果有 SSH 访问权限
|
||
scp D:\music-server-update.zip Administrator@你的服务器IP:C:\music-server\
|
||
```
|
||
|
||
### 第二步：在云服务器上部署
|
||
|
||
**连接到云服务器 PowerShell**，运行：
|
||
|
||
```powershell
|
||
# 1. 进入项目目录
|
||
cd C:\music-server\MeowEmbeddedMusicServer
|
||
|
||
# 2. 停止当前运行的服务器（如果在运行）
|
||
# 按 Ctrl+C 停止，或者找到进程并结束
|
||
Get-Process | Where-Object {$_.ProcessName -like "*go*"} | Stop-Process -Force
|
||
|
||
# 3. 解压更新文件（如果使用远程桌面复制的 zip）
|
||
Expand-Archive -Path C:\music-server\music-server-update.zip -DestinationPath C:\music-server\MeowEmbeddedMusicServer -Force
|
||
|
||
# 4. 确认新文件已存在
|
||
Test-Path .\playlist.go
|
||
Test-Path .\themes\index.html
|
||
|
||
# 5. 重新编译和运行
|
||
go run .
|
||
```
|
||
|
||
### 第三步：测试功能
|
||
|
||
#### 1. 打开浏览器访问
|
||
```
|
||
http://你的服务器IP:2233
|
||
```
|
||
|
||
#### 2. 测试流程
|
||
1. ✅ 在搜索框输入歌曲名（如：晴天）
|
||
2. ✅ 点击"搜索"按钮
|
||
3. ✅ 点击"❤️"按钮收藏歌曲
|
||
4. ✅ 切换到"我喜欢"标签页
|
||
5. ✅ 查看收藏的歌曲
|
||
6. ✅ 点击"播放"按钮测试播放
|
||
7. ✅ 再次点击"❤️"取消收藏
|
||
|
||
---
|
||
|
||
## 🎨 界面预览
|
||
|
||
### 搜索页面
|
||
- 顶部：紫色渐变背景
|
||
- 搜索框：支持歌曲名 + 歌手名搜索
|
||
- 搜索结果：卡片式显示，包含封面、标题、歌手、时长
|
||
- 操作按钮：收藏 ❤️ + 播放 ▶️
|
||
|
||
### 我喜欢页面
|
||
- 显示所有收藏的歌曲
|
||
- 支持取消收藏
|
||
- 支持直接播放
|
||
|
||
### 播放器
|
||
- 底部固定播放器
|
||
- 显示当前播放的歌曲信息
|
||
- HTML5 音频播放器，支持进度控制
|
||
|
||
---
|
||
|
||
## 📁 数据存储
|
||
|
||
歌单数据保存在：
|
||
```
|
||
C:\music-server\MeowEmbeddedMusicServer\files\playlists.json
|
||
```
|
||
|
||
格式示例：
|
||
```json
|
||
{
|
||
"favorite": {
|
||
"name": "我喜欢",
|
||
"songs": [
|
||
{
|
||
"title": "晴天",
|
||
"artist": "周杰伦",
|
||
"audio_url": "/cache/music/周杰伦-晴天/music.mp3",
|
||
"cover_url": "/cache/music/周杰伦-晴天/cover.jpg",
|
||
"lyric_url": "/cache/music/周杰伦-晴天/lyric.lrc",
|
||
"duration": 267
|
||
}
|
||
]
|
||
}
|
||
}
|
||
```
|
||
|
||
---
|
||
|
||
## 🔧 常见问题
|
||
|
||
### Q1: 界面显示不正常？
|
||
**A:** 确保 `themes/index.html` 文件已正确上传，浏览器清除缓存后重新访问。
|
||
|
||
### Q2: 收藏功能不工作？
|
||
**A:**
|
||
1. 检查 `playlist.go` 是否已上传
|
||
2. 确认服务器已重启
|
||
3. 查看服务器日志是否有错误
|
||
|
||
### Q3: 播放器无法播放？
|
||
**A:**
|
||
1. 检查音频文件是否正确缓存
|
||
2. 确认防火墙允许端口 2233
|
||
3. 查看浏览器控制台是否有错误信息
|
||
|
||
### Q4: 如何备份收藏数据？
|
||
**A:** 定期备份 `files/playlists.json` 文件
|
||
|
||
---
|
||
|
||
## 🚀 后续优化建议
|
||
|
||
### 1. 添加更多歌单
|
||
修改 `playlist.go`，支持创建多个自定义歌单
|
||
|
||
### 2. 歌词滚动显示
|
||
在前端添加歌词解析和滚动显示功能
|
||
|
||
### 3. 播放历史
|
||
记录播放历史，方便快速重播
|
||
|
||
### 4. 推荐系统
|
||
根据收藏和播放历史推荐相似音乐
|
||
|
||
### 5. 用户系统
|
||
添加多用户支持，每个用户有独立歌单
|
||
|
||
---
|
||
|
||
## 📞 技术支持
|
||
|
||
如遇问题，请检查：
|
||
1. 服务器日志输出
|
||
2. 浏览器开发者工具（F12）的控制台
|
||
3. 网络请求是否正常
|
||
|
||
---
|
||
|
||
**祝您使用愉快！🎵**
|
||
|