一款基于Vue打造的网页在线音乐播放器，利用工作空闲时间与大学同学@ganp1020一起开发。目前正在开发阶段，已经能正常使用。支持歌单外链这一特色功能！
项目演示地址：
实现的功能：
- 上一曲
- 下一曲
- 暂停/播放
- 音质选择
- 遇到没有的音质自动切换音质源
- 音乐搜索
- 播放列表展示
- 正在播放歌曲标志
- 歌单全部播放
- 歌单，歌曲top榜显示
- 同时适配桌面端和移动端
项目技术：
- vue
- vue-router
- vuex
- axios
- jsonp
- Vuetify
项目截图
Top榜单及Top歌曲
歌曲搜索以及热搜关键词
歌单详情
播放列表
特色功能 —— 歌单外链的使用方法：
除了像一个正常网页音乐播放器外，还支持一个个人认为比较牛逼的功能 —— 歌曲外链，使用方法如下：
- 登录网页QQ音乐，选择你需要制作外链的歌单，点击分享，点击复制链接：
复制分享歌单链接
- 将复制好的链接粘贴到任何可以编辑的地方，然后将链接中的数字部分复制下来：
复制链接中的数字部分
- 在你博客中需要接入外链的地方加入以下代码(请注意，将下面链接中的
2947517062替换成你上一步中复制的数字，如果不需要播放器自动播放请将下面true改成false，iframe的宽高你可以自定义,Chrome可能会禁止iframe内音频自动播放，你的博客不能为https站点，因为此网页中包含http请求，https站点下是不允许http请求的)：<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=330 height=450 src="http://cyixlq.gitee.io/hiegher_music_app/#/iframe/2947517062/true"></iframe> - 效果图如下：
效果图
到这里，你的音乐外链就制作完成，注意并不是所有歌曲的播放地址都能解析出来，还望谅解，如果你喜欢本项目的话或者本项目对你有一定帮助的话，可以扫描下方二维码进行捐赠，以此来维持服务器的运转：
捐赠
网友评论