想在微信小程序中打开界面时,自动播放一段音频。但是发现小程序文档中有两种音频类型:
- 音频
- 背景音频
api 的调用方式不同。
背景音频与音频的区别
背景音频可以在切出小程序页面后继续播放。类似网易云音乐那种音乐 app 在锁屏之后依旧能播放。
还有一些细节上的区别:
背景音频
- 全局只有一个实例
- 锁屏上可以暂停、上一曲、下一曲切换
- 静音下是否能播放?
普通音频
- 可以多个实例,但是个数有限制。可以同时放多个声音?
- 静音模式下,没有声音
小程序普通音频自动播放代码
const innerAudioContext = wx.createInnerAudioContext()
innerAudioContext.autoplay = true
innerAudioContext.src = '/test.mp3'
innerAudioContext.onPlay(() => {
console.log('开始播放')
})
innerAudioContext.onError((res) => {
console.log(res.errMsg)
console.log(res.errCode)
})
tips
- 音频建议放 CDN,本地占空间太大,影响小程序加载速度
- 可以使用 http 的音频文件链接。充分利用七牛云的 10 G 免费流量。
- ios,android 系统支持的音频文件格式不太一样,但是都支持 mp3。具体详见官方文档。
- 可以自动播放
- 生成语音的客户端,使用的是百度的 API。https://github.com/soaringsoul/Text2Speech
参考
- https://developers.weixin.qq.com/miniprogram/dev/api/media/audio/InnerAudioContext.html
- https://blog.csdn.net/lhkuxia/article/details/106855959
微信关注我哦 👍
我是来自山东烟台的一名开发者,有感兴趣的话题,或者软件开发需求,欢迎加微信 zhongwei 聊聊, 查看更多联系方式