我正在尝试获得YouTube视频的大小。我正在使用Gdata API调用来检索基本信息(标题、URL、缩略图和类别),但我找不到视频维度。
我正在使用YouTube Data API服务器端调用在网站上嵌入一些视频,如下所示:http://gdata.youtube.com/feeds/api/videos/z_AbfPXTKms?0=v&1=2&alt=json。不幸的是,没有关于视频尺寸的可靠信息(即使是宽屏幕视频,所有预览图像都是4/3速率)。
我正在努力实现的是将视频完全融入播放器;播放器的宽度是固定的,所以我只需要原始的尺寸,或者至少是比例。
有没有任何方法可以通过Youtube API检索此类数据?
(我的后备计划是将玩家大小设置为4/3,永远不要回头看,但我们非常感谢您的帮助!)
由于YouTube的oEmbed实现,您也可以获得它。示例:
https://www.youtube.com/oembed?url=https://www.youtube.com/watch?v=hUvbb_eUP84&format=xml
CCD_ 1也被接受。
更新2017-接受的答案不再有效
如果你想从以下问题中获得示例视频的尺寸:
- https://www.youtube.com/watch?v=z_AbfPXTKms
然后使用Noembed:尝试这个URL
- 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%3V%3Dz_AbfPXTKms
有关更多信息,请参阅此答案:
- 通过JSON获取Javascript中单个视频(非提要)的Youtube信息
Demo
使用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。
现在有一个解决方案:如果你刮取视频公共页面:
http://www.youtube.com/watch?v=[id]
您可以看到打开的图形宽度和高度标签,例如:
<meta property="og:video:width" content="1920">
<meta property="og:video:height" content="1080">
所以你可以在那里得到尺寸;-)
Isra解决方案的后续内容。是的,youtube似乎还没有开发他们的oEmbed API代码,因为videoFrameSize返回470 x 270 px。但至少它给了你一些可以动态抓取的东西!
使用"Lee taylor"提出的"吸即看"方法是实现这一目标的KISS方法,但如果您需要动态内容,则不理想。
好的,考虑到oEmbed提供的尺寸不准确,它确实提供了一个解决方案。
我目前正在开发一个结构数据生成器,用于所有链接到youTube视频的库中的视频内容。
这是一种从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阶段:
在您的编码中使用您认为最好使用的变量::
如果像这样加载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>
在加载视频之后调用CCD_ 2。
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纵横比。
完整的要点在这里。这里是一个活生生的例子。