当前位置:首页 > uni-app

uniapp音频使用

2026-03-05 06:48:33uni-app

uniapp音频使用指南

音频播放

在uniapp中可以通过uni.createInnerAudioContext()创建音频实例,实现播放控制。初始化后设置音频源,调用play()方法开始播放。支持本地和网络音频文件。

const innerAudioContext = uni.createInnerAudioContext();
innerAudioContext.src = 'https://example.com/audio.mp3';
innerAudioContext.play();

音频控制

创建实例后可调用暂停、停止、跳转等方法。通过监听onTimeUpdate事件获取播放进度,使用seek()实现进度跳转。

innerAudioContext.pause(); //暂停
innerAudioContext.stop(); //停止
innerAudioContext.seek(30); //跳转到30秒

事件监听

音频组件提供多种事件监听,包括播放状态变化、错误处理等。建议至少监听onError事件以便处理异常情况。

innerAudioContext.onPlay(() => { console.log('开始播放') });
innerAudioContext.onError((res) => { console.log(res.errMsg) });

音频录制

使用uni.getRecorderManager()获取录音管理器,通过start()stop()方法控制录音流程。录音完成后可在onStop回调中获取临时文件路径。

uniapp音频使用

const recorderManager = uni.getRecorderManager();
recorderManager.start({ format: 'mp3' });
recorderManager.onStop((res) => { console.log(res.tempFilePath) });

注意事项

  • iOS系统限制自动播放,需在用户交互事件中触发
  • 网络音频需配置合法域名
  • 使用完毕后调用destroy()释放资源
  • 录音功能需要用户授权麦克风权限

标签: 音频uniapp
分享给朋友:

相关文章

uniapp多环境配置

uniapp多环境配置

多环境配置的必要性 在UniApp开发中,多环境配置能有效区分开发、测试、生产等不同环境的API地址、密钥等参数,避免手动修改代码导致的错误。 创建环境配置文件 在项目根目录下创建env.js或co…

uniapp 如何封装request请求

uniapp 如何封装request请求

封装 request 请求的核心思路 在 UniApp 中封装请求通常基于 uni.request,通过统一处理 URL、参数、header 和拦截逻辑提升代码复用性。以下是一个完整封装方案: 创建…

uniapp隐藏右侧滚动条

uniapp隐藏右侧滚动条

隐藏右侧滚动条的方法 在UniApp中隐藏右侧滚动条可以通过CSS样式实现,适用于H5、小程序等平台。以下是几种常见的方法: 全局样式设置 在App.vue的全局样式中添加以下CSS代码,适用于所有…

uniapp斑马

uniapp斑马

uniapp 斑马相关问题解答 uniapp 斑马打印机连接与使用 uniapp 支持通过蓝牙或网络连接斑马打印机,需要借助原生插件或第三方 SDK。以下为常见方法: 蓝牙连接方式 安装 uni-…

uniapp 摇骰子

uniapp 摇骰子

uniapp 摇骰子实现方法 页面布局 在 pages 目录下创建骰子页面(如 dice.vue),使用 view 和 image 组件构建骰子界面。骰子图片可通过静态资源或网络地址加载。 <…

uniapp定位描述

uniapp定位描述

uniapp定位功能实现 uniapp提供了多种定位方式,包括H5、小程序和App端的定位功能。通过uni.getLocation方法可以获取设备当前位置信息。 基本定位方法 使用uni.getLo…