当前位置: 首页 > news >正文

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

微信小程序在手机息屏后依旧能播放音频,需要使用 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();
}

效果:

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

相关文章:

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

微信小程序在手机息屏后依旧能播放音频&#xff0c;需要使用 wx.getBackgroundAudioManager() 方法创建后台音乐播放器&#xff0c;并将音乐播放任务交给这个后台播放器。 具体实现步骤如下&#xff1a; 小程序页面中&#xff0c;使用 wx.getBackgroundAudioManager() 方法创…...

NotePad——xml格式化插件xml tools在线安装+离线安装

在使用NotePad时&#xff0c;在某些情形下&#xff0c;需要格式化Xml格式内容&#xff0c;可以使用Xml Tools插件。 一、在线安装 1. 打开Notepad 软件 2. 选择插件&#xff0c;选择“插件管理” 3. 搜索 XML Tools&#xff0c;找到该插件后&#xff0c;勾选该文件&#xff…...

图书管理系统 数据结构先导课暨C语言大作业复习 | JorbanS

问题描述 读取给定的图书文件book.txt中的信息&#xff08;book.txt中部分图书信息如下图所示&#xff09;&#xff0c;完成一个图书信息管理系统&#xff0c;该系统的各个功能模块要求利用菜单选项进行选择。 系统功能要求 图书浏览 读取book.txt中的文件信息并依次输出所…...

python 爬虫的开发环境配置

1、新建一个python项目 2、在控制台中分别安装下面三个包 pip install requests pip install beautifulsoup4 pip install selenium/ 如果安装时报以下错误&#xff1a; raise ReadTimeoutError(self._pool, None, "Read timed out.") pip._vendor.urllib3.exceptio…...

技术架构图是什么?和业务架构图的区别是什么?

技术架构图是什么&#xff1f; ​技术架构图是一种图形化工具&#xff0c;用于呈现软件、系统或应用程序的技术层面设计和结构。它展示了系统的各种技术组件、模块、服务以及它们之间的关系和交互方式。技术架构图关注系统内部的技术实现细节&#xff0c;以及各个技术组件之…...

数据增强

一、数据增强 当你训练一个机器学习模型时&#xff0c;你实际做工作的是调参&#xff0c;以便将特定的输入&#xff08;一副图像&#xff09;映像到输出&#xff08;标签&#xff09;。我们优化的目标是使模型的损失最小化&#xff0c; 以正确的方式调节优化参数即可实现这一目…...

【Unity】2D 对话模块的实现

对话模块主要参考 【Unity教程】剧情对话系统 实现。 在这次模块的构建将基于 unity ui 组件 和 C#代码实现一个从excel 文件中按照相应规则读取数据并展示的逻辑。这套代码不仅能实现正常的对话&#xff0c;也实现了对话中可以通过选择不同选项达到不同效果的分支对话功能。 …...

laravel安装初步使用学习 composer安装

一、什么是laravel框架 Laravel框架可以开发各种不同类型的项目&#xff0c;内容管理系统&#xff08;Content Management System&#xff0c;CMS&#xff09;是一种比较典型的项目&#xff0c;常见的网站类型&#xff08;如门户、新闻、博客、文章等&#xff09;都可以利用CM…...

【VS插件】VS code上的Remote - SSH

【VS插件】VS code上的Remote - SSH 目录 【VS插件】VS code上的Remote - SSH获得Linux服务器或者Linux系统的IP地址下载插件远程登录注意如果Linux虚拟机系统无法连接成功可能是没有开启ssh服务优势 作者&#xff1a;爱写代码的刚子 时间&#xff1a;2023.9.12 前言&#xff1…...

TensorFlow 02(张量)

一、张量 张量Tensor 张量是一个多维数组。与NumPy ndarray对象类似&#xff0c;tf.Tensor对象也具有数据类型和形状。如下图所示: 此外&#xff0c;tf.Tensors可以保留在GPU中。TensorFlow提供了丰富的操作库 (tf.add&#xff0c;tf.matmul,tf.linalg.inv等)&#xff0c;它们…...

