微信小程序音频后台播放功能

微信小程序在手机息屏后依旧能播放音频,需要使用 wx.getBackgroundAudioManager() 方法创建后台音乐播放器,并将音乐播放任务交给这个后台播放器。

具体实现步骤如下:

小程序页面中,使用 wx.getBackgroundAudioManager() 方法创建后台音乐播放器实例。

const backgroundAudioManager = wx.getBackgroundAudioManager();

设置音乐播放器的 src 属性为音频文件的地址,并调用 play() 方法开始播放音乐。

backgroundAudioManager.src = '音频文件地址';
backgroundAudioManager.title = '音频标题';
backgroundAudioManager.coverImgUrl = '音频封面地址';
backgroundAudioManager.play();

在播放过程中,如果用户将手机屏幕锁定或者切换到其他应用程序,音乐播放器会自动转为后台播放状态。

如果需要在后台播放音频时显示通知栏信息、响应用户的操作等功能,还需要在小程序的 app.json 文件中进行设置,如下所示:

{"window": {"backgroundTextStyle": "light","navigationBarBackgroundColor": "#fff","navigationBarTitleText": "小程序标题","navigationBarTextStyle": "black"},"requiredBackgroundModes": ["audio"]
}

设置 requiredBackgroundModes["audio"],表示需要在后台播放音频时在通知栏显示音乐播放的信息。

以下是实现该功能的示例代码:

1. 在小程序的页面中引入背景音频管理器:

const backgroundAudioManager = wx.getBackgroundAudioManager();

2. 设置音频的播放地址和标题:

backgroundAudioManager.title = '音频标题';
backgroundAudioManager.src = '音频地址';

3. 监听音频播放事件,更新进度条和时长:

backgroundAudioManager.onPlay(() => {// 音频开始播放时触发的事件// 更新进度条和时长的状态
});backgroundAudioManager.onTimeUpdate(() => {// 音频播放进度更新时触发的事件// 更新进度条和时长的状态
});

4. 在页面中显示进度条和时长:

<view>当前播放进度:{{currentTime}}</view>
<view>总时长:{{duration}}</view>

5. 在页面的生命周期函数中监听音频的播放状态:

