媒体组件audio

微信小程序内部音频处理指南

最新推荐文章于 2024-12-28 21:39:26 发布

原创最新推荐文章于 2024-12-28 21:39:26 发布 · 609 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#微信小程序 #小程序 #vue.js

微信小程序专栏收录该内容

4 篇文章

订阅专栏

本文介绍了微信小程序中使用 InnerAudioContext 接口来操作音频的方法。通过wx.createInnerAudioContext创建内部音频上下文，并设置autoplay和src属性实现自动播放在线音频。同时，通过onPlay和onError事件监听音频的播放状态和错误处理。

媒体组件audio

audio
- 支持的属性:
wx.createInnerAudioContext 接口
- 属性
- 方法

微信小程序中音频的使用还算是较常用.

audio

可以播放在线音频资源

支持的属性:

在这里插入图片描述

参考https://developers.weixin.qq.com/miniprogram/dev/component/audio.html

wx.createInnerAudioContext 接口

1.6.0版本开始，audio组件不再维护
InnerAudioContext wx.createInnerAudioContext(Object object)
创建内部 audio 上下文 InnerAudioContext 对象。
使用时,在获取到对象后,以属性的方式进行操作

属性

参考:https://developers.weixin.qq.com/miniprogram/dev/api/media/audio/InnerAudioContext.html

方法

const innerAudioContext = wx.createInnerAudioContext()
innerAudioContext.autoplay = true
innerAudioContext.src = 'http://ws.stream.qqmusic.qq.com/M500001VfvsJ21xFqb.mp3?guid=ffffffff82def4af4b12b3cd9337d5e7&uin=346897220&vkey=6292F51E1E384E061FF02C31F716658E5C81F5594D561F2E88B854E81CAAB7806D5E4F103E55D33C16F3FAC506D1AB172DE8600B37E43FAD&fromtag=46'
innerAudioContext.onPlay(() => {
  console.log('开始播放')
})
innerAudioContext.onError((res) => {
  console.log(res.errMsg)
  console.log(res.errCode)
})