513. 找树左下角的值

代码链接&#xff1a; 力扣&#xff08;LeetCode&#xff09;官网 - 全球极客挚爱的技术成长平台 思路&#xff1a; 万金油层次遍历&#xff0c;保存每一层的第一个元素返回就行了 我的代码&#xff1a; /*** Definition for a binary tree node.* struct TreeNode {* …...

量化:基于支持向量机的择时策略

文章目录 参考机器学习简介策略简介SVM简介整体流程收集数据准备数据建立模型训练模型测试模型调节参数 参考 Python机器学习算法与量化交易 利用机器学习模型&#xff0c;构建量化择时策略 机器学习简介 机器学习理论主要是设计和分析一些让计算机可以自动“学习”的算法。…...

成功解决Selenium 中116版本的chromedriver找不到问题

Selenium 中的Google&#xff08;谷歌浏览器&#xff09;最新版本chromedriver 文章目录 Selenium 中的Google&#xff08;谷歌浏览器&#xff09;最新版本chromedriver1.当前作者的谷歌浏览器版本2.当前驱动官网的最新版本3.当不想降低浏览器版本继续使用谷歌浏览器的办法 1.当…...

PYQT常用组件--方法汇总

QTimeEdit timeEdit是Qt框架中的一个时间编辑器控件&#xff0c;它提供了以下常用方法&#xff1a; setTime(QTime time): 设置时间编辑器的时间为指定的QTime对象。time(): 返回时间编辑器的当前时间&#xff0c;返回一个QTime对象。setDateTime(QDateTime dateTime): 设置时…...

Linux系统编程(一):文件 I/O

参考引用 UNIX 环境高级编程 (第3版)黑马程序员-Linux 系统编程 1. UNIX 基础知识 1.1 UNIX 体系结构&#xff08;下图所示&#xff09; 从严格意义上说&#xff0c;可将操作系统定义为一种软件&#xff0c;它控制计算机硬件资源&#xff0c;提供程序运行环境&#xff0c;通常…...

OSM+three.js打造3D城市

对于我在 Howest 的研究项目,我决定构建一个 3D 版本的 Lucas Bebber 的“交互式讲故事的动画地图路径”项目。我将使用 OSM 中的矢量轮廓来挤出建筑物的形状并将它们添加到 3js 场景中,随后我将对其进行动画处理。 一、开发环境 为了使用 Node 和 npm 包,我选择使用 Vite…...

02JVM_垃圾回收GC

二、垃圾回收GC 在堆里面存放着java的所有对象实例&#xff0c;当对象为“死去”&#xff0c;也就是不再使用的对象&#xff0c;就会进行垃圾回收GC 1.如何判断对象可以回收 1.1引用计数器 介绍 在对象中添加一个引用计数器&#xff0c;当一个对象被其他变量引用时这个对象…...

ARM Linux DIY(八)USB 调试

前言 V3s 带有一个 USB 接口&#xff0c;将其设置为 HOST 或 OTG 模式&#xff0c;这样可以用来接入键盘、鼠标等 USB 外设。 USB 简介 USB 有两种设备&#xff1a;HOST 和 USB 功能设备。 在 USB2.0 中又引入了一个新的概念 OTG&#xff0c;即设备角色可以动态切换。 切换方…...

编程小白的自学笔记十四(python办公自动化创建、复制、移动文件和文件夹)

系列文章目录 编程小白的自学笔记十三&#xff08;python办公自动化读写文件&#xff09; 编程小白的自学笔记十二&#xff08;python爬虫入门四Selenium的使用实例二&#xff09; 编程小白的自学笔记十一&#xff08;python爬虫入门三Selenium的使用实例详解&#xff09; …...

MySQL使用Xtrabackup备份到AWS存储桶

1.安装Xtrabackup cd /tmp wget https://downloads.percona.com/downloads/Percona-XtraBackup-8.0/Percona-XtraBackup-8.0.33-28/binary/redhat/7/x86_64/percona-xtrabackup-80-8.0.33-28.1.el7.x86_64.rpm yum -y localinstall percona-xtrabackup-80-8.0.33-28.1.el7.x86…...

