经过两个周末的开发，每周歌词播放器终于完工了。这个项目算是我对自己前后端技术的小实践，在编写过程中，我也发现了不少问题。
起
项目最先的灵感，大概是……无聊？这个项目是暑假之初开的坑，当时用了1个小时左右简单开发了后端的内容提供。当然你也知道这个项目的后端，是非常简单的。
后端
包括后来补上的几个接口，拢共就这几个：
- 提供歌曲信息
- 添加歌曲接口
- 删除歌曲接口
- 编辑歌曲接口
- 获取lrc接口
其实这么多接口开发可以更快，只是中途添加修改功能耗费时间。当然外链播放器也是靠后端查询提供信息的（不像网易的外链是靠前端解析url的）。返回采用json，方便前端处理。
前端
每周歌词播放器界面
因为个人还是挺喜欢Material Design，所以采用了前端框架Materialize。
外链播放器
示例：
当然也支持歌词：
因为偷懒所以用了APlayer……作者dalao的博客请戳友链“Anotherhome”。不过以后可能会自己开坑。另外播放完成也有提示（给“每周歌词”系列宣传~）。
外链格式：kaaass.net/weeklyrics/outchain/sid(我是sid)/
网页播放器
使用一个audio标签进行播放的控制。
好像都没啥好说的，主要就是歌词。然而歌词是DIYGod dalao的代码……
就是首先使用正则解析每句歌词的时间为数组，然后将歌词添加到歌词div中。当检测到播放进度进行到某句歌词，就给歌词div一个向上的动画。大致思路也就是这样。
菜单
这就是菜单了~菜单项目是从API获取的，并进行解析。似乎也没啥好说的，因为整个东西本身就不是什么高端程序啊233333
未完待续
评论