YouTube iFrame API“setPlaybackQuality”或“suggestedQuality”不起作用

Posted 2023-02-24

【中文标题】YouTube iFrame API“setPlaybackQuality”或“suggestedQuality”不起作用

【英文标题】：YouTube iFrame API "setPlaybackQuality" or "suggestedQuality" not working

【发布时间】：2012-02-06 19:39:08

【问题描述】：

我在通过 Youtube iFrame API 设置视频的质量设置时遇到了一些问题。这是我的代码：

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（一个不存在的函数）会按预期抛出错误。

我已经尝试了所有有效的字符串参数，如 outlined in the API reference（'medium'、'large'、'hd720' 等）。它们都不起作用。

有人对我应该如何设置此属性有任何建议吗？

【问题讨论】：

我能找到的唯一解决方案 - ***.com/a/30395558/2165415

对于几年后发现此问题的任何人，不再支持 setPlaybackQuality 函数。查看 2019 年 10 月 24 日的修订历史记录：developers.google.com/youtube/…

【参考方案1】：

我有完全相同的问题和解决方法。 我认为正在发生的事情是 YouTube 只允许基于显示器的实际尺寸的质量级别，所以除非你的视频高 720 像素，否则在实际播放之前你不能默认为 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');
    

【讨论】：

为我工作！嘿，你认为这是因为初始化视频必须具有相同的播放质量吗？我真的很感兴趣为什么 onPlayerStateChange() 还不够？

这似乎不再有效（2018 年 4 月）。我发布了workaround that uses css 来欺骗 YouTube 加载更高质量的视频。绝对没有这个解决方案那么优雅，所以我希望他们将来会修复 setPlaybackQuality。

ios模拟器总是使用medium

那是 2012 年，mb 那个时候可以工作，但它不适用于 iOS 12

对于几年后发现此问题的任何人，不再支持 setPlaybackQuality 函数。查看 2019 年 10 月 24 日的修订历史记录：developers.google.com/youtube/…

【参考方案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。任何 cmets 或替代解决方案将不胜感激。

【讨论】：

这仅在播放器尺寸至少为 720 像素高度时才有效。

我用 UIWebView 和 WKWebView 试过了，还是不行！

【参考方案3】：

问题在于 YouTube 选择了最合适的播放质量，因此它会覆盖 onPlayerReady() 函数中的 setPlaybackQuality()。

我找到了一种解决方案，可以强制 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 中测试。

【讨论】：

你能用 iOS 应用和它的 WKWebView 测试它吗？

"player.getplaybackquality()" 当它应该是 hd720 时返回 hd1080？为什么是这样？谢谢

【参考方案4】：

我找到了一个非常适合我的解决方案：

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

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

【讨论】：

这对我有用。另外，我添加了变量 first_play = false 并将 onclick 代码放入 if 语句 (if( ! first_play ))。然后只需在 if 语句中添加 first_play = true 即可完美运行

【参考方案5】：

我在onPlayerReady 作品中使用了这个函数和setPlaybackQuality。 唯一的问题是分配不是立即的，事实上getPlaybackQuality 在视频开始后返回正确的值。实际上在视频开始之前getPlaybackQuality 将始终返回small。但有一次视频开始使用正确的 playBackQuality。

我也尝试了不同的播放器尺寸组合，它甚至可以工作。

注意： 我正在使用 IFrame API。

【讨论】：

如果视频不支持，显然是不可能设置播放质量的。

【参考方案6】：

另一种解决方案，停止视频并使用seekTo()。对于直播，您可以跳过seekTo()。不好的是它会显示缓冲，但好的是无论播放器大小如何，您都可以完全控制。

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

【讨论】：

不适用于iOS 12，无效，无法设置hd720