🎵 MusicAI-克劳德+Spotify音乐推荐系统
由Claude AI和Spotify支持的未来音乐推荐系统,可根据您的心情和音乐偏好提供个性化的歌曲推荐。直接在浏览器中播放预览,无需离开应用程序!
✨ 特性
- 🎭 基于情绪的推荐:从8种不同的情绪(快乐、悲伤、精力充沛、冷静、有动力、放松、聚会、心碎)中选择,以获得个性化的音乐建议
- 🤖 AI驱动算法:Claude AI分析你的音乐品味和情绪,以创建类似于Spotify的《发现周刊》的基于算法的推荐
- 🎧 在浏览器中播放:直接在浏览器中播放30秒预览-无需打开Spotify链接
- 🔍 Spotify搜索:直接搜索歌曲、艺术家和曲目
- 💬 克劳德聊天:与Claude AI聊天,进行音乐相关对话
- 🎨 现代用户界面:简洁、未来主义的设计,具有玻璃形态效果和流畅的交互
- 📱 响应式设计:在台式机和移动设备上运行良好
🚀 快速开始
先决条件
- Node.js(v16或更高版本)
- npm或纱线
- 无烟煤API键
- Spotify开发者帐户
安装
- 克隆存储库
git clone https://github.com/yourusername/musicAI-mcps.git
cd musicAI-mcps- 安装依赖项
# Install root dependencies
npm install
# Install client dependencies
cd client && npm install && cd ..- 设置环境变量
创建一个 .env 根目录中的文件:
# Anthropic API Key (required)
ANTHROPIC_API_KEY=your_anthropic_api_key_here
# Spotify API Credentials (required)
SPOTIFY_CLIENT_ID=your_spotify_client_id_here
SPOTIFY_CLIENT_SECRET=your_spotify_client_secret_here
# Server Port (optional, defaults to 3000)
PORT=3000- 获取API密钥
无烟煤API密钥:
- 访问 拟人控制台 - 注册或登录 - 导航到API密钥部分 - 创建新的API密钥 - 复制并粘贴到 .env 文件
Spotify API证书:
- 首选 Spotify开发者仪表板 - 使用您的Spotify帐户登录 - 点击“创建应用” - 填写应用程序详细信息 - 复制客户端ID和客户端密码 - 粘贴到 .env 文件
- 运行应用程序
# Run both client and server concurrently
npm run dev
# Or run them separately:
# Terminal 1 - Server
npm run server
# Terminal 2 - Client
npm run client- 在浏览器中打开
- 客户:http://localhost:5173 - 服务器:http://localhost:3000
📖 用法
基于情绪的推荐
- 选择 “情绪建议” 模式(默认)
- 从8个可用选项中选择您当前的心情
- (可选)输入您的音乐偏好(流派、最喜欢的艺术家等)
- 点击 “获取基于算法的推荐”
- Claude AI将分析您的情绪和偏好
- 通过以下方式获得个性化歌曲推荐:
- 播放预览按钮(30秒预览) - 直接Spotify链接 - 相册艺术品 - 人工智能为每项建议生成解释
Spotify搜索
- 选择 “Spotify搜索” 模式
- 键入歌曲名称、艺术家或曲目
- 通过预览播放获得即时结果
克劳德聊天
- 选择 “与克劳德聊天” 模式
- 问克劳德任何关于音乐的事
- 获得AI驱动的响应
🏗️ 项目结构
musicAI-mcps/
├── client/ # React frontend
│ ├── src/
│ │ ├── App.jsx # Main application component
│ │ ├── App.css # Styles
│ │ └── main.jsx # Entry point
│ ├── public/ # Static assets
│ ├── package.json # Client dependencies
│ └── vite.config.js # Vite configuration
├── server/ # Express backend
│ └── server.js # MCP server implementation
├── package.json # Root package configuration
├── .env # Environment variables (create this)
├── .gitignore # Git ignore rules
└── README.md # This file🔌 API终点
服务器端点
GET /status-健康检查端点
{
"status": "ok",
"service": "Claude + Spotify MCP Server"
}POST /invoke-工具调用端点
{
"tool": "mood_recommendations" | "spotify_search" | "claude_chat",
"input": "string or JSON string"
}可用工具
- mood推荐:根据心情获取基于AI的音乐推荐
- spotify_search:在Spotify上搜索曲目
- 克劳德聊天:与Claude AI聊天
🛠️ 使用的技术
- 前端:
- 反应18+ - 顺风 CSS - 维特 - 阿西奥斯
- 后端:
- Node.js - Express.js - API人类克劳德 - Spotify Web API
🎨 详细功能
情绪选择
从8种精心策划的情绪中选择,每种情绪都有自己的配色方案:
- 😊 快乐
- 😢 悲伤
- 🔥 精力充沛的
- 😌 放松
- 💪 有动力的
- 😴 放松的
- 🎉 聚会
- 💔 心碎
基于算法的推荐
该系统使用Claude AI来:
- 分析您的音乐偏好
- 了解你目前的心情
- 生成类似于Spotify算法的推荐
- 为每首歌曲的选择提供解释
在浏览器中播放
- 直接在浏览器中播放30秒预览
- 无需打开Spotify(除非您想要完整曲目)
- 流畅的音频控制
- 底部的“正在播放”栏
🐛 故障排除
常见问题
API密钥错误:
- 确保你的
.env文件位于根目录中 - 验证API密钥是否正确且处于活动状态
- 检查您的文件夹中是否没有多余的空间
.env文件
CORS错误:
- 服务器包括CORS中间件-这应该会自动工作
- 如果问题仍然存在,请检查服务器是否在端口3000上运行
端口冲突:
- 更改
PORT在你的.env如果3000已在使用中 - 在中更新客户端API URL
App.jsx如果你改变端口
找不到模型错误:
- 该应用程序使用
claude-3-haiku-20240307默认情况下 - 如果您有权访问其他型号,请在中更新型号名称
server/server.js
没有可用的预览:
- 某些曲目没有来自Spotify的预览URL
- 点击“Spotify”按钮,在Spotify中打开完整曲目
📝 脚本
npm run dev # Run both client and server
npm run server # Run server only
npm run client # Run client only
npm start # Run server only (alias)🤝 贡献
欢迎投稿!请随时提交拉取请求。
- 分叉存储库
- 创建功能分支(
git checkout -b feature/AmazingFeature) - 提交您的更改(
git commit -m 'Add some AmazingFeature') - 推到分支(
git push origin feature/AmazingFeature) - 打开拉取请求
📄 许可证
该项目根据ISC许可证获得许可。
🙏 致谢
📧 联系
如有疑问或支持,请在GitHub上发布问题。
______________________________________________________________________
由以下材料制成❤️ 使用Claude AI和Spotify
