音乐小程序服务器端代码,QQ音乐微信小程序实例代码

想做一个功能齐全的类似QQ音乐的微信小程序,demo来了,可供大家参考,包含音乐搜索、音乐列表及播放停止

示例代码:

var util = require('../../utils/util.js')var app = getApp()Page({ data: { playingSong: {}, songUrl: '', songImg: '', songState: { progress: 0, currentPosition: '00:00', duration: '00:00' }, isPlaying: true, lyric: '' }, onLoad: function(){ console.log('playsong onLoad'); let that = this; let songdata = app.globalData.songData; that.setData({ playingSong: songdata, songUrl: 'http://ws.stream.qqmusic.qq.com/C100' + songdata.songmid + '.m4a?fromtag=38', songImg: 'http://y.gtimg.cn/music/photo_new/T002R150x150M000' + songdata.albummid + '.jpg', }); let thatData = that.data; wx.playBackgroundAudio({ dataUrl: thatData.songUrl, title: thatData.playingSong.songname, coverImgUrl: thatData.songImg, success: function(res){ //do something } }); }, onReady: function(){ console.log('playsong onReady'); let that = this; that.songPlay(); wx.onBackgroundAudioPlay(function(){ console.log('播放了'); that.songPlay(); }); }, timeToString: function(duration){ let str = ''; let minute = parseInt(duration/60) < 10 ? ('0'+ parseInt(duration/60)) : (parseInt(duration/60)); let second = duration%60 < 10 ? ('0'+duration%60) : (duration%60); str = minute+':'+second; return str; }, songPlay: function(){ let that = this; let inv = setInterval(function(){ wx.getBackgroundAudioPlayerState({ success: function(res){ if(res.status == 1){ that.setData({ isPlaying: true, songState: { progress: res.currentPosition/res.duration*100, currentPosition: that.timeToString(res.currentPosition), duration: that.timeToString(res.duration) } }) }else{ that.setData({ isPlaying: false }); clearInterval(inv); } } }); }, 1000); }, songToggle: function(){ let that = this; if(that.data.isPlaying){ wx.pauseBackgroundAudio(); }else{ wx.playBackgroundAudio({ title: that.data.playingSong.songname, coverImgUrl: that.data.songImg }); }; that.songPlay(); }})

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
微信小程序是一种在微信平台上开发的应用程序,可以在微信中直接使用。模仿qq音乐的源代码是指参考qq音乐的功能和布局,通过编写代码实现类似的音乐播放、搜索、推荐等功能。 首先,我会创建一个基本的小程序框架,包括首页、搜索页、播放页面等。在首页上,我会通过接口获取推荐的音乐列表,并展示在页面上。用户可以点击音乐列表中的歌曲,进入播放页面。 在播放页面上,我会显示歌曲的封面、歌曲名和歌手名,并添加播放控制按钮,如暂停、播放、上一曲、下一曲等。同时,我会实现进度条来显示当前歌曲的播放进度,并可以通过拖动来调整播放进度。 在搜索页面上,用户可以输入关键词进行音乐搜索。我会通过接口请求来获取相关的搜索结果,并展示在页面上。用户可以点击搜索结果中的歌曲,进入播放页面进行播放。 另外,为了提供更好的用户体验,我会在小程序中添加一些附加功能,如歌曲收藏、歌曲分享等。用户可以收藏自己喜欢的歌曲,方便以后再次播放。同时,用户也可以将自己喜欢的歌曲分享到朋友圈或其他社交平台上。 总之,通过模仿qq音乐的源代码,我会在微信小程序中实现类似的音乐播放、搜索、推荐等功能,并努力提供更好的用户体验。希望用户们能够享受到方便、快捷的音乐服务。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值