Javascript 如何在所有浏览器中同时播放视频和音频

我试图做我的网站只添加一个视频循环（与音频），我开始根据这个WebGL的例子在这里 之后，我把这个项目的视频源和我的一个（它有视频和音频）放在Index.html amd中，我可以成功地看到视频，但我听不到它的音频。 自从我读到这篇文章后，我可能会面临现代浏览器的自动播放策略（这意味着至少在Chrome上，你不能自动播放带有声音的视频），因此，我可以通过在你开始播放视频之前强制用户交互来轻松解决这个问题。 更具体地说，我添加了一个链接，其中包含一个我需要为您的knownledge制作的示例

就像我是这个主题的新手一样，有谁能帮我将代码添加到前面提到的示例中，以构建背景和按钮来同时播放视频和音频？有人能帮我吗？ 我拥有的代码的一部分如下

    <script>

      // vars
      var num=30;
        var objects=[];
        var raycaster = new THREE.Raycaster();
        var mouse = new THREE.Vector2();
      var light,t;

        // create camera
        var camera = new THREE.PerspectiveCamera( 65, window.innerWidth/window.innerHeight, 0.1, 1000 );
        camera.position.set(0.0,0.0,5);

        // create a scene
        var scene = new THREE.Scene();

        // create renderer
      var renderer = new THREE.WebGLRenderer({antialias:true});
        renderer.setSize( window.innerWidth, window.innerHeight );
        document.body.appendChild( renderer.domElement );

</script>

<h1> My own website </h1>

<video id="videoBacker" loop src="assets/miownvideo.mp4" autoplay muted ></video>
<div class='bar-top'></div>
<div class='bar-bottom'></div>

//瓦尔斯
var-num=30；
var对象=[]；
var raycaster=new THREE.raycaster（）；
var mouse=new THREE.Vector2（）；
var-light，t；
//创建摄影机
var摄像机=新的三透视摄像机（65，window.innerWidth/window.innerHeight，0.11000）；
摄像机位置设置（0.0,0.0,5）；
//创造一个场景
var scene=new THREE.scene（）；
//创建渲染器
var renderer=new THREE.WebGLRenderer（{antialas:true}）；
renderer.setSize（window.innerWidth、window.innerHeight）；
document.body.appendChild（renderer.doElement）；
我自己的网站

---

使用WebGLRenderer的具体原因是什么？为什么不使用HTML5的媒体元素来播放mp4文件呢。更多信息：（）只需删除

muted

属性即可。我删除了静音属性，Chrome只显示一个静止帧（不是声音）谢谢你的建议Hi mail2subhajit，我正在使用WebGl创建我的网站，因为在我想将其修改为WebVR之后。。。谢谢你的建议。看来你已经知道该怎么处理了，不是吗？在“用户交互”处理程序中，调用

video.play（）

，就可以运行了。