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

微信小程序:播放音频

在小程序开发中,音频播放是一个重要的功能。本文将详细介绍小程序音频播放的相关知识点,帮助开发者更好地掌握小程序音频播放的实现方法。


一、小程序音频播放的基本流程
在小程序中,音频播放的基本流程如下:

  1. 获取音频数据:通过wx.chooseMessageSound或wx.createInnerAudioContext等方法获取到音频数据。
  2. 创建音频播放器:使用wx.createInnerAudioContext对象来创建音频播放器,设置相关属性并启动播放。
  3. 控制音频播放:通过wx.innerAudioContext对象的属性和方法来控制音频播放,如暂停、继续、停止等操作。
  4. 监听音频播放事件:通过监听audio对象的事件,可以获取到音频播放的状态、进度等信息。
    二、小程序音频播放的核心API
  5. wx.chooseMessageSound()
    该方法用于选择系统消息声音,并返回一个AudioContext对象,可以通过该对象来控制音频的播放。
  6. wx.innerAudioContext()
    该方法用于创建一个内部音频上下文对象,可以通过该对象来控制音频的播放。
  7. wx.onInnerAudioPlay() / wx.onInnerAudioEnd()
    这两个方法分别用于监听内部音频播放开始和结束事件。
  8. wx.innerAudioContext().src / wx.innerAudioContext().play() / wx.innerAudioContext().pause() / wx.innerAudioContext().stop()
    这些方法分别用于设置音频源、启动播放、暂停播放、停止播放等操作。
    三、小程序音频播放的实例代码
    以下是一个简单的示例代码,演示了如何在小程序中实现音频播放功能:

 index.wxml

<!--index.wxml-->
<scroll-view class="scrollarea" scroll-y type="list"><view class="container"><button bind:tap="bindPlay">播放</button><button bind:tap="bindPause">暂停</button><button bind:tap="bindStop">停止</button><button bind:tap="bindDestroy">重播</button></view>
</scroll-view>

index.js