onShow: function () {backgroundAudioManager.onPlay(() => {// 音频开始播放时触发的事件// 更新进度条和时长的状态});backgroundAudioManager.onTimeUpdate(() => {// 音频播放进度更新时触发的事件// 更新进度条和时长的状态});
},onHide: function () {// 页面隐藏时暂停音频的播放backgroundAudioManager.pause();
}

效果:

以上代码仅为示例,具体实现方式可能根据你的需求有所差异。你可以根据自己的实际情况进行调整和完善

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/77257.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

pandas 筛选数据的 8 个骚操作

日常用Python做数据分析最常用到的就是查询筛选了&#xff0c;按各种条件、各种维度以及组合挑出我们想要的数据&#xff0c;以方便我们分析挖掘。 东哥总结了日常查询和筛选常用的种骚操作&#xff0c;供各位学习参考。本文采用sklearn的boston数据举例介绍。 from sklearn …

jeesite实现excel导入功能(保姆级图文教程)

文章目录 前言一、准备工作1.准备一个excel模板,放入static目录2.application.yml文件中设置文件存储路径3.使用easyexcel插件解析excel数据,pom文件导入easyexcel二、使用步骤1.列表页添加下载模板按钮2.表单页添加文件上传3. 创建excel解析对应实体4.后台完成文件上传代码,…

SoC性能指标ARM内核运算能力

自动驾驶芯片常用的性能评价指标:TOPS,DMIPS,GFLOPS分别说的是啥&#xff1f; TOPS Tera Operation Per Second&#xff0c;表示每秒钟可以进行的操作数量&#xff0c;用于衡量自动驾驶的算力。 众所周知&#xff0c;汽车上最常用的传感器是摄像头&#xff0c;而与之对应的计…

springboot使用freemarker导出word

springboot使用freemarker导出word 一、需求说明二、制作模板文件1.修改word留下占位符并另存为.xml文件2.将xml文件后缀名改为.ftl3.打开ftl文件格式化内容4.将占位符替换成变量 三、代码实现1.引入依赖2.将模板引入resource下3.编写word导出工具包4.创建接口调用 一、需求说明…

Trinitycore学习之在Linux环境上搭建服务器并测试运行

1&#xff1a;准备环境&#xff0c;这里用ubuntu 22.04进行测试&#xff0c;安装环境后为了方便&#xff0c;换源。 注意&#xff1a;这里用的虚拟机&#xff0c;在虚拟机上生成地图信息&#xff0c;地图信息占用内存比较大&#xff0c;我暂时设置磁盘50G进行测试&#xff0c;…

iwebsec靶场 文件包含漏洞通关笔记4-远程文件包含

目录 前言 1.远程文件包含 2.远程文件条件 第03关 远程文件包含 1.打开靶场 2.源码分析 3.本地文件包含渗透 4.远程文件包含渗透 前言 1.远程文件包含 远程文件包含是文件包含漏洞的其中一种。这种漏洞在文件的URI位于其他服务器上并作为参数传递给PHP函数“include”…

【Linux】自制shell

本期我们利用之前学过的知识&#xff0c;写一个shell命令行程序 目录 一、初始代码 二、使用户输入的ls指令带有颜色分类 三、解决cd指令后用户所在路径不变化问题 3.1 chdir函数 四、关于环境变量的问题 一、初始代码 #include<stdio.h> #include<unistd.h…

LINUX 网络管理

目录 一、NetworkManager的特点 二、配置网络 1、使用ip命令临时配置 1&#xff09;查看网卡在网络层的配置信息 2&#xff09;查看网卡在数据链路层的配置信息 3&#xff09;添加或者删除临时的网卡 4&#xff09;禁用和启动指定网卡 2、修改配置文件 3、nmcli命令行…

软件安全研究(四)

文章目录 Fine-Grained Code Clone Detection with Block-Based Splitting of Abstract Syntax Tree文章结构IntroMotivationDefinitionSystemOverviewProcessingVerify Experimentexperimental settingsRQ1RQ2RQ3RQ4RQ5 Fine-Grained Code Clone Detection with Block-Based S…

78 # koa 中间件的实现

上上节实现了上下文的&#xff0c;上一节使用了一下中间件&#xff0c;这一节来实现 koa 的中间件这个洋葱模型。 思路&#xff1a; 储存用户所有的 callback将用户传递的 callback 全部组合起来&#xff08;redux 里的 compose&#xff09;组合成一个线性结构依次执行&#…

Vue3、Vite使用 html2canvas 把Html生成canvas转成图片并保存,以及填坑记录

这两天接到新需求就是生成海报分享&#xff0c;生成的格式虽然是一样的但是自己一点点画显然是不符合我摸鱼人的性格&#xff0c;就找到了html2canvas插件&#xff0c;开始动工。 安装 npm install html2canvas --save文档 options 的参数都在里面按照自己需求使用 https://a…

Union-Find Algorithm-并查集

目录 1.概念 2.并查集的优化 1.路径压缩&#xff08;Path Compression&#xff09; 1&#xff09;隔代压缩&#xff1a; 2&#xff09;完全压缩&#xff1a; 2.按秩合并 1.概念 并查集&#xff1a;用于判断一对元素是否相连&#xff0c;它们的关系是动态添加&#xff08…

nlp系列(7)实体识别(Bert)pytorch

模型介绍 本项目是使用Bert模型来进行文本的实体识别。 Bert模型介绍可以查看这篇文章&#xff1a;nlp系列&#xff08;2&#xff09;文本分类&#xff08;Bert&#xff09;pytorch_bert文本分类_牧子川的博客-CSDN博客 模型结构 Bert模型的模型结构&#xff1a; 数据介绍 …

骨传导耳机的危害有哪些?会损害听力吗?

如果正常的使用&#xff0c;骨传导耳机是没有危害的&#xff0c;由于骨传导耳机独特的传声方式&#xff0c;所以并不会对人体造成损伤&#xff0c;还可以在一定程度上保护听力。 如果想更具体知道骨传导耳机有什么危害&#xff0c;就要先了解什么是骨传导耳机&#xff0c;骨传…

小程序自定义tabbar

前言 使用小程序默认的tabbar可以满足常规开发&#xff0c;但是满足不了个性化需求&#xff0c;如果想个性化开发就需要用到自定义tabbar,以下图为例子 一、在app.json配置 先按照以往默认的形式配置&#xff0c;如果中间的样式特殊则不需要配置 "tabBar": {&qu…

来可LCWLAN-600P产品使用和常见问题说明

01LCWLAN-600P简介 LCWLAN-600P是来可电子最新生产的一款CAN转WiFi设备&#xff0c;该设备的主要功能是将CAN数据转换成网络数据并通过无线网络转发出去。设备支持8~30V宽压供电&#xff0c;出厂默认配置为AP模式&#xff0c;设备供电后可在电脑的WiFi搜索栏搜索到名称为LCWLA…

【Linux-Day10-信号量,共享内存,消息队列】

信号量 信号量描述 信号量是一个特殊的变量&#xff0c;一般取正数值。它的值代表允许访问的资源数目&#xff0c;获取资源 时&#xff0c;需要对信号量的值进行原子减一&#xff0c;该操作被称为 P 操作。 当信号量值为 0 时&#xff0c;代表没有资源可用&#xff0c;P 操作…

2022年全国研究生数学建模竞赛华为杯B题方形件组批优化问题求解全过程文档及程序

2022年全国研究生数学建模竞赛华为杯 B题 方形件组批优化问题 原题再现&#xff1a; 背景介绍   智能制造被“中国制造2025”列为主攻方向, 而个性化定制、更短的产品及系统生命周期、互联互通的服务模式等成为目前企业在智能制造转型中的主要竞争点。以离散行业中的产品为…

20230912java面经整理

1.gc算法有哪些 引用计数&#xff08;循环引用&#xff09;和可达性分析找到无用的对象 标记-清除&#xff1a;简单&#xff0c;内存碎片&#xff0c;大对象找不到空间 标记-复制&#xff1a;分成两半&#xff0c;清理一半&#xff0c;没有碎片&#xff0c;如果存活多效率低&a…

Python之离线安装第三方库

1、场景介绍 在一些服务器上&#xff0c;我们搭建完Python环境之后&#xff0c;因为服务器的网络限制原因&#xff0c;不能直接通过pip命令下载安装Python的依赖包。 因此&#xff0c;我们需要在可以正常上网的服务器上下载好所需的依赖包文件&#xff0c;然后拷贝到目标服务器…