Встроенное видео YouTube с пользовательской скоростью (например, 3)

у меня есть встроенное видео 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 у меня нет такого доступа.

4 ответов


где вы видите, что API игрока ограничивает значения? В JavaScript API, вы можете использовать setPlaybackRate чтобы установить предлагаемую скорость воспроизведения, но он говорит, что нет гарантии, что то, что вы отправляете, будет установлено. Вы должны использовать getAvailablePlaybackRates чтобы получить список скоростей воспроизведения, а затем выбрать подходящий. Вы можете выяснить, какая скорость была фактически установлена, слушая onPlaybackRateChangeevent. Если ты попытаешься ... установите его на 3, и это не один из доступных тарифов, он будет округляться до 1 до ближайшего курса.


EDIT: это больше не работает.

это связано с политикой того же происхождения. Когда 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>

посмотреть этот в должности для получения дополнительной информации.


вы не можете сделать то же самое в iframe.

то, что вы делаете в Youtube, - это редактировать фактический тег видео, но единственный способ сделать это с другого веб-сайта-через API, предоставляемый Google (из-за проблем XSS), и если они решили разрешить только предлагаемые значения, ваш лучший выстрел за пределами того, что может нарушить их условия обслуживания, - это связаться с Google и попросите их позволить третьему уровню скорости через ПРИКЛАДНОЙ ПРОГРАММНЫЙ ИНТЕРФЕЙС.


к сожалению, вы пытаетесь редактировать содержимое iframe из другого домена. ни один из основных браузеров не позволяет сделать это с помощью javascript.

Я попытался и создал php-файл, который получит содержимое YouTube embed iframe

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

но каким-то образом youtube блокирует разные источники, и это дало мне только черный экран. как я догадался, это потому, что youtube использует flash player для встраивания видео (вместо html5, как они делают на веб-сайте).

Так что извини, но это невозможно.