COCO音乐下载站 是一个基于 Next.js 16 构建的现代化音乐搜索与下载平台。界面设计简约纯净，支持多渠道音乐搜索、在线试听、批量下载，并配备了丝滑的暗黑模式（涟漪过渡动画）。
本项目致力于提供无广告、极速、纯净的音乐获取体验。
- 🎵 多源聚合搜索：支持全网聚合搜索，内置多种音乐源渠道，一键切换。
- 🎧 在线试听：内置精美悬浮播放器，支持播放/暂停、进度拖拽、音量调节、上下曲切换、播放模式切换（顺序/随机/单曲）。
- 🖱️ 便捷交互：支持列表双击播放，鼠标悬停/选中效果优化，操作流畅。
- ⬇️ 批量下载：支持多选歌曲，一键批量打包下载选中的音乐。
- 🌓 极致主题体验：
- 完美适配深色/浅色模式。
- 独家定制的涟漪扩散切换动画（基于 View Transitions API），视觉效果惊艳。
- ⚡ 现代化技术栈：基于 React 19、Next.js 16 App Router、Tailwind CSS v4 构建。
本项目聚合了多个第三方音乐搜索引擎，支持以下音源：
- 歌曲宝
- 歌曲海
- 布谷
- QQ音乐
- QQMP3
- 咪咕
- 力音
- 煎饼系列（网易/QQ/酷狗/酷我聚合）
⚠️ 关于音质的重要说明：
- 不支持自定义音质选择：本程序自动解析目标源提供的默认最高可用音质。
- 无损音质支持：部分音源（如咪咕、QQMP3等）在资源允许的情况下会自动解析出 FLAC 无损格式，请自行探索尝试。
- 解析策略：程序会自动尝试获取最佳播放链接，若某个源无法播放，建议切换其他源重试。
- 核心框架: Next.js 16.1.2 (App Router)
- 编程语言: TypeScript
- 样式方案: Tailwind CSS v4
- 动画库: Framer Motion
- 图标库: Lucide React
- 主题管理: next-themes + View Transitions API
- 后端处理: Next.js API Routes + Axios + Cheerio
- Node.js >= 18.17.0
- npm / pnpm / yarn
git clone https://github.com/markcxx/coco-downloader.git
cd coco-downloadernpm install
# 或者
yarn install
# 或者
pnpm installnpm run dev打开浏览器访问 http://localhost:3000 即可开始使用。
npm run build
npm startcoco-downloader/
├── src/
│ ├── app/ # Next.js App Router 核心目录
│ │ ├── api/ # 后端 API 路由 (search, url, download)
│ │ ├── globals.css # 全局样式 (含 Tailwind v4 配置)
│ │ ├── layout.tsx # 根布局 (集成 ThemeProvider)
│ │ └── page.tsx # 首页主要逻辑 (搜索、列表、交互)
│ ├── components/ # UI 组件
│ │ ├── Navbar.tsx # 顶部导航栏 (含涟漪主题切换逻辑)
│ │ ├── PlayerBar.tsx # 底部悬浮播放器
│ │ └── ThemeProvider.tsx# 主题上下文提供者
│ ├── lib/ # 工具库
│ │ └── providers/ # 音乐源策略模式实现 (impl/gequbao.ts, impl/qqmp3.ts)
│ └── types/ # TypeScript 类型定义
├── public/ # 静态资源文件
└── ...
在 src/components/Navbar.tsx 中，我们利用了浏览器原生的 document.startViewTransition API 配合 CSS clip-path 属性。
当用户点击主题切换按钮时，计算点击坐标，以该坐标为圆心，计算覆盖全屏所需的最大半径，然后执行圆形扩散遮罩动画。这比传统的 CSS transition 全局淡入淡出更具动感和现代感。
项目后端采用策略模式设计。在 src/lib/providers 下定义了统一的接口。若需添加新的音乐网站源，只需新建一个实现类并在工厂方法中注册即可，无需大幅修改前端逻辑。
npm run build
npm start本项目支持 Docker 快速部署，且支持自定义端口。
-
拉取镜像
docker pull markcxx/coco-downloader:latest
-
运行容器
# 默认运行在 3000 端口 docker run -d -p 3000:3000 --name coco-downloader markcxx/coco-downloader:latest # 自定义端口 (例如 8080) docker run -d -p 8080:3000 -e PORT=3000 --name coco-downloader markcxx/coco-downloader:latest
- 本项目仅供个人学习与技术交流使用，严禁用于任何商业用途。
- 本项目所有音乐资源均来源于互联网第三方网站，本项目仅提供数据聚合与检索服务，不存储任何音乐文件。
- 若您发现本项目侵犯了您的权益，请联系我们进行删除。
- 使用本项目产生的任何法律后果由使用者自行承担。
如果您发现任何问题或有新功能建议，欢迎提交 Issue 或 Pull Request。
仓库地址：https://github.com/markcxx/coco-downloader
MIT License