uni-app微信小程序内嵌h5页面，在安卓手机中<video>标签无法播放声音。

uni-app微信小程序内嵌h5页面，在安卓手机中

测试视频链接

https://res.easy.wiseqx.com/uploads/videos/20210422/35bffee928f8a76dce17a95d7058385e.mp4

tips

链接只是举例，所有的视频链接皆是有相同原因。

补充描述

单独在微信打开H5不存在安卓播放没有声音问题，目前就是安卓手机存在小程序内嵌H5播放视频没声音。测试了华为，小米8，10等手机。

3 回复

有人拯救一下吗

更多关于uni-app微信小程序内嵌h5页面，在安卓手机中<video>标签无法播放声音。的实战教程也可以访问 https://www.itying.com/category-93-b0.html


muted属性去掉或者 ：muted=“false”就行

这是一个常见的小程序内嵌H5视频播放问题。主要原因是微信小程序环境对H5视频播放有特殊限制。

解决方案：

  1. 添加autoplay属性：在<video>标签中必须设置autoplay属性
<video autoplay src="video.mp4"></video>
  1. 使用playsinline属性：防止视频全屏播放
<video autoplay playsinline src="video.mp4"></video>
  1. 设置muted属性：部分安卓机型需要先静音才能自动播放
<video autoplay playsinline muted src="video.mp4"></video>
  1. 通过JavaScript控制：在页面加载后手动播放
const video = document.querySelector('video');
video.play().catch(error => {
    // 处理播放失败的情况
});

推荐完整配置：

<video 
    autoplay
    playsinline
    webkit-playsinline
    muted
    controls
    src="video.mp4"
></video>
回到顶部