it-roy-ru.com

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

У меня возникли проблемы с настройкой параметров качества видео через 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 ('medium', 'large', 'hd720' и т.д.). Никто из них не работает.

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

21
o01

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


Правка

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

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

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

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

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, как только оно начинает воспроизводиться. Любые комментарии или альтернативные решения будут оценены.

5
o01

Проблема в том, что 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.

3
jonalvarezz

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

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

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

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

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

примечание: Я использую IFrame API .

0
sirLisko

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

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