关于vue2音频不能播放问题的解决 及微信端ios苹果自动播放

我写了h5的录音和播放    在浏览器中是好的   但是在微信中ios不能播放   通过多方的查找   最后在黄轶老师 的vue音乐播放器中找到相似的问题   在黄轶老师 的     github(https://github.com/DDFE/DDFE-blog/issues/24)上找到了原因   

然后通过      降级vue 版本和vue-template-complier 的版本(把^符号取消掉,在npm install)  然后就能在微信中播放   具体原因在黄轶老师的github上已经写得很清楚了  就不再多说

 

如果是在微信浏览器里面(主要是为了谷歌浏览器的手机模式)   如果是ios系统就调用一次播放    然后再点击播放按钮的时候  就和安卓端一致了

 

var u = navigator.userAgent;
var ua = navigator.userAgent.toLowerCase();
var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
if(ua.match(/MicroMessenger/i) == "micromessenger"){
  if(isiOS){
    music.play();
 
    music.pause();
  }else{
  }
}
然后在监听当前音频的缓冲  提示用户(以免文件大或网络条件导致点击后半天没的响应或播放一半播放不了的情况)
music.addEventListener('progress', () => {
  var Toast1 = Toast.loading({
    mask:false,
    message:'音频正在缓冲',
    duration:1000
  });
})
 
posted @ 2018-09-21 17:32  徐言身寸  阅读(1806)  评论(0)    收藏  举报