html5 video微信浏览器视频不能自动播放

一.微信浏览器(x5内核):

1.不能自动播放

2.全屏

3.最顶层(z层的最顶层)

二.ios系统解决方案:(无phone手机未测试)

<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>

三.android系统中解决方案:

误区:(无效的解决方案)

1.设置video属性autoplay;

2.通过js调用play();

3.通过js来触发click事件;

4.使用插件videojs;

5.通过js调用load()然后再调用play();

6.设置video属性webkit-playsinline="true";

7.touchstart监听;

8.stalled事件处理;

9.canplaythrogh事件处理;

10.readyState大于2的处理;

11.DOMContentLoaded监听;

12.微信js api中WeixinJSBridgeReady;

13.微信js api中getNetworkType;

14.白名单;

html5 video微信浏览器视频不能自动播放的更多相关文章

  1. egret 篇——关于ios环境下微信浏览器的音频自动播放问题

    前段时间公司突然想用egret(白鹭引擎)做一个金币游戏,大半个月边看文档边写吭哧吭哧也总算是弄完了.期间遇到一个问题,那就是ios环境下微信浏览器的音频自动播放问题. 个人感觉吧,egret自己封装 ...

  2. ios端微信浏览器 音乐不自动播放问题

    <audio id=''music src='' preload autoplay loop> <script src="http://res.wx.qq.com/open ...

  3. 网页视频不能自动播放?HTML5 video报错Uncaught (in promise) DOMException解决方法

    话说发哥四年前写了一个网页,如上图效果,实际网址http://pano.z01.com ,话说做好时是正常的,突然某一天,客户说你这个网站动画不见了,这是什么原因? 结果检查脚本一切正常. 其实也不是 ...

  4. 【转】Android HTML5 Video视频标签自动播放与自动全屏问题解决

    为了解决 HTML5Video视频标签自动播放与全屏问题,在网上找了很多相关资料,网上也很多关于此问题解决方法,但几乎都不能解决问题,特别对各大视频网站传回来的html5网页视频自动播放与全屏问题,我 ...

  5. html5 audio标签微信部分苹果手机不能自动播放音乐终极解决方案

    html5 audio标签微信部分苹果手机不能自动播放音乐终极解决方案 大家都知道需要在点击时候后 播放 ps:如果点击ajax 回来播放也不行,必须点击立即播放 要背景自动播放只能采取下面方案< ...

  6. 怎样解决Chrome浏览器因为禁止音频自动播放所造成的视频无法自动播放且报错: Uncaught (in promise) DOMException的问题

    这个问题是谷歌基于用户体验方面的考虑, 对页面加载时自动播放的音频作了限制, 试想一下, 如果你打开某个页面就立刻自动播放某种不可描述的声音, 那体验想必是十分酸爽. 尽管这个设定是针对音频的, 但实 ...

  7. 【bug解决】ios微信浏览器中背景音乐无法播放

    我记得之前在一次项目中,出现过浏览报错: 当时的文档链接如右:[解决]HTML5新标签audio的autoplay自动播放属性失效的解决方案 所以在这次H5的制作中,我使用了iframe来加载音频文件 ...

  8. HTML5做的浏览器欢迎界面自动跳转

    HTML5做的浏览器欢迎界面自动跳转 思路很简单,随手装逼呗.根据时间来控制背景图和文字,背景图加了毛玻璃效果,效果直接看图,用javascript来实现. 完整代码 <!DOCTYPE htm ...

  9. iphone微信 h5页音乐自动播放

    iphone微信 h5页音乐自动播放: // iphone自动播放 document.addEventListener("WeixinJSBridgeReady", functio ...

随机推荐

  1. PHP $_SERVER变量

    <?php #测试网址: http://localhost/t/test.php?id=5 //获取域名或主机地址 echo $_SERVER['HTTP_HOST']."<br ...

  2. git学习3 - 克隆远程库到本地 将本地库上传到git

    如何克隆远程版本库到本地 git clone URL 如何用命令将本地项目上传到git 1.(先进入项目文件夹)通过命令 git init 把这个目录变成git可以管理的仓库 (注意: cd C:/U ...

  3. DNS 解析流程

    DNS( Domain Name System)是“域名系统”的英文缩写,是一种组织成域层次结构的计算机和网络服务命名系统,它用于TCP/IP网络,它所提供的服务是用来将主机名和域名转换为IP地址的工 ...

  4. hibernate缓存机制详细介绍

    hibernate的缓存机制,包括一级缓存(session级别).二级缓存(sessionFactory级别). 一:hibernate的 N+1问题 list()获得对象: 如果通过list()方法 ...

  5. niosII SDRAM ,FLASH (学习特权)

    环境: quartus v13.0  64位. DE2 cycloneII EP2C35F672C6N (学校的开发板,还是想同学借的呵呵) 主要实现flash的烧录,虽然实现了但是还是有很多运气的成 ...

  6. windows Server 2008各版本有何区别?

    windows Server 2008有几个版本,先一一列出来把: Windows Server 2008 Standard Edition     (标准版) Windows Server 2008 ...

  7. MVC,MVP 和 MVVM 的详解

    一.MVC MVC模式的意思是,软件可以分成三个部分. 视图(View):用户界面. 控制器(Controller):业务逻辑 模型(Model):数据保存 各部分之间的通信方式如下. View 传送 ...

  8. 【281】◀▶ arcpy.mapping 常用类说明

    arcpy.mapping 教程入门 arcpy.mapping 指导原则 按字母顺序排序的 arcpy.mpping 类列表 按字母顺序排序的 arcpy.mpping 函数列表 按字母顺序排序的 ...

  9. 【原】Coursera—Andrew Ng机器学习—Week 1 习题—Linear Regression with One Variable 单变量线性回归

    Question 1 Consider the problem of predicting how well a student does in her second year of college/ ...

  10. 动态绑定事件-on

    动态绑定事件 $(document).on("各种事件(如click.mousemove...)","事件对象(比如我点击class为.close的div,那么这里就是. ...