媒体组件audio

行动在路上

于 2021-12-08 08:48:25 发布

阅读量585

点赞数

CC 4.0 BY-SA版权

分类专栏：微信小程序文章标签：微信小程序小程序 vue.js

本文链接：https://blog.youkuaiyun.com/weixin_42668909/article/details/121782882

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

4 篇文章

订阅专栏

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

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

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

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)
})