视频自动播放在移动设备上不起作用（React）答案

【问题标题】：Video autoplay does not work on mobile (React)视频自动播放在移动设备上不起作用（React）
【发布时间】：2021-05-10 10:01:09
【问题描述】：

我正在使用 React，并希望我的视频背景能够在移动设备上自动播放。它曾经，但后来停止了（由于未知原因，因为我没有更改代码）。 如何让视频在移动设备上自动播放？

这是我尝试过的（但都失败了）：

<video autoPlay loop muted playsinline >
  <source src={video} type="video/mp4" />
</video>

<video loop={true} playsinline={true} muted={true} autoPlay={true}>  
  <source src={video} type="video/mp4" />
</video>

dangerouslySetInnerHTML={{
 __html: `<video className="app__backgroundVideo" autoplay loop muted playsinline>
       <source src=${video} type="video/mp4" />
       Your browser does not support the video tag.
 </video>`,
           }}

【问题讨论】：

标签： reactjs video mobile autoplay

【解决方案1】：

尝试在视频标签中使用 defaultMuted。

 <video autoplay defaultMuted playsinline id="myVideo">
 <source src="video.mp4" type="video/mp4">
 </video>

【讨论】：

我试过了，不幸的是，它仍然不起作用。在移动设备上，视频会在屏幕前显示一个箭头，即使单击箭头也不会播放视频。但是，视频仍然可以在桌面上正常播放。

【解决方案2】：

我找到了这个问题的答案。我上面写的代码是正确的，但是如果你的 iPhone 处于低功耗模式，Safari 将不会自动播放视频。这就是视频没有自动播放的原因，而不是因为代码错误。

【讨论】：