HTML5视频在IOS设备上无法播放但在其他地方都可以正常工作

Question

我正在尝试创建一个自动播放全屏视频的首页。它在我的机器上（Linux [name] 4.15.0-33-generic #36-Ubuntu SMP Wed Aug 15 16:00:05 UTC 2018 x86_64 x86_64 x86_64 GNU/Linux）在FireFox和Chrome中运行良好。但在iPhone和mac上测试时，视频被替换为空白屏幕。我在网上读到IOS停止支持视频自动播放。有没有办法绕过这个问题？WebM是否支持IOS？

<video autoplay loop muted playsinline>
  <source src="static/video/video.webm" type="video/webm"/>
  Your browser does not support the video tag.
</video>

- APorter1031

---

不，它不是这样的。http://wiki.webmproject.org/software/webm 使用h.264作为备选方案。https://www.html5rocks.com/en/tutorials/video/basics/ - BobtheMagicMoose

Answer 1

我通过向视频标签添加以下来源来解决了我的问题：

<video autoplay loop muted playsinline>
    <source src="devstories.webm" 
          type='video/webm;codecs="vp8, vorbis"' />
    <source src="devstories.mp4" 
          type='video/mp4;codecs="avc1.42E01E, mp4a.40.2"' />
  Your browser does not support the video tag.
</video>

- APorter1031

Answer 2

<video autoplay loop playsinline> 

请在视频标签中添加playsinline，对我来说它可以正常工作。

- subindas pm

Answer 3

适用于所有浏览器的解决方案：https://dev59.com/1WIj5IYBdhLWcg3wWj-d#66344245 ...

<video controls autoplay loop muted playsinline>
    <source src="https://example.com/my_video.mov" type="video/mp4">
</video>

将视频转换为.MOV格式，并在同一个标签中添加type="video/mp4"。工作正常！

- artico

Answer 4

嘿大家，我想分享一个解决方案。我刚试着建立一个超级简单的作品集，并将其托管在Github页面上。不幸的是，无法访问服务器进行任何配置。我尝试了一切办法。最后，我通过将视频托管在Vimeo上使其正常工作。而且，我使用的是免费版本。然后，你可以使用他们的iframe来嵌入视频。这在所有平台上都完美运行，而且Vimeo没有烦人的广告。

值得一试。

- Siri

Answer 5

<video playsinline muted>

嘿，所有使用playsinline和muted的组合对我起了作用。

值得一试。

- Devosaan