API iFrame YouTube «setPlaybackQuality» или «предлагаемое качество» не работает

Question

У меня проблемы с настройкой параметров качества видео через API YouTube iFrame.Это мой код:

var player;

player = new YT.Player('player', {
    height: '490',
    width: '725',
    videoId: yturl,
    /* setPlaybackQuality: 'hd720', <-- DOES NOT WORK */
    /* suggestedQuality: 'hd720',   <-- DOES NOT WORK */
    events: {
        'onReady': onPlayerReady
    }
});

function onPlayerReady(event) {
    player.setPlaybackQuality('hd720');       // <-- DOES NOT WORK
    event.target.setPlaybackQuality('hd720'); // <-- DOES NOT WORK
    player.setVolume(100);                    // <-- DOES WORK
    console.log(player.getPlaybackQuality()); // <-- Prints 'small' to console
    event.target.playVideo();
}

Самое смешное, что мой звонок player.setPlaybackQuality или event.target.setPlaybackQuality не дает никаких ошибок.Это выглядит так, как будто игрок игнорирует это.Вызов, скажем, player.setSuggestedQuality (функция, которая не существует) выдает ошибку, как и ожидалось.

Я перепробовал все допустимые строковые параметры как , обозначенные в справочнике API («средний», «большой», «hd720» и т. д.).Ни один из них не работает.

У кого-нибудь есть предложения, как мне установить это свойство?

Answer 1

У меня точно такая же проблема и обходной путь. Я думаю, что происходит то, что YouTube допускает только уровни качества, основанные на фактическом размере дисплея, поэтому, если у вас видео высотой 720px, вы не можете по умолчанию установить значение 720p, прежде чем оно действительно воспроизводится. Тогда пользователь контролирует удар, и YouTube перестает быть членом.


EDIT

Просто совершите прорыв: Если вы используете событие 3 (буферизация) вместо события 5 (воспроизведение), для пользователя не возникает заикания. Качество меняется, как только начинается загрузка. Единственное, что вам нужно, это установить его в onPlayerReady, иначе он не работает.

function onPlayerReady(event) {
    event.target.setPlaybackQuality('hd720');
}
function onPlayerStateChange(event) {
    if (event.data == YT.PlayerState.BUFFERING) {
        event.target.setPlaybackQuality('hd720');
    }
}

Answer 2

Найден возможный взлом / решение.

Если я подожду, пока видео не начнет воспроизводиться, тогда примените setPlaybackQuality - все работает.Таким образом:

player = new YT.Player('player', {
    height: '490',
    width: '725',
    videoId: yturl,
    events: {
        'onReady': onPlayerReady,
        'onStateChange': onPlayerStateChange
    }
});

function onPlayerReady(event) {
    player.setVolume(100);
    event.target.playVideo();
}

function onPlayerStateChange(event) {
    if (event.data == YT.PlayerState.PLAYING) {
        event.target.setPlaybackQuality('hd720');  // <-- WORKS!
    }
}

Однако решение не является идеальным, поскольку видео сначала начинает буферизоваться с более низким качеством, а затем переключается на 720, как только оно начинает воспроизводиться.Любые комментарии или альтернативные решения будут оценены.

Answer 3

Проблема в том, что YouTube выбирает наиболее подходящее качество воспроизведения, поэтому он переопределяет setPlaybackQuality() в функции onPlayerReady().

Я нашел решение, которое заставит проигрыватель YouTube играть в любом качестве, которое вы не хотитенезависимо от ширины и высоты плеера:

var player;
function onYouTubeIframeAPIReady() {
    player = new YT.Player('player', {
        height: '180',
        width: '320',
        videoId: 'M7lc1UVf-VE',
        events: {
        'onReady': onPlayerReady,
        'onPlaybackQualityChange': onPlayerPlaybackQualityChange,
        'onStateChange': onPlayerStateChange
        }
    });
}


function onPlayerReady(event) {
    event.target.playVideo();
}

function onPlayerPlaybackQualityChange(event) {
    var playbackQuality = event.target.getPlaybackQuality();
    var suggestedQuality = 'hd720';

    console.log("Quality changed to: " + playbackQuality );

    if( playbackQuality !== 'hd720') {
        console.log("Setting quality to " + suggestedQuality );
        event.target.setPlaybackQuality( suggestedQuality );
    }
}

Код обеспечивает изменение качества.

Имейте в виду: пользователь не может изменить качество видео с помощью кнопки проигрывателя с этим кодом.

В любом случае, вы можете принудительно установить предлагаемое качество только один раз.

Протестировано в GChrome, Firefox и Safari.

Answer 4

Я нашел решение, которое идеально подходит для меня:

 function onPlayerStateChange(event) {
   //Some code...

   $(".btn-change-quality").on("click",  function(){
       pauseVideo();
       player.setPlaybackQuality('hd720');
       playVideo();
    });
} 

Answer 5

другое решение, остановите видео и используйте seekTo(). для прямой трансляции вы можете пропустить seekTo(). Плохо это будет показывать буферизацию, но хорошо, что у вас есть полный контроль независимо от размера игрока.

var player = YT.get('videoid');
rate = 'small';
var currentTime = player.getCurrentTime();
player.stopVideo();
player.setPlaybackQuality(rate);
player.playVideo();
player.seekTo(currentTime, false);

Answer 6

Я немного поиграл с этой функцией, и setPlaybackQuality в onPlayerReady работает.Единственная проблема состоит в том, что назначение не является немедленным, фактически getPlaybackQuality возвращает правильное значение сразу после запуска видео.На самом деле перед запуском видео getPlaybackQuality всегда будет возвращать small.Но один раз, когда начинается видео, используется правильная playBackQuality .

Я также пробовал использовать комбинации с разными размерами игроков, и это даже работает.используя IFrame API .