H5-video1 iOS苹果和微信中音频和视频实现自动播放的方法

最新推荐文章于 2025-05-27 11:58:44 发布

转载最新推荐文章于 2025-05-27 11:58:44 发布 · 8.9k 阅读

Html5 专栏收录该内容

25 篇文章

订阅专栏

本文介绍了一种在微信iOS环境中实现音频和视频自动播放的方法。通过特定的HTML标签配置及微信JS API调用，确保内容能在受限制的微信环境中正常播放。

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

通过下面的方式可以解决，在iPhone手机微信中正常自动播放。

必须在微信Weixin JSAPI的WeixinJSBridgeReady才能生效，猜测微信接口做了处理~

<audio preload="preload" controls id="car_audio" src="http://media.xitaoinfo.com/ei_zamenjiehunba.mp3" loop></audio> 
<video id="video" controls="" preload="none" mediagroup="myVideoGroup" poster="http://media.w3.org/2010/05/sintel/poster.png"> 
      <source id="mp4" src="http://media.w3.org/2010/05/sintel/trailer.mp4" type="video/mp4"> 
      <source id="webm" src="http://media.w3.org/2010/05/sintel/trailer.webm" type="video/webm"> 
      <source id="ogv" src="http://media.w3.org/2010/05/sintel/trailer.ogv" type="video/ogg"> 
      <p>Your user agent does not support the HTML5 Video element.</p> 
</video> 
<!-- 必须加在微信api资源 --> 
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script> 
<script> 
     //一般情况下，这样就可以自动播放了，但是一些奇葩iPhone机不可以 
     document.getElementById('car_audio').play(); 
    //必须在微信Weixin JSAPI的WeixinJSBridgeReady才能生效 
    document.addEventListener("WeixinJSBridgeReady", function () { 
        document.getElementById('car_audio').play(); 
        document.getElementById('video').play(); 
    }, false); 
</script>