ReactJs 中的视频渲染问题

Question

所以我使用下面的代码在我的反应网站中渲染了一个视频：

<video src='/assets/video/2.mp4' autoPlay={true} loop={true}/>

虽然这工作正常。但是当我刷新我的 chrome 浏览器时，视频没有播放。 我搜索了解决方案，但无法解决。

但是当我将代码更改为：

<video src='/assets/video/2.mp4' autoPlay={true} loop={true} muted={true}/>

即使在浏览器刷新时我的视频也会播放。

我找不到原因。 我仍然是新手，任何帮助将不胜感激。

Answer 1

我认为这不是 React 问题，而是更多的网络政策，其中浏览器会阻止视频自动播放取消静音。

Google's Explanation

我能想到的解决方法：

用户与您网站的互动可以绕过此自动播放限制。如果用户与页面交互，您可以将视频静音但取消静音？

寻找一些 React 视频播放器库来帮助您进行取消静音/静音控制。例如：

• Video.js

希望这有助于澄清！