// index.js
Page({data: {innerAudioContext:{}},onLoad(){this.innerAudioContext = wx.createInnerAudioContext({useWebAudioImplement: false // 是否使用 WebAudio 作为底层音频驱动,默认关闭。对于短音频、播放频繁的音频建议开启此选项,开启后将获得更优的性能表现。由于开启此选项后也会带来一定的内存增长,因此对于长音频建议关闭此选项})this.innerAudioContext.src = 'https://hanyu-poem-mp3.cdn.bcebos.com/38a52978fb6f4cfd8bcc25fc2db2c0fa.mp3'},bindPlay(){this.innerAudioContext.play() // 播放},bindPause(){this.innerAudioContext.pause() // 暂停},bindStop(){this.innerAudioContext.stop() // 停止},bindDestroy(){//InnerAudioContext 音频资源不会自动释放,因此如果不再需要使用音频,请及时调用 this.innerAudioContext.destroy() // 释放音频资源,避免内存泄漏。}
})

在data中定义了一个audioUrl变量是音频文件的URL地址。然后在onLoad方法中,我们创建了一个内部音频上下文对象audioContext,并设置其音频源为audioUrl。接着,我们通过监听audioContext的onPlay和onError事件,分别获取到音频开始播放和播放错误的信息。最后,我们调用audioContext的play方法启动音频的播放。 

    结尾:样例小程序二维码,自己做的一个免费好用的排班小程序

相关文章:

微信小程序:播放音频

在小程序开发中&#xff0c;音频播放是一个重要的功能。本文将详细介绍小程序音频播放的相关知识点&#xff0c;帮助开发者更好地掌握小程序音频播放的实现方法。 一、小程序音频播放的基本流程 在小程序中&#xff0c;音频播放的基本流程如下&#xff1a; 获取音频数据&#…...

Ubuntu安装K8S

第一步&#xff1a; 安装docker Install Docker #注意docker是早期的名称已经过时了&#xff0c;因此请使用如下命令&#xff0c;一步到位安装docker-ce。 第二步&#xff1a;设置K8S源&#xff1a; &#xff08;大陆使用aliyun源&#xff0c;大陆外使用google源&#xff09;…...

独立同分布时,联合概率密度函数等于边缘概率密度函数乘积

在概率论中&#xff0c;独立同分布&#xff08;i.i.d.&#xff09;指的是多个随机变量既独立又服从相同的概率分布。对于一组随机变量 (X_1, X_2, \dots, X_n)&#xff0c;若它们是独立同分布的&#xff0c;那么它们的联合概率密度函数 (p(x_1, x_2, \dots, x_n)) 就可以表示为…...

半导体数据分析: 玩转WM-811K Wafermap 数据集(三) AI 机器学习

前面我们已经通过两篇文章&#xff0c;一起熟悉了WM-811K Wafermap 数据集&#xff0c;并对其中的一些数据进行了调用&#xff0c;生成了一些统计信息和图片。今天我们接着继续往前走。 半导体数据分析&#xff1a; 玩转WM-811K Wafermap 数据集&#xff08;二&#xff09; AI…...

【.net core】【sqlsugar】时间查询示例

1、时间包含查询示例 //model.TimeInterval为时间区间参数&#xff0c;参数格式为2024-01-01~2025-01-01 //query为当前查询的语句内容 //为当前查询语句增加创建时间模糊搜索查询条件 query query.Where(a > ((DateTime)a.F_CreatorTime).ToString("yyyy-MM-dd HH:m…...

Kotlin 协程基础十 —— 协作、互斥锁与共享变量

Kotlin 协程基础系列&#xff1a; Kotlin 协程基础一 —— 总体知识概述 Kotlin 协程基础二 —— 结构化并发&#xff08;一&#xff09; Kotlin 协程基础三 —— 结构化并发&#xff08;二&#xff09; Kotlin 协程基础四 —— CoroutineScope 与 CoroutineContext Kotlin 协程…...

Java中网络编程的学习

目录 网络编程概述 网络模型 网络通信三要素: IP 端口号 通信协议 IP地址&#xff08;Internet Protocol Address&#xff09; 端口号 网络通信协议 TCP 三次握手 四次挥手 UDP TCP编程 客户端Socket的工作过程包含以下四个基本的步骤&#xff1a; 服务器程序…...

[计算机网络]一. 计算机网络概论第一部分

作者申明&#xff1a;作者所有文章借助了各个渠道的图片视频以及资料&#xff0c;在此致谢。作者所有文章不用于盈利&#xff0c;只是用于个人学习。 1.0推荐动画 【网络】半小时看懂<计算机网络>_哔哩哔哩_bilibili 1.1计算机网络在信息时代的作用 在当今信息时代&…...

【0393】Postgres内核 checkpointer process ③ 构建 WAL records 工作缓存区

1. 初始化 ThisTimeLineID、RedoRecPtr 函数 InitXLOGAccess() 内部会初始化 ThisTimeLineID、wal_segment_size、doPageWrites 和 RedoRecPtr 等全局变量。 下面是这四个变量初始化前的值: (gdb) p ThisTimeLineID $125 = 0 (gdb) p wal_segment_size $126 = 16777216 (gdb…...

正则表达式基础知识及grep、sed、awk常用命令

文章目录 前言一、正则表达式元字符和特性1. 字符匹配2. 量词3. 字符类4. 边界匹配5. 分词和捕获6. 特殊字符7. 位置锚定 二、grep常用参数1. -n额外输出行号2. -v 排除匹配的行3. -E 支持扩展正则匹配4. -e进行多规则匹配搜索5. -R 递归匹配目录中的文件内容6. -r递归地搜索目…...

redhat安装docker 24.0.7

1、下载docker镜像包 wget https://download.docker.com/linux/static/stable/x86_64/docker-24.0.7.tgz 2、解压 tar -xvf docker-24.0.7.tgz 3、解压的docker文件夹全部移动至/usr/bin目录 cd docker cp -p docker/* /usr/bin 4、注册服务 vi /usr/lib/systemd/syste…...

【excel】VBA简介(Visual Basic for Applications)

文章目录 一、基本概念二、语法2.1 数据类型2.11 基本数据类型2.12 常量2.13 数组 2.2 控制语句2.21 条件语句2.22 循环语句2.23 错误处理&#xff1a;On Error2.24 逻辑运算 2.3 其它语句2.31 注释2.32 with语句 2.4 表达式2.41 常见表达式类型2.42 表达式的优先级 2.5 VBA 的…...

【大厂面试AI算法题中的知识点】方向涉及:ML/DL/CV/NLP/大数据...本篇介绍为什么self-attention可以堆叠多层,这有什么作用?

【大厂面试AI算法题中的知识点】方向涉及&#xff1a;ML/DL/CV/NLP/大数据…本篇介绍为什么self-attention可以堆叠多层&#xff0c;这有什么作用&#xff1f; 【大厂面试AI算法题中的知识点】方向涉及&#xff1a;ML/DL/CV/NLP/大数据…本篇介绍为什么self-attention可以堆叠…...

NanoKVM简单开箱测评和拆解,让普通电脑实现BMC/IPMI远程管理功能

Sipeed推出了NanoKVM&#xff0c;简直是没有BMC的台式机和工作站的福音。有了这个就可以轻松实现以往服务器才有的远程管理功能。 NanoKVM 简介 Lichee NanoKVM 是基于 LicheeRV Nano 的 IP-KVM 产品&#xff0c;继承了 LicheeRV Nano 的极致体积 和 强大功能。 NanoKVM 包含…...

【Idea】编译Spring源码 read timeout 问题

Idea现在是大家工作中用的比较多的开发工具&#xff0c;尤其是做java开发的&#xff0c;那么做java开发&#xff0c;了解spring框架源码是提高自己技能水平的一个方式&#xff0c;所以会从spring 官网下载源码&#xff0c;导入到 Idea 工具并编译&#xff0c;但是发现build的时…...

VSCode的配置与使用(C/C++)

从0开始教你在vscode调试一个C文件 一.首先是配置你的编译环境&#xff0c;添加到环境变量&#xff08;默认你是全新的电脑&#xff0c;没有安装vs2019之类的&#xff09; 原因&#xff1a;因为相比于vs2019&#xff0c;vscode只是个代码编辑器&#xff0c;相当于一个彩色的、…...

SpringMVC (1)

目录 1. 什么是Spring Web MVC 1.1 MVC的定义 1.2 什么是Spring MVC 1.3 Spring Boot 1.3.1 创建一个Spring Boot项目 1.3.2 Spring Boot和Spring MVC之间的关系 2. 学习Spring MVC 2.1 SpringBoot 启动类 2.2 建立连接 1. 什么是Spring Web MVC 1.1 MVC的定义 MVC 是…...

本地部署大模型—MiniCPM-V 2.0: 具备领先OCR和理解能力的高效端侧多模态大模型

MiniCPM-V 2.0: 具备领先OCR和理解能力的高效端侧多模态大模型 简介 MiniCPM 系列的最新多模态版本 MiniCPM-V 2.0。该模型基于 [MiniCPM 2.4B和 SigLip-400M 构建,共拥有 2.8B 参数。MiniCPM-V 2.0 具有领先的光学字符识别(OCR)和多模态理解能力。该模型在综合性 OCR 能力…...

国产linux系统(银河麒麟,统信uos)使用 PageOffice 实现后台批量生成PDF文档

PageOffice 国产版 &#xff1a;支持信创系统&#xff0c;支持银河麒麟V10和统信UOS&#xff0c;支持X86&#xff08;intel、兆芯、海光等&#xff09;、ARM&#xff08;飞腾、鲲鹏、麒麟等&#xff09;、龙芯&#xff08;LoogArch&#xff09;芯片架构。 PageOffice 版本&…...

Python 扫描枪读取发票数据导入Excel

财务需要一个扫描枪扫描发票文件&#xff0c;并将主要信息录入Excel 的功能。 文件中sheet表的列名称&#xff0c;依次为&#xff1a;发票编号、发票编码、日期、金额、工号、扫描日期。 扫描的时候&#xff0c;Excel 文件需要关闭&#xff0c;否则会报错。 import openpyxl …...

DFRDisplayKm 实用指南:Apple Touch Bar Windows支持常见问题全解析

DFRDisplayKm 实用指南&#xff1a;Apple Touch Bar Windows支持常见问题全解析 【免费下载链接】DFRDisplayKm Windows infrastructure support for Apple DFR (Touch Bar) 项目地址: https://gitcode.com/gh_mirrors/df/DFRDisplayKm DFRDisplayKm 是一款专为 Windows…...

PyTorch 3.0静态图分布式训练实战指南:从模型切分、通信压缩到GPU显存零冗余,7步上线千卡集群

第一章&#xff1a;PyTorch 3.0静态图分布式训练的演进逻辑与企业级定位PyTorch 3.0并非官方已发布的版本号&#xff08;截至2024年&#xff0c;PyTorch最新稳定版为2.3&#xff09;&#xff0c;但该命名在此语境中特指工业界对“具备生产就绪型静态图能力与原生分布式协同范式…...

ModelScope环境安装避坑指南:从NLP到语音,不同领域模型依赖到底怎么装?

ModelScope环境安装避坑指南&#xff1a;从NLP到语音&#xff0c;不同领域模型依赖到底怎么装&#xff1f; 当你第一次尝试在ModelScope上运行一个语音识别模型时&#xff0c;系统突然报错提示缺少libsndfile库&#xff1b;当你满怀期待地安装CV模型时&#xff0c;却因为mmcv版…...

像素语言传送门效果实测:Hunyuan-MT-7B对中文网络新词(如‘绝绝子‘)的跨语种意译能力

像素语言传送门效果实测&#xff1a;Hunyuan-MT-7B对中文网络新词&#xff08;如绝绝子&#xff09;的跨语种意译能力 1. 测试背景与工具介绍 像素语言跨维传送门是基于腾讯Hunyuan-MT-7B翻译引擎构建的创新翻译工具。与传统翻译软件不同&#xff0c;它将语言转换过程设计成一…...

RePKG:突破动态壁纸资源壁垒的开源工具

RePKG&#xff1a;突破动态壁纸资源壁垒的开源工具 【免费下载链接】repkg Wallpaper engine PKG extractor/TEX to image converter 项目地址: https://gitcode.com/gh_mirrors/re/repkg 当你面对一个包含丰富素材的动态壁纸资源包&#xff08;PKG文件&#xff09;却无…...

Stable Diffusion 2.0超分实战:4倍放大图片还能保持清晰度的秘密

Stable Diffusion 2.0超分实战&#xff1a;4倍放大图片还能保持清晰度的秘密 在数字图像处理领域&#xff0c;超分辨率技术一直是设计师和开发者关注的焦点。传统放大方法往往导致图像模糊、细节丢失&#xff0c;而基于深度学习的超分方案正在改变这一局面。Stable Diffusion 2…...

保姆级万物识别教程:阿里开源镜像快速部署,识别图片超简单

保姆级万物识别教程&#xff1a;阿里开源镜像快速部署&#xff0c;识别图片超简单 1. 开篇&#xff1a;为什么选择这个镜像&#xff1f; 今天给大家介绍一个特别实用的AI工具——阿里开源的"万物识别-中文-通用领域"镜像。这个镜像最大的特点就是简单易用&#xff…...

抖音批量下载工具:高效获取无水印视频与图文内容的全攻略

抖音批量下载工具&#xff1a;高效获取无水印视频与图文内容的全攻略 【免费下载链接】douyin-downloader A practical Douyin downloader for both single-item and profile batch downloads, with progress display, retries, SQLite deduplication, and browser fallback su…...

如何自学使用关键字排名软件_关键字排名软件与SEO有什么关系

如何自学使用关键字排名软件_关键字排名软件与SEO有什么关系 在当今数字化时代&#xff0c;SEO&#xff08;搜索引擎优化&#xff09;已成为每一个网站运营者必不可少的技能。其中&#xff0c;关键字排名软件扮演了极其重要的角色。如何自学使用关键字排名软件呢&#xff1f;关…...

NOR FLASH和NAND FLASH的对比

一、擦写寿命与数据可靠性 FLASH芯片的擦写次数一般来说都是有限的&#xff0c;目前主流产品的擦写寿命普遍在10万次左右。当FLASH芯片接近使用寿命终点时&#xff0c;写操作可能会出现失败。不过&#xff0c;需要注意NAND FLASH采用整块擦写机制&#xff0c;一旦块内出现一位数…...