无法调用 getJSON 方法获取数据答案

【问题标题】：Cannot call getJSON method to fetch data无法调用 getJSON 方法获取数据
【发布时间】：2016-09-27 11:39:12
【问题描述】：

我正在尝试获取一些 JSON 数据。我可以在普通的网络浏览器中很好地访问数据，就像这样：http://www.ebrent.net/apis/tsp.php?fund=G+Fund&start=2003-01-01&end=2004-01-01，但我无法让它在 jQuery 中工作。我做错了什么？

请看我的jsFiddle：https://jsfiddle.net/MrSnrub/mq31hwuj/

var tsp_api = '//www.ebrent.net/apis/tsp.php?start=2003-01-01&end=2004-01-01';

$.getJSON( tsp_api, function(json) {

  // This alert never gets called.
  alert("Success!");

  // Set the variables from the results array
  var data = json;
  // console.log('Data : ', data);

  // Set the div's text
  $('#div-data').text(data);

});

【问题讨论】：

是否启用了 www.ebrent.net CORS？

标签： php jquery getjson

【解决方案1】：

如果您在不使用 https 的情况下运行服务器，则此方法有效。注意 fetchApi 被用来代替 jquery 库，因为它在浏览器中不可用

var tsp_api = 'https://www.ebrent.net/apis/tsp.php?start=2003-01-01&end=2004-01-01';


function fetchData(url) {
      return fetch(url, {
          method: 'get'
      }).then(function(response) {
          return response.json();
      }).catch(function(err) {
          console.log(error);
      });
  }
 fetchData(tsp_api).then((data)=> console.log(data)).catch((err)=> console.log(err));

这不适用于使用 HTTPS 的 jsfiddle，浏览器将拒绝通过 HTTP 加载任何资源。正如您所尝试的，将 API URL 更改为使用 HTTPS 而不是 HTTP 通常可以解决此问题。但是，您的 ebrent.net 不允许使用 CoRS 进行 HTTPS 连接。因此，您将无法获得 jsfiddle 的结果

【讨论】：

【解决方案2】：

您无法获得结果，因为远程站点没有启用CORS：如果您查看控制台，您会看到：

跨域请求被阻止：同源策略不允许读取远程资源在 http://www.ebrent.net/apis/tsp.php?start=2003-01-01&end=2004-01-01。（原因：CORS 标头“Access-Control-Allow-Origin”缺失）。

您可以使用anyorigin.com 之类的方式绕过 CORS，即：

$.getJSON('http://anyorigin.com/get/?url=http%3A//www.ebrent.net/apis/tsp.php%3Fstart%3D2003-01-01%26end%3D2004-01-01&callback=?', function(data){
    $('#div-data').html(data.contents);
});

【讨论】：

您在哪里看到控制台中的错误？我打开 Firebug 并转到控制台，但我看到的只是一个红色的 X；我没有看到任何提及跨域请求被阻止的内容。
您在 jsfiddle 上的示例显示 2 个错误，第一个是混合内容（使用 https 请求 http），第二个是我在上面发布的。
我认为使用 //www.ebrent.net 而不是 http://www.ebrent.net 或 https://www.ebrent.net 应该可以解决混合内容错误。