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

Question

我在一个页面中嵌入了一个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上我没有这样的访问权限.

Answer 1

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

Answer 2

编辑:这不再起作用了.

这是由于同源政策.当根源(您的网站)访问iframe时,它似乎也会更改iframe的来源.因此,视频无法从其他来源(youtube.com)加载.看看我对JSFiddle的测试.

我认为它以前工作的事实是最近修复过的XSS安全问题.所以我无法想象在youtube中修改iframe甚至是可能的.至少不是这样的.

谢谢@maxple指出!

原帖:

这应该适用于较新的浏览器和HTML5 Iframe Sandbox属性:

使用该选项,您可以访问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>

有关详细信息,请参阅此帖子.

Answer 3

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

您在Youtube中执行的操作是编辑实际的视频标记,但是从其他网站执行此操作的唯一方法是通过Google提供的API(由于XSS问题),如果他们决定仅允许建议的值,除了做一些可能违反服务条款的事情之外,你最好的办法就是联系Google并要求他们通过API获得第三级速度.