使用 HTML5 嵌入式视频与使用带有 YouTube 链接的 iframe 有啥区别？

Posted 2023-03-05

【中文标题】使用 HTML5 嵌入式视频与使用带有 YouTube 链接的 iframe 有啥区别？

【英文标题】：What are the differences between using an HTML5 embedded video vs. an iframe with a YouTube link?使用 HTML5 嵌入式视频与使用带有 YouTube 链接的 iframe 有什么区别？

【发布时间】：2016-09-18 11:11:23

【问题描述】：

我正在考虑是否将视频存储在我的服务器上并通过 html5 标签调用它，或者将视频上传到 YouTube 并使用 iframe 嵌入 YouTube 链接。我不确定哪个会更有效，或者每个之间的差异。使用 HTML5 视频标签与使用 YouTube 链接和 iframe 标签有什么区别？

【参考方案1】：

通过 HTML5 使用自托管视频

优点：

完全控制标记和界面

缺点：

浏览器支持掌握在您手中 与 YouTube 相比，您服务器上的视频下载速度会较慢

推荐用法：

使用像 https://plyr.io/ 这样的 javascript 插件，这将有助于解决跨浏览器和响应问题。如果可能，从 CDN 提供视频

Youtube 托管

优点：

高性能 浏览器支持就是一切

缺点：

YouTube 品牌默认 对界面的控制很少

推荐用法： 使用 youtube 提供的 iframe 嵌入代码。如需响应帮助，请参阅http://embedresponsively.com/。 plyr.io 还允许您播放 YouTube 视频。

【参考方案2】：

对于我使用<iframe> 和<video> 标签的经验：

当您想在使用带有“Chrome”和“Apple”的移动设备或平板设备时自动播放视频时，我发现 <iframe> 标记存在问题。

在我的情况下，我曾经做一个点击功能来播放视频，这是<iframe>标签不可能的，所以我使用<video>标签来解决这个问题。