获取 YouTube 视频尺寸（宽度/高度）

Posted 2023-02-24

【中文标题】获取 YouTube 视频尺寸（宽度/高度）

【英文标题】：Get YouTube Video dimensions (width/height)

【发布时间】：2012-03-19 20:30:46

【问题描述】：

我正在尝试获取 YouTube 视频的大小。我正在使用 Gdata API 调用来检索基本信息（标题、URL、缩略图和类别），但我找不到视频尺寸。

我正在使用 YouTube 数据 API 服务器端调用在网站上嵌入一些视频，如下所示：http://gdata.youtube.com/feeds/api/videos/z_AbfPXTKms?0=v&1=2&alt=json。不幸的是，没有关于视频尺寸的可靠信息（所有预览图像都是 4/3 比例，即使是宽屏视频）。

我想要完成的是将视频完全适合播放器；播放器宽度是固定的，所以我只需要原始尺寸或至少是比例。

有没有办法使用 Youtube API 检索此类数据？

（我的后备计划是将播放器大小设置为 4/3 并且从不回头，但感谢任何帮助！）

【参考方案1】：

您还可以通过 YouTube 的 oEmbed 实现来获得它。示例：

https://www.youtube.com/oembed?url=https://www.youtube.com/watch?v=hUvbb_eUP84&format=xml

format=json 也被接受。

【讨论】：

这个视频是 1080p 但仍然返回 480x270：youtube.com/oembed?url=http%3A//www.youtube.com/… 所以我会选择以色列的答案

感谢您的报告！ YouTube 员工似乎不太关心他们的 oEmbed API :-(

没有冒犯，但这是最高评价和接受的答案，虽然它不起作用？还是我错了？

@jakob.j 你是对的，这不再有效。请参阅 my answer 并提供可行的解决方案（截至 2017 年）。

【参考方案2】：

2017 年更新 - 接受的答案不再有效

如果您想从问题中获取示例视频的尺寸：

https://www.youtube.com/watch?v=z_AbfPXTKms

然后试试这个 URL，使用 Noembed:

https://noembed.com/embed?url=https%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3Dz_AbfPXTKms

它将返回以下 JSON：

  "version": "1.0",
  "title": "まるです。",
  "author_name": "mugumogu",
  "provider_url": "https://www.youtube.com/",
  "width": 459,
  "height": 344,
  "thumbnail_height": 360,
  "type": "video",
  "thumbnail_width": 480,
  "provider_name": "YouTube",
  "url": "https://www.youtube.com/watch?v=z_AbfPXTKms",
  "author_url": "https://www.youtube.com/user/mugumogu",
  "html": "\n<iframe width=\" 459\" height=\"344\" src=\"https://www.youtube.com/embed/z_AbfPXTKms?feature=oembed\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"></iframe>\n",
  "thumbnail_url": "https://i.ytimg.com/vi/z_AbfPXTKms/hqdefault.jpg"

它还支持跨域请求的 JSONP：

https://noembed.com/embed?callback=example&url=https%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3Dz_AbfPXTKms

有关更多信息，请参阅此答案：

Get Youtube information via JSON for single video (not feed) in javascript

演示

一个使用 jQuery 的简单演示：

var id = 'z_AbfPXTKms';
var url = 'https://www.youtube.com/watch?v=' + id;

$.getJSON('https://noembed.com/embed',
    format: 'json', url: url, function (data) 
    alert('Dimensions: ' + data.width + 'x' + data.height);
);

在 JSBin 上查看 DEMO。

【讨论】：

这个视频是 300x250 youtube.com/watch?v=DAvyF2CKfNg 我没有得到正确的尺寸，甚至比例。

这很奇怪，对于某些视频它是正确的（例如，youtube.com/watch?v=tsJEmLkphrI）但对于其他视频它是不正确的.. 我想这是一个 youtube 错误或视频在上传到 youtube 时确实改变了它们的大小..

不幸的是，它增加了对第三方站点的依赖。谁运行它？它会永远在线吗？ ...

【参考方案3】：

现在有一个解决办法：如果你把视频公共页面刮掉：

http://www.youtube.com/watch?v=[id]

可以看到打开的图宽高标签，例如：

<meta property="og:video:width" content="1920">
<meta property="og:video:height" content="1080">

所以你可以在那里得到尺寸;-)

【讨论】：

是否有可能在不加载站点的完整 html 代码的情况下获取此信息？如果想要一次获得几个视频的分辨率，这似乎是一个相关的效率开销。

没有这样的标签。

答案是什么？没有这样的标签。它应该在哪里，在源页面代码中，还是生成的？

【参考方案4】：

遵循 Isra 的解决方案。 是的，youtube 似乎没有开发他们的 oEmbed API 代码，因为 videoFrameSize 返回 470 x 270 像素。 但至少它可以让你动态地抓住一些东西！

使用“Lee taylor”提出的“suck it ans see”方法是实现此目的的 KISS 方式，但如果您需要动态内容，则不理想。

好的 - 请记住 oEmbed 提供的不准确尺寸 - 它确实提供了解决方案。

我目前正在为所有链接到 YouTube 视频的图库中的视频内容开发 strusturedData 生成器。

这是从 youtube 获取维度的不准确方法，但至少是其数据！

如何从 youtube 获取视频大小。

第 1 阶段： 从 youtube 调用 oEmbed 数据::

$video_id = "your youtube videos unique ID number ";

$oEmbed         = simplexml_load_file('http://www.youtube.com/oembed?url=http%3A//www.youtube.com/watch?v=' . $video_id . '&format=xml');

第 2 阶段：

    $data['height'] = $oEmbed->height;
    $data['width']  = $oEmbed->width;

    $data['videoFrameSize'] = $oEmbed->height . "x" . $oEmbed->width . "px";

第 3 阶段：

在你的编码中使用你觉得最好的变量::

【讨论】：

它不起作用。如果我上传 300x250 像素的视频，我会得到： "type":"video","html":"\u003ciframe .... "height":344,"width":459... 没有它说 300x250，而 459x344 与 300x250 的比例（宽/高比）不同

【参考方案5】：

如果你像这样加载youtube视频，只有在视频加载后才能触发javascript函数。

<script src="https://www.youtube.com/iframe_api"></script>
    <center>
        <div class="videoWrapper">
           <div id="player"></div>
        </div>
    </center>
<script>
    function onYouTubeIframeAPIReady() 
        player = new YT.Player('player', 
            videoId:'xxxxxxxxxxx',playerVars:   controls:0,autoplay:0,disablekb:1,enablejsapi:1,iv_load_policy:3,modestbranding:1,showinfo:0,rel:0,theme:'light' 
         );
        resizeHeroVideo();
    
</script>

视频加载后调用resizeHeroVideo。

var player = null;
$( document ).ready(function() 
    resizeHeroVideo();
 );

$(window).resize(function() 
    resizeHeroVideo();
);

function resizeHeroVideo() 
    var content = $('#hero');
    var contentH = viewportSize.getHeight();
    contentH -= 158;
    content.css('height',contentH);

    if(player != null) 
        var iframe = $('.videoWrapper iframe');
        var iframeH = contentH - 150;
        if (isMobile) 
            iframeH = 163; 
        
        iframe.css('height',iframeH);
        var iframeW = iframeH/9 * 16;
        iframe.css('width',iframeW);
    

然后我们计算尺寸以使其在页面中心的位置保持在适当的 16:9 纵横比。

Complete gist here.Live example here.