月度归档:2020年09月

基于vue的h5页面在微信中打开后自动播放video视频

目前,PC端移动端都禁止video自动播放,除非和用户发生了页面交互动作,比如click,touchstart等事件,在事件回调中可以调用播放方法。若加了muted属性,则可以自动播放,但是静音不是我们想要的。

PC端可以使用iframe引入视频文件地址进行自动播放,但缺点是外观不可控。

H5页面暂无有效手段。

微信内置浏览器提供了WeixinJSBridge对象,若是服务器端渲染的页面,可以试试该对象初始化成功后的事件回调中播放视频:

document.addEventListener('WeixinJSBridgeReady', () => video.play(), false);

但若是基于Vue.js等前端渲染的页面,上述方法未必有用,但是经测试,发现另外一个取巧的方法:

if (typeof WeixinJSBridge !== 'undefined') {
WeixinJSBridge.invoke('getNetworkType',{},function (e){
// 利用该方法进行自动播放
video.play()
});
}

微信基本是社交传播的主阵地,能解决微信就能解决80%以上的硬需求了。