我们可以更改返回的 oembed YouTube iframe 宽度和高度吗？答案

【问题标题】：Can we change the returned oembed YouTube iframe width and height?我们可以更改返回的 oembed YouTube iframe 宽度和高度吗？
【发布时间】：2020-12-23 03:17:09
【问题描述】：

现在 YouTube 返回分钟。宽度和高度。如何调整GET调用来改变返回html？例如：


"html": "<iframe width=\"400\" height=\"260\" src=\"https://www.youtube.com/embed/kFz9afj8lu0?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen></iframe>"

当前 https://www.youtube.com/oembed?url=https://www.youtube.com/watch?v=kFz9afj8lu0

{
"title": "Can You Actually Game in 8K? (RTX 3090 Gameplay!)",
"author_name": "Marques Brownlee",
"author_url": "https://www.youtube.com/c/mkbhd",
"type": "video",
"height": 113,
"width": 200,
"version": "1.0",
"provider_name": "YouTube",
"provider_url": "https://www.youtube.com/",
"thumbnail_height": 360,
"thumbnail_width": 480,
"thumbnail_url": "https://i.ytimg.com/vi/kFz9afj8lu0/hqdefault.jpg",
"html": "<iframe width=\"200\" height=\"113\" src=\"https://www.youtube.com/embed/kFz9afj8lu0?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen></iframe>"
}

【问题讨论】：

标签： javascript youtube youtube-api

【解决方案1】：

看起来有一个 oEmbed 规范：https://oembed.com

如果你向下看部分

2.2。消费者要求

您会注意到有maxwidth 和maxheight 选项。

将&maxwidth=400&maxheight=260 添加到您的 GET 请求中，如下所示：

https://www.youtube.com/oembed?url=https://www.youtube.com/watch?v=kFz9afj8lu0&maxwidth=400&maxheight=260

这将返回以下内容：

{
  "title": "Can You Actually Game in 8K? (RTX 3090 Gameplay!)",
  "author_name": "Marques Brownlee",
  "author_url": "https://www.youtube.com/c/mkbhd",
  "type": "video",
  "height": 225,
  "width": 400,
  "version": "1.0",
  "provider_name": "YouTube",
  "provider_url": "https://www.youtube.com/",
  "thumbnail_height": 360,
  "thumbnail_width": 480,
  "thumbnail_url": "https://i.ytimg.com/vi/kFz9afj8lu0/hqdefault.jpg",
  "html": "\u003ciframe width=\u0022400\u0022 height=\u0022225\u0022 src=\u0022https://www.youtube.com/embed/kFz9afj8lu0?feature=oembed\u0022 frameborder=\u00220\u0022 allow=\u0022accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\u0022 allowfullscreen\u003e\u003c/iframe\u003e"
}

decodeURIComponent 之后的 html 属性现在看起来像您的示例：

<iframe width=\"400\" height=\"225\" src=\"https://www.youtube.com/embed/kFz9afj8lu0?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen></iframe>

【讨论】：