Linux应用开发之网络套接字编程(实例篇)

服务端与客户端单连接 服务端代码 #include <sys/socket.h> #include <sys/types.h> #include <netinet/in.h> #include <stdio.h> #include <stdlib.h> #include <string.h> #include <arpa/inet.h> #include <pthread.h> …...

vscode里如何用git

打开vs终端执行如下&#xff1a; 1 初始化 Git 仓库&#xff08;如果尚未初始化&#xff09; git init 2 添加文件到 Git 仓库 git add . 3 使用 git commit 命令来提交你的更改。确保在提交时加上一个有用的消息。 git commit -m "备注信息" 4 …...

数据链路层的主要功能是什么

数据链路层&#xff08;OSI模型第2层&#xff09;的核心功能是在相邻网络节点&#xff08;如交换机、主机&#xff09;间提供可靠的数据帧传输服务&#xff0c;主要职责包括&#xff1a; &#x1f511; 核心功能详解&#xff1a; 帧封装与解封装 封装&#xff1a; 将网络层下发…...

2025 后端自学UNIAPP【项目实战:旅游项目】6、我的收藏页面

代码框架视图 1、先添加一个获取收藏景点的列表请求 【在文件my_api.js文件中添加】 // 引入公共的请求封装 import http from ./my_http.js// 登录接口&#xff08;适配服务端返回 Token&#xff09; export const login async (code, avatar) > {const res await http…...

自然语言处理——循环神经网络

自然语言处理——循环神经网络 循环神经网络应用到基于机器学习的自然语言处理任务序列到类别同步的序列到序列模式异步的序列到序列模式 参数学习和长程依赖问题基于门控的循环神经网络门控循环单元&#xff08;GRU&#xff09;长短期记忆神经网络&#xff08;LSTM&#xff09…...

Linux --进程控制

本文从以下五个方面来初步认识进程控制&#xff1a; 目录 进程创建 进程终止 进程等待 进程替换 模拟实现一个微型shell 进程创建 在Linux系统中我们可以在一个进程使用系统调用fork()来创建子进程&#xff0c;创建出来的进程就是子进程&#xff0c;原来的进程为父进程。…...

HDFS分布式存储 zookeeper

hadoop介绍 狭义上hadoop是指apache的一款开源软件 用java语言实现开源框架&#xff0c;允许使用简单的变成模型跨计算机对大型集群进行分布式处理&#xff08;1.海量的数据存储 2.海量数据的计算&#xff09;Hadoop核心组件 hdfs&#xff08;分布式文件存储系统&#xff09;&a…...

Aspose.PDF 限制绕过方案:Java 字节码技术实战分享(仅供学习)

Aspose.PDF 限制绕过方案&#xff1a;Java 字节码技术实战分享&#xff08;仅供学习&#xff09; 一、Aspose.PDF 简介二、说明&#xff08;⚠️仅供学习与研究使用&#xff09;三、技术流程总览四、准备工作1. 下载 Jar 包2. Maven 项目依赖配置 五、字节码修改实现代码&#…...

Java毕业设计:WML信息查询与后端信息发布系统开发

JAVAWML信息查询与后端信息发布系统实现 一、系统概述 本系统基于Java和WML(无线标记语言)技术开发&#xff0c;实现了移动设备上的信息查询与后端信息发布功能。系统采用B/S架构&#xff0c;服务器端使用Java Servlet处理请求&#xff0c;数据库采用MySQL存储信息&#xff0…...

[免费]微信小程序问卷调查系统(SpringBoot后端+Vue管理端)【论文+源码+SQL脚本】

大家好&#xff0c;我是java1234_小锋老师&#xff0c;看到一个不错的微信小程序问卷调查系统(SpringBoot后端Vue管理端)【论文源码SQL脚本】&#xff0c;分享下哈。 项目视频演示 【免费】微信小程序问卷调查系统(SpringBoot后端Vue管理端) Java毕业设计_哔哩哔哩_bilibili 项…...