getJSON 在 IE 中不适用于 Youtube答案

【问题标题】：getJSON is not Working in IE for YoutubegetJSON 在 IE 中不适用于 Youtube
【发布时间】：2012-12-29 13:47:51
【问题描述】：

在这个函数中，我使用 JSON 从 Youtube 检索数据。此功能在 Chrome 和 Mozilla 中有效。但它在 IE 中不起作用。

  function test(url){

      var youtube_id = url.replace(/^[^v]+v.(.{11}).*/,"$1");
     $.getJSON('http://gdata.youtube.com/feeds/api/videos/'+youtube_id+'?v=2&alt=json', function(data) {
      var title = data.entry.title.$t;
      var description = data.entry.media$group.media$description.$t;
      var thumbnail = data.entry.media$group.media$thumbnail[0].url;
       var imgdata = "<img src ='"+thumbnail+"' />";

    alert(title);
      });
      // alert(youtube_id);// Use these variables somewhere

  }

你能帮帮我吗？

提前谢谢！！！

【问题讨论】：

您是否尝试过使用 $.ajax() 方法并将 JSON 设置为数据类型？
您收到的错误信息是什么？您是否尝试从 https 域执行此操作？
@tkone 没有收到任何错误

标签： javascript ajax json youtube-api getjson

【解决方案1】：

这是因为 IE（直到 IE 10）不支持Cross-Domain Resource Sharing。

当您使用 Firefox、Safari、Chrome、Opera 等发出请求时，浏览器首先向服务器发出 OPTIONS 请求，并在标头中查找 Access-Control-Allow-Origin，向浏览器解释哪些外国站点允许对此域提出请求。

来自 gdata API 的标头是：

HTTP/1.1 200 OK
X-GData-User-Country: US
Content-Type: application/json; charset=UTF-8
Access-Control-Allow-Origin: *
Expires: Tue, 15 Jan 2013 15:02:28 GMT
Date: Tue, 15 Jan 2013 15:02:28 GMT
Cache-Control: private, max-age=300, no-transform
Vary: *
GData-Version: 2.1
ETag: W/"C0EGQn47eCp7I2A9WhNbEks."
Last-Modified: Tue, 15 Jan 2013 14:53:43 GMT
Transfer-Encoding: chunked
X-Content-Type-Options: nosniff
X-Frame-Options: SAMEORIGIN
X-XSS-Protection: 1; mode=block
Server: GSE

Access-Control-Allow-Origin: * 标头表示允许在此页面上调用任何外部页面（即，与所访问的 API 不是通过相同协议、主机和端口提供服务的页面）。

但是，IE 不能正确支持该标准。

但是，您可以使用 gdata API 支持的 JSONP 标准来规避这一点。

更改您的 $.getJSON 调用以在 URL 末尾包含 ?。这就是您向jQuery that you'd like to use JSONP 解释拨打电话的方式，这确实允许外国网站。

例如：

var youtube_id = url.replace(/^[^v]+v.(.{11}).*/,"$1");
     $.getJSON('http://gdata.youtube.com/feeds/api/videos/'+youtube_id+'?v=2&alt=json?', function(data) {
        var title = data.entry.title.$t;
        var description = data.entry.media$group.media$description.$t;
        var thumbnail = data.entry.media$group.media$thumbnail[0].url;
        var imgdata = "<img src ='"+thumbnail+"' />";
        alert(title);
      });

【讨论】：