使用网易云的接口实现页面搜索歌曲，歌词获取，网易云外链播放歌曲。

前端页面

页面展示

Js代码

获取歌曲列表

一打开页面，先去数据读取数据，拿到数据库存储的数据返回回来，在写到页面里，并存储到songList数组里，便于后期拿出数据，并且设置当前播放的索引，我们是根据索引来取数据的

获取歌词

写入歌曲列表，得到索引，就拿索引去取当前播放的歌曲，顺便获取当前播放歌曲的ID，传个加载歌词的函数，调用后端查询网易云的歌词接口，然后返回歌词数据

根据歌曲的ID获取歌词

搜索功能

根据用户输入的值调用接口查询数据，返回来后也存到一个查询歌曲列表里,searchList，便于调取

添加歌曲

绑定点击事件，当用户点击该歌曲时，先判断该歌曲是否为VIP收费歌曲，如果是收费的则不会播放，否者在判断该歌曲是否存在于我们songList中，如果存在于songList则直接播放该歌曲，不然就调用添加函数，往数据库存入这首个的歌曲。

删除歌曲

获取歌曲列表时，同时绑定点击列表歌曲的事件，如果是鼠标左键点击则为播放歌曲，右键点击则为删除该歌曲

JAVA后端

持久层

对数据库进行增删查改

业务层

调用持久层函数，当时我在后端也去验证了下是否添加的数据该数据库内已存在

表现层

各种调用函数，获取歌词，获取歌曲，删除，添加，搜索功能

工具类

一个是数据库的

还有个就是解析网易云接口的(当时想去爬取网易云的歌曲，但是拿不出数据，后来看到别人的帖子说，加密了两个参数。当时就感觉没望了，突然我就发现一篇帖子，忘记保存那篇帖子了，时间是去年的好像，他是直接把网易云的core.js扣下来了，然后每次去访问网易云时，先自己把数据加密，然后在发送，就可以正确的得到数据了，大概就是这样吧，也不是很理解大佬的思维，就感觉很牛逼!)

展示

sql语句

CREATE DATABASE cloudmusic;

USE cloudmusic;

CREATE TABLE tab_song(

songId INT,

songName VARCHAR(50),

songAutor VARCHAR(20),

songImg VARCHAR(255),

fee INT

)DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;

INSERT INTO tab_song VALUES(1438781318,'全世界最好的你','许嵩','http://p1.music.126.net/ge44m1UX_M4ZKqn57QUHvw==/109951164885142881.jpg',0);

INSERT INTO tab_song VALUES(1363948882,'世间美好与你环环相扣','柏松','http://p2.music.126.net/DK1_4sP_339o5rowMdPXdw==/109951164071024476.jp',0);

INSERT INTO tab_song VALUES(1314382744,'尝试温柔','龚子婕JessieG','http://p1.music.126.net/1YnM0_qxp6IVxfIF6S157Q==/109951163579687054.jpg',0);

INSERT INTO tab_song VALUES(1344010163,'地铁等待','张紫豪','http://p1.music.126.net/ZA9WoRqY7MJzepLYZVcWqQ==/109951163837791935.jpg',0);

INSERT INTO tab_song VALUES(1370047789,'我走后','小咪','http://p1.music.126.net/LoTWeVUksWrH-BYRLnL8Lg==/109951164127532959.jp',0);

当前数据库内存在这几条数据

搜索功能

歌曲读取和歌词读取，不用说了吧，页面展示了

我们在右边输入我们需要查找的歌曲名

比如我们搜索'过活'，网易云搜索结果

我们搜索结果

歌曲添加功能

当我们点击搜索出来的歌曲他就会添加到播放列表，并且播放它

当然有些是VIP歌曲，是无法播放的

就比如这首

删除功能

我们只要在播放列表选中需要删除的歌曲，右键，然后会弹出确认框，问你是否删除该歌曲。

当前们数据库有这几首歌，我们把第一首删除掉，对了，删除后，默认是从第一首开始播放，按我们不删除第一首了，我们删除尝试温柔吧。

点确定就删除了

当前数据内也没有该歌曲

基本上功能就这些吧

存在的bug

有时打开可能还没加载出歌曲，所以他不会播放，需要重新刷新页面，或者点击歌曲列表。 那就这样吧！

最后

该项目仅限学习和研究，请勿滥用。

分享给需要的同学，同时本人技术也不是很强，代码杂乱，且很多地方原理没理解清楚造成好多地方重复调用以至于乱调用，若觉得难以入眼，不要喷我，你可以选择出门右转，谢谢！