项目准备
1.vue
2.bootstrap
3.axios
音乐接口
1:歌曲搜索接口
请求地址:https://autumnfish.cn/search
请求方法:get
请求参数:keywords(查询关键字)
响应内容:歌曲搜索结果
2:歌曲url获取接口
请求地址: https://api.imjad.cn/cloudmusic/?type=url&id=
请求方法:get
请求参数:id(歌曲id)
响应内容:歌曲url地址
3.歌曲详情获取
请求地址:https://api.imjad.cn/cloudmusic/?type=detail&id=
请求方法:get
请求参数:ids(歌曲id)
响应内容:歌曲详情(包括封面信息)
4.热门评论获取
请求地址:https://autumnfish.cn/comment/hot?type=0
请求方法:get
请求参数:id(歌曲id,地址中的type固定为0)
响应内容:歌曲的热门评论
5.mv地址获取
请求地址:https://autumnfish.cn/mv/url
请求方法:get
请求参数:id(mvid,为0表示没有mv)
响应内容:mv的地址
项目功能
1.歌曲搜索
v-on:click,@keyup.enter
v-medel获取到input搜索框搜索的内容,axios方法调用接口数据,数据赋值时使用箭头函数,v-for渲染到页面(v-for中使用)
2.播放音乐
为歌曲列表单曲li添加点击事件,通过接口获取到url,使用v-bind渲染src地址到audio
3.歌曲详情获取
主要获取歌曲封面,与播放音乐同理
4.热门评论
5.mv播放
图示
标签:请求,get,音乐,地址,歌曲,id,cn 来源: https://www.cnblogs.com/mywifeisMsHu/p/15515677.html
本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享; 2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关; 3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关; 4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除; 5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。