Получение текущего видео YouTube

Question

Я пишу плагин для браузера, и мне нужно найти способ получить текущее время воспроизведения видео YouTube на YouTube с использованием JavaScript. Я играл в консоли Chrome JavaScript и мне не повезло.

Похоже, что Chrome API работает только со встроенными видеопроигрывателями, а не с видео, которое воспроизводится на youtube.com. Один из вариантов, который я изучил, находится в разделе "Поделиться" видео. Это поле ввода для времени "start at:", которое содержит текущее время видео. Я пытался использовать.value и.text в этом поле ввода, и они оба возвращают неопределенный? У кого-нибудь есть какие-либо идеи?

Answer 1

ytplayer = document.getElementById("movie_player");
ytplayer.getCurrentTime();

Смотрите API

Answer 2

Зависит от того, чего вы хотите

player.getCurrentTime():Number

Возвращает прошедшее время в секундах с момента начала воспроизведения видео.

player.getDuration():Number

Возвращает продолжительность в секундах текущего воспроизводимого видео. Обратите внимание, что getDuration() будет возвращать 0 до загрузки метаданных видео, что обычно происходит сразу после начала воспроизведения видео.

http://code.google.com/apis/youtube/js_api_reference.html

Answer 3

Наконец-то я нашел способ заставить его работать на iOS (и на Android тоже).
На самом деле, весь YouTube JS API был сломан для меня, если запустить на мобильном браузере.

Проблема решена путем создания игрока с помощью new YT.Player как описано в YouTube IFrame API.

Обратите внимание: только создание <iframe> от <div> заполнитель работает для мобильных браузеров в то время. Если вы пытаетесь использовать существующие <iframe> в new YT.Player вызов, как упоминалось в IFrame API, это не будет работать.

После того, как игрок создан, можно использовать player.getCurrentTime() или же player.getDuration() с player экземпляр создан.

Примечание: мне не повезло, вызывая этот метод на игроке, полученном с
player = document.getElementById(...) (из ответа @JosephMarikle).
Только создан player Экземпляр работал в мобильных браузерах.

---

Полезные ссылки:

• API YouTube IFrame
• API JavaScript YouTube
• Демонстрация проигрывателя YouTube

Answer 4

Вы можете использовать Html5 Video API наyoutube.com

var htmlVideoPlayer = document.getElementsByTagName('video')[0];
htmlVideoPlayer.currentTime

Примечание. Он не будет работать с Youtube Iframe API, потому что iframe изолированы. Вы не можете получить доступ к контексту Youtube IFrame .

Answer 5

В 2020 году это работает:

player.playerInfo.currentTime

полный код:посмотреть вживую на codepen

Answer 6

Просто к сведению, есть новый интерфейс iframe для проигрывателя YouTube: https://developers.google.com/youtube/iframe_api_reference

Answer 7

      document.querySelector('video').currentTime

Answer 8

Остановить в определенное время видео на YouTube и показать окно уведомлений в GWD

<script>
  var yid = document.getElementById("gwd-youtube_1");
  var idBox = document.getElementById("box1");
pausing_function = function(event) { 

    var aa = setInterval(function() {

        if (yid.getCurrentTime() > 8.0 && yid.getCurrentTime() < 8.1) {
            yid.pause(yid);
            idBox.style.opacity = 1;
            console.log(yid.getCurrentTime() + "playing")

             clearInterval(aa);
            yid.removeEventListener("playing", pausing_function);

        }

    }, 100)
}

 yid.addEventListener("playing", pausing_function);

  var pausing_function_1 = function() {      
       if (yid.getCurrentTime() > 8.1) {
        console.log(yid.getCurrentTime() + "pause")


        // remove the event listener after you paused the playback
        yid.removeEventListener("playing", pausing_function);
      }
    };    
  </script>

воспроизвести видео и скрыть уведомление

 <script type="text/javascript" gwd-events="handlers">
    window.gwd = window.gwd || {};
    gwd.pauseVideo = function(event) {
      var idBox = document.getElementById("box1");
      idBox.style.opacity = 0;
    };
  </script>
  <script type="text/javascript" gwd-events="registration">
    // Support code for event handling in Google Web Designer
     // This script block is auto-generated. Please do not edit!
    gwd.actions.events.registerEventHandlers = function(event) {
      gwd.actions.events.addHandler('gwd-youtube_1', 'playing', gwd.pauseVideo, false);
    };
    gwd.actions.events.deregisterEventHandlers = function(event) {
      gwd.actions.events.removeHandler('gwd-youtube_1', 'playing', gwd.pauseVideo, false);
    };
    document.addEventListener("DOMContentLoaded", gwd.actions.events.registerEventHandlers);
    document.addEventListener("unload", gwd.actions.events.deregisterEventHandlers);
  </script>