踩坑日记-微信H5开发 IOS系统中声音自动播放相关问题

一、问题描述:audio标签在IOS系统下无法自动播放。

原因:在IOS或是一些浏览器限制下,audio或video标签无法自动播放,console会提示no user gesture is required,必须通过用户通过事件触发才可以完成播放。

解决方法:既然需要用户触发事件来播放,那我的解决办法就是直接用户在点击body的时候触发播放(反正我这个项目情况用户肯定会先点的,如果没有让用户点击的诱因,可以自己做一个,比如“点我开启”这类)。
一开始上面解决方法在安卓上面用的不错,但后来突然在苹果上面就出问题了,自动播放成了概率问题了,一会有一会没有,查遍所有资料才知道,这块必须得如下写,在wx.ready里面让他播放一次,我放的是无声的音频:


            wx.ready(()=> {
                document.getElementById("voice0").src="http://jiaoxue.xxx.com/noVoice.wav"
                document.getElementById("voice0-1").src="http://jiaoxue.xxx.com/noVoice.wav"
                document.getElementById("voice0-2").src="http://jiaoxue.xxx.com/noVoice.wav"
                document.getElementById("voice1").src="http://jiaoxue.xxx.com/noVoice.wav"
                document.getElementById("voice1-1").src="http://jiaoxue.xxx.com/noVoice.wav"
                document.getElementById("voice1-2").src="http://jiaoxue.xxx.com/noVoice.wav"
                document.getElementById("voice2").src="http://jiaoxue.xxx.com/noVoice.wav"
                document.getElementById("voice2-1").src="http://jiaoxue.xxx.com/noVoice.wav"
                document.getElementById("voice2-2").src="http://jiaoxue.xxx.com/noVoice.wav"
                document.getElementById("voice3").src="http://jiaoxue.xxx.com/noVoice.wav"
                document.getElementById("voice3-1").src="http://jiaoxue.xxx.com/noVoice.wav"
                document.getElementById("voice3-2").src="http://jiaoxue.xxx.com/noVoice.wav"




                let voice = {
                    localId: '',
                    serverId: ''
                };
                let startRecord = document.querySelector('#startRecord');
                let stopClearTimeout;
            });
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值