使用 oembed 嵌入 YouTube 视频

发布于 2024-11-30 11:26:38 字数 1384 浏览 0 评论 0原文

我想使用 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);
});

好吧,我没有得到任何数据。

有趣的是,如果我浏览到该 url,我会得到正确的响应:

http://www.youtube.com/oembed?url=http%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3DiwGFalTRHDA&format=json` 

导致我

{
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
}

也使用了 jquery oembed 插件,但总是抛出 onError 选项,即使请求成功也是如此。

我真的很期待一些想法......

I want to use oembed to get the embed code from youtube links with jQuery:

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:

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.

I'm really looking forward for some ideas...

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(5

女皇必胜 2024-12-07 11:26:39

实际上,问题是您使用跨域 ajax 请求违反了浏览器同源策略。有一些潜在的解决方法 - 不幸的是,最好的 JSONP 尚未实现由 YouTube 提供。次佳方案是使用 Flash 进行传输。这是由YUI-IO 实用程序使用的。您还可以在此处查看 Jquery 建议

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.

风筝在阴天搁浅。 2024-12-07 11:26:39

如果我将原始 trololo url 嵌入到 oembed url 中,我就能很好地获取 json 数据。我猜测通过在地址栏中输入编码版本无论如何都会进行一层解码,所以尝试只发送原始版本:

http://youtube.com/oembed?url=http://www.youtube.com/watch?v=iwGFalTRHDA&format=json

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:

http://youtube.com/oembed?url=http://www.youtube.com/watch?v=iwGFalTRHDA&format=json
心清如水 2024-12-07 11:26:39

我遇到了类似的问题,结果是 url 查询字符串参数使用 www.youtube.com 域,而我对 oembed 端点的调用使用 youtube.com/oembed。使用 www.youtube.com/oembed 解决了该问题。

I had a similar problem, turns out that the url query string parameter was using the www.youtube.com domain, whereas my call to the oembed endpoint was using youtube.com/oembed. Using www.youtube.com/oembed fixed the problem.

梦初启 2024-12-07 11:26:39

遇到同样的问题。我通过在服务器中使用 URL 下载 JSON 然后将其发送给客户端来“解决”了这个问题。

Got the same problem. I have "solved" this by having a url in my server download the JSON and then send it the client.

‘画卷フ 2024-12-07 11:26:39

使用 json-c 版本:https://developers.google.com/youtube/2.0/developers_guide_jsonc< /a>

    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);
        }
    });

Use the json-c version: 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);
        }
    });
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文