具有自定义速度的嵌入式 YouTube 视频（例如 3）

Posted 2023-02-24

【中文标题】具有自定义速度的嵌入式 YouTube 视频（例如 3）

【英文标题】：Embedded YouTube video with custom speed (e.g. 3)

【发布时间】：2015-03-06 08:58:02

【问题描述】：

我在一个页面中有一个嵌入的 YouTube 视频，并且有一个滑块，我可以使用它来设置播放器速度。

我正在使用player.setPlaybackRate(value);

问题是我想要的范围是 0.5 到 3，但播放器 API 将值限制为预定义的 [0.25, 0.5, 1, 1.25, 1.5, 2]。

在 YouTube 中，我可以使用 document.getElementsByTagName("video")[0].playbackRate = 3 轻松调整速度，但在 iframe 上我没有这样的访问权限。

【参考方案1】：

编辑：这不再起作用了。

这是由于同源政策。当根源（您的网站）访问 iframe 时，它​​似乎也会更改 iframe 的来源。所以视频不能从不同的来源（youtube.com）加载。见我的test on JSFiddle。

我认为它之前有效的事实是最近修复的 XSS 安全问题。所以我无法想象在 youtube iframe 中修改某些东西是可能的。至少不是这样。

感谢@maxple 指出！

---

原帖：

这应该可以使用较新的浏览器和html5 Iframe Sandbox Attribute：

通过该选项，您可以访问 iframe DOM 节点。

<iframe id="myframe" sandbox="allow-scripts" src="about:blank">    </iframe>

<script>
    var frame = document.getElementById("myframe");
    var fdoc = frame.contentDocument;

    fdoc.getElementsByTagName("video")[0].playbackRate = 3; // or whatever
</script>

请参阅此post 了解更多信息。

【参考方案2】：

你不能在 iFrame 中做同样的事情。

您在 Youtube 中所做的是编辑实际的视频标签，但从另一个网站这样做的唯一方法是通过 Google 提供的 API（由于 XSS 问题），如果他们决定只允许建议的值，除了做一些可能违反他们服务条款的事情之外，你最好的办法是contact Google 并要求他们通过 API 允许第三级速度。

【参考方案3】：

您在哪里看到播放器 API 限制了这些值？在 javascript API 中，您可以使用setPlaybackRate 设置建议的播放速率，但它表示无法保证您发送的内容将被设置。您应该使用getAvailablePlaybackRates 获取播放速率列表，然后选择合适的播放速率。您可以通过收听onPlaybackRateChangeevent 来了解实际设置的速率。如果您尝试将其设置为 3 并且这不是可用的费率之一，它将向 1 舍入到最接近的费率。

【讨论】：

我使用player.getPlaybackRate() 获取值

您需要监听 onPlaybackRateChange 事件以了解何时需要/能够调用 getPlaybackRate。否则，由于设置播放速率是异步的并且需要一些时间，因此在设置播放速率后立即调用 getPlaybackRate 的代码可能会报告错误的速率。

好的，但是我正在测试的视频的速度仍然不如播放速度快 3 倍时应有的速度。

当您为视频调用 getAvailablePlaybackRates 时会返回什么？有 3 个吗？

[0.25, 0.5, 1, 1.25, 1.5, 2]

【参考方案4】：

很遗憾，您正试图从另一个域编辑 iframe 的内容。主流浏览器都不允许您通过 javascript 执行此操作。

我尝试并创建了 php 文件，该文件将获取 youtube 嵌入 iframe 的内容

<?php 
    $url = $_GET['url'];
    $contents = file_get_contents($url);
    echo $contents;
?>

但不知何故 youtube 阻止了不同的来源，它只给了我黑屏。 我猜这是因为 youtube 使用 Flash 播放器来嵌入视频（而不是像他们在网站上那样使用 html5）。

很抱歉，这是不可能的。

【讨论】：

尽管他在谈论 iFrame，但我认为他是在专门谈论 YouTube javascript API。