1.效果图如下:

2.代码如下:

//index.js
//获取应用实例
var app = getApp()
Page({
data: {
motto: 'Hello World',
userInfo: {}
},
//事件处理函数
bindViewTap: function() {
wx.navigateTo({
url: '../logs/logs'
})
},
onLoad: function () {
console.log('onLoad')
var that = this
//调用应用实例的方法获取全局数据
app.getUserInfo(function(userInfo){
//更新数据
that.setData({
userInfo:userInfo
})
})
}, play: function() {
console.log("播放")
wx.playBackgroundAudio({
dataUrl: 'http://ws.stream.qqmusic.qq.com/M500001VfvsJ21xFqb.mp3?guid=ffffffff82def4af4b12b3cd9337d5e7&uin=346897220&vkey=6292F51E1E384E06DCBDC9AB7C49FD713D632D313AC4858BACB8DDD29067D3C601481D36E62053BF8DFEAF74C0A5CCFADD6471160CAF3E6A&fromtag=46',
title: '',
coverImgUrl: ''
})
}, pause: function() {
console.log("暂停")
wx.pauseBackgroundAudio({
success: function(res){
// success
console.log(res)
},
fail: function() {
// fail
},
complete: function() {
// complete
}
})
} })

详细的可以参看文档学习哟!!!

https://mp.weixin.qq.com/debug/wxadoc/dev/api/media-background-audio.html

微信小程序---音乐播放和控制的更多相关文章

  1. 微信小程序音乐播放

    最近在写一个艾美食艾音乐的微信小程序,其中有用到音乐播放的功能,基本播放切换功能已经实现,但是在反复切换歌曲.重新进入歌曲以及单曲循环.列表循环的测试过程中还是发生了bug,特此写一篇文章,捋一下思路 ...

  2. 微信小程序音乐播放器

    写在前面 1.入门几天小白的作品,希望为您有帮助,有好的意见或简易烦请赐教 2.微信小程序审核音乐类别已经下架,想要发布选题需慎重.附一个参考链接,感谢https://www.hishop.com.c ...

  3. 微信小程序音乐播放器组件

    wxml <image bindtap="click" src="{{isPlay?'/images/':'/images/'}}"/> JS Pa ...

  4. 微信小程序音频播放 InnerAudioContext 的用法

    今天项目上涉及到了微信小程序播放音频功能,所以今天跟着一些教程做了个简单的播放器 1.实现思路 刚开始想着有没有现成的组件可以直接用,找到了微信的媒体组件 audio,奈何看着 1.6.0版本开始,该 ...

  5. 微信小程序调用蓝牙功能控制车位锁

    第一次学用微信小程序,项目需要,被逼着研究了一下,功能是调用微信小程序的蓝牙功能,连接上智能车位锁,控制升降,大概步骤及调用的小程序接口API如下: 1.打开蓝牙模块 wx.openBluetooth ...

  6. 微信小程序——音频播放器

    先来个效果图韵下味: 需求: 音频的播放,暂停,中间按钮状态的变化,播放时实时更新播放进度: 前进15s,后退15s: 进度条拖动. 一开始想着这3个功能应该挺简单的.不就是播放,暂停,前进,后退么~ ...

  7. 微信小程序 - 音频播放(1.2版本和1.2版本之后)

    不多说了,直接贴code // 1.2版本以后便不在维护 wx.getBackgroundAudioManager({ success:function(res){ var status =res.s ...

  8. 微信小程序实例源码大全

    微信小程序实例源码大全下载 微信小应用示例代码(phodal/weapp-quick)源码链接:https://github.com/phodal/weapp-quick 微信小应用地图定位demo( ...

  9. 微信小程序源码推荐

    wx-gesture-lock  微信小程序的手势密码 WXCustomSwitch 微信小程序自定义 Switch 组件模板 WeixinAppBdNovel 微信小程序demo:百度小说搜索 sh ...

随机推荐

  1. linux PHP空间设置GZIP压缩网页方法!

    网站设置GZIP压缩,缩小网页体积,让网站访问速度更快!方法很简单,只需要在你的网站根目录建立.htaccess文件并输入以下代码: 新建-记事本-复制以下代码:(如果网站已有.htaccess文件, ...

  2. uestc summer training #2

    A 增广 #include<bits/stdc++.h> using namespace std; + ; vector<int> g[MAXN]; int a[MAXN], ...

  3. MySQL显示ERROR 2003 (HY000): Can't connect to MySQL server on 'localhost' (10061)解决方法

    MySQL显示ERROR 2003 (HY000): Can't connect to MySQL server on 'localhost' (10061)解决方法 2.4K 解决方法: 第一步cd ...

  4. grunt-contrib-jshint js代码检查

    grunt-contrib-jshint:用于javascript代码检查(并会给出建议),发布js代码前执行jshint任务, 可以避免出现一些低级语法问题jshint拥有非常丰富的配置,可以自由控 ...

  5. Flask之请求上下文流程图

    整理一下Flask请求上下文流程导思流程图,如果错误,请指出.

  6. Linux 系统中 grep 的ABC参数含义

    1.grep  -A  5   匹配行及后5行 2.grep  -B  5   匹配行及前5行 3.grep  -C  5   匹配行及前后各5行

  7. Window 环境升级node版本

    https://github.com/Kenshin/gnvm 下载gnvm,安装在node文件目录下 gnvm version 然后打开cmd命令行窗口,输入:gnvm update latest, ...

  8. CF 672C 两个人捡瓶子 最短路与次短路思想

    C. Recycling Bottles time limit per test 2 seconds memory limit per test 256 megabytes input standar ...

  9. 【BZOJ4456】 [Zjoi2016]旅行者 / 【UOJ #184】 【ZJOI2016】旅行者

    Description 小Y来到了一个新的城市旅行.她发现了这个城市的布局是网格状的,也就是有n条从东到西的道路和m条从南到北 的道路,这些道路两两相交形成n×m个路口 (i,j)(1≤i≤n,1≤j ...

  10. websocket协议解决消息发送问题 Could not decode a text frame as UTF-8.

    在使用websocket 时出现了Could not decode a text frame as UTF-8 首次连接成功当发送消息时,出现了编码作错误 第一请求页面时,连接成功 当发送消息时,不加 ...