如何循环播放 iFrame 视频？答案

【问题标题】：How to loop an iFrame video?如何循环播放 iFrame 视频？
【发布时间】：2020-12-08 05:53:33
【问题描述】：

尝试无限循环 iFrame 视频.. 寻找主要用于 youtube 视频的解决方案.. 任何嵌入式视频的解决方案，如下所示？

<iframe src="https://embed.showcache.io/ptkFLE7sMONaS7YQ6PbtCM" frameborder="0" allow="autoplay; fullscreen;" allowfullscreen loop></iframe>

【问题讨论】：

标签： html

【解决方案1】：

一般来说：不，您不能循环播放在 <iframe> 中运行的视频：

您可以通过 JavaScript 控制 <video> 元素的循环和播放，前提是您的页面有权执行（例如，<video> 元素位于您自己的网页中，而不是<iframe>)。
但是视频托管网站的嵌入式播放器是单独的网页，它们被加载到 <iframe> 中，该网页将具有禁止父网页脚本与 <iframe> 交互的内容安全策略内容。
- 这听起来很烦人或不利于竞争，但这是一件好事：否则您访问的任何网页都可能劫持您的 YouTube 帐户并加载到隐藏的<iframe>。
因此，如果您使用的是视频托管网站（例如 Vimeo、YouTube 等），那么您将无法通过自己的脚本直接控制其 <video> 元素。
- 但是，视频托管网站倾向于提供客户端脚本 API 或 SDK，以允许执行常见的视频播放控制任务。例如。：
  - YouTube：https://developers.google.com/youtube/iframe_api_reference
  - 维密欧：https://developer.vimeo.com/player/sdk
如果您运行/操作/拥有加载到 iframe 中的页面，那么您可以设置自己的 CSP、Cross-Origin 和 cross-frame 策略以允许直接脚本访问嵌入的内容以直接控制 <video> 元素.
- 如果您这样做，您必须格外小心，并使用受信任的 <iframe> 主机页面来源（域名）的明确允许列表，而不是通配符。

【讨论】：