首页 文章

YouTube iframe嵌入式无法以高清格式启动

提问于
浏览
42

我正在尝试嵌入高清YouTube视频,但无论我尝试什么,它似乎只能加载480p版本 .

据YouTube称,嵌入高清视频就像在网址中添加 hd=1 一样简单:

<iframe src="//www.youtube.com/embed/{videoId}?hd=1" width="960" height="720"  frameborder="0" allowfullscreen></iframe>

然而,这似乎并不起作用,至少在我的 iframe 的实现中:

<iframe id="video-player" width="960" height="720" src="//www.youtube.com/embed/{videoId}?enablejsapi=1&autoplay=1&rel=0&modestbranding=1&showinfo=0&showsearch=0" frameborder="0" allowfullscreen></iframe>

Javascript API也是如此:

HTML:

<div id="video-player"></div>

JS:

var player;
    function onYouTubePlayerAPIReady() {
        player = new YT.Player('video-player', {
            height: '720',
            width: '960',
            videoId: '{videoId}',
            playerVars: {
                'controls': 1,
                'autoplay': 1,
                'hd': 1
            },
            events: {
                'onReady': onPlayerReady,
                'onStateChange': onPlayerStateChange
            }
        });
    }

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

8 回答

  • 5

    Use this parameter:

    VQ = HD1080

    Example:

    <iframe src="https://www.youtube-nocookie.com/embed/SzTdgE04uA8?vq=hd1080" width="853" height="480"></iframe>
    
  • 0

    根据YouTube支持论坛上的this answer

    [iframe嵌入]将尝试“优化”体验,并将根据嵌入播放器的尺寸进行操作,以选择默认情况下播放的质量 . 如果嵌入比1280x750小得多,例如853x510或640x390,它将播放480p或360p,无论是否设置了&hd = 1参数 .

    (强调我的)

    我将iframe的尺寸更改为1280x720,并以720p分辨率加载视频 .

    因此,基本上iframe嵌入机制是智能的,只根据iframe的大小加载最接近的分辨率 .

  • 27

    你可以做一个技巧 . 通过JS设置质量 . 它不保证,但在我的网站上工作(ggreplayz.com):

    https://developers.google.com/youtube/js_api_reference#Playback_quality

    例:

    <iframe id="vid2" style="z-index: 1;" width="853" height="505" src="http://www.youtube.com/embed/<?php echo $vid2Array[0];?>?enablejsapi=1&wmode=transparent&hd=1" frameborder="0" allowfullscreen></iframe>
    
    <script type="text/javascript">
    ...
        function onYouTubePlayerAPIReady() {    
          player1 = new YT.Player('vid1', {
            events: {
              'onReady': onPlayerReady1
            }
          });
    ...
        function onPlayerReady1(event) { 
            player1.setPlaybackQuality('hd720');
        }
    ...
    
  • 1
  • 2

    我使用 &hd=1&vq=hd720 来实现这一点 . 即使播放器较小,它也会加载720p版本 . 我从this source获得了这些信息 .

  • 1

    我可能有点晚了,但我发现它只是看着视频播放器的高度 .

    当我尝试嵌入1000px宽的视频,但只有408像素高(2.35:1遮罩)时,它选择360p>:

  • 84

    在花了5个多小时搜索并测试所有答案之后,下面的代码对我有用 . 使用Xcode 5,iOS 7.0.4和iPad mini2 .

    - (void)viewWillAppear:(BOOL)animated
    {
    
    
    NSString *htmlString = @"<html><head>\
    <meta name = \"viewport\" content = \"initial-scale = 1.0, user-scalable = yes, height = 640px, width = 360px\"/></head>\
    <body style=\"background:#000;margin-top:0px;margin-left:0px\">\
    <iframe id=\"ytplayer\" type=\"text/html\" width=\"640px\" height=\"360px\"\
    src=\"http://www.youtube.com/embed/%@?vq=hd1080\"\
    frameborder=\"0\"/>\
    </body></html>";
    
    htmlString = [NSString stringWithFormat:htmlString,self.videoId, self.videoId];
    [self.videoPlayerView loadHTMLString:htmlString baseURL:[NSURL URLWithString:@"http://www.youtube.com"]];
    
    }
    

    这里唯一重要的是您在iframe中设置的宽高比( " width="640px" height="360px" ),它们基本上是1280 * 720的比率 . 然后为UIWebView设置相同的大小 . 希望这能有所帮助 .

  • 7

    我根本没有工作 . 我尝试了所有这些参数

    &hd=1&vq=hd720&quality=high
    

    但是在我添加这个参数之前它没有用:

    &version=3
    

相关问题