微信的audio无法自动播放的问题

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了微信的audio无法自动播放的问题相关的知识,希望对你有一定的参考价值。

 

一、问题

     最近做了一个html5的项目,里面涉及到音乐播放,项目要求音乐进入页面就自动播放,于是我就想到了html5的audio标签,将mp3引入进去。

     1.在audio标签里引入了autoplay属性;

       经过测试发现android上可以自动播放,ios上无法自动播放。

    

  <audio id="audio" src="1.mp3" autoplay="autoplay"></audio>

  

     2.在js文件中执行audio.play();

        经过测试发现Android上可以自动播放,ios上无法自动播放。

  var audio=document.querySelector("#audio");
  audio.play();

  

二、解决办法

     1.方法一

  ps:此方法转载自(http://www.cnblogs.com/xiezhonglong/p/5780942.html)

//使用微信现在提供过的微信js-sdk 在ready中进行播放便可。

//首先引用js : 
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script> //然后写方法 : function autoPlayAudio1(){   wx.config({ // 配置信息, 即使不正确也能使用 wx.ready     debug: false,     appId: ‘‘,     timestamp: 1,     nonceStr: ‘‘,     signature: ‘‘,     jsApiList: []   });   wx.ready(function() {     document.getElementById(‘audio‘).play();   }); }
autoPlayAudio1();

  

  2、方法二

  var audio=document.querySelector("#audio");
    document.addEventListener("WeixinJSBridgeReady",function(){
	audio.play();
    },false);

  


以上是关于微信的audio无法自动播放的问题的主要内容,如果未能解决你的问题,请参考以下文章

解决在 iOS 微信浏览器中无法自动播放 HTML5 audio

解决在 iOS 微信浏览器中无法自动播放 HTML5 audio

解决在 iOS 微信浏览器中无法自动播放 HTML5 audio

解决在 iOS 微信浏览器中无法自动播放 HTML5 audio

苹果手机audio标签微信实现自动播放

解决微信浏览器中H5中的audio不能自动播放问题