javascript 使用 oembed 嵌入 YouTube 视频
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7124118/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Embed youtube videos using oembed
提问by Karsten
I want to use oembed to get the embed code from youtube links with jQuery:
我想使用 oembed 从带有 jQuery 的 youtube 链接中获取嵌入代码：
var url = "http://www.youtube.com/watch?v=iwGFalTRHDA";
url = encodeURIComponent(url);
$.getJSON('http://youtube.com/oembed?url='+url+'&format=json', function(data) {
console.log(data);
});
Well I don't get any data.
好吧，我没有得到任何数据。
Funny thing is, that if I browse to the url I get the right response:
有趣的是，如果我浏览到 url，我会得到正确的响应：
http://www.youtube.com/oembed?url=http%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3DiwGFalTRHDA&format=json`
leads me to
带我去
{
provider_url: "http://www.youtube.com/"
title: "Trololo"
html: "<object width="425" height="344"><param name="movie" value="http://www.youtube.com/v/iwGFalTRHDA?version=3"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/iwGFalTRHDA?version=3" type="application/x-shockwave-flash" width="425" height="344" allowscriptaccess="always" allowfullscreen="true"></embed></object>"
author_name: "KamoKatt"
height: 344
thumbnail_width: 480
width: 425
version: "1.0"
author_url: "http://www.youtube.com/user/KamoKatt"
provider_name: "YouTube"
thumbnail_url: "http://i2.ytimg.com/vi/iwGFalTRHDA/hqdefault.jpg"
type: "video"
thumbnail_height: 360
}
I also used the jquery oembed plugin, but the onError option is always thrown, also if the request was successful.
我也使用了 jquery oembed 插件，但是 onError 选项总是被抛出，如果请求成功也是如此。
I'm really looking forward for some ideas...
我真的很期待一些想法......
回答by mjhm
Actually the problem is you're violating the browser same origin policy with a cross domain ajax request. There a few work potential work arounds -- unfortunately the best JSONP, isn't implemented by YouTube. The next best is using Flash for transport. This is used by YUI-IO utility. Also you can see Jquery suggestions here.
实际上，问题是您使用跨域 ajax 请求违反了浏览器同源策略。有一些潜在的解决方法——不幸的是，最好的JSONP 不是由 YouTube 实现的。其次是使用 Flash 进行传输。这是由YUI-IO 实用程序使用的。您也可以在此处查看Jquery 建议。
回答by Marc B
I get the json data just fine if I embed the raw trololo url in the oembed url. I'm guessing that by typing in the encoded version into the address bar does a layer of decoding anyways, so try just sending the raw one:
如果我将原始 trololo url 嵌入到 oembed url 中，我就可以很好地获得 json 数据。我猜想通过在地址栏中输入编码版本无论如何都会进行一层解码，所以尝试只发送原始版本：
http://youtube.com/oembed?url=http://www.youtube.com/watch?v=iwGFalTRHDA&format=json
回答by jbdemonte
Use the json-c version: https://developers.google.com/youtube/2.0/developers_guide_jsonc
使用 json-c 版本：https: //developers.google.com/youtube/2.0/developers_guide_jsonc
var id = "iwGFalTRHDA";
$.ajax({
url: "https://gdata.youtube.com/feeds/api/videos/" + id + "?v=2&alt=jsonc",
dataType: "jsonp",
success: function (data) {
console.log(data);
}
});
回答by Aurélien Gateau
I had a similar problem, turns out that the urlquery string parameter was using the www.youtube.comdomain, whereas my call to the oembed endpoint was using youtube.com/oembed. Using www.youtube.com/oembedfixed the problem.
我遇到了类似的问题，结果是url查询字符串参数使用的是www.youtube.com域，而我对 oembed 端点的调用使用的是youtube.com/oembed. 使用www.youtube.com/oembed修复了问题。
回答by OdraEncoded
Got the same problem. I have "solved" this by having a url in my server download the JSON and then send it the client.
遇到了同样的问题。我通过在我的服务器中有一个 url 下载 JSON 然后将它发送到客户端来“解决”这个问题。
