JQuery $.getJSON 没有运行答案

【问题标题】：JQuery $.getJSON Not RunningJQuery $.getJSON 没有运行
【发布时间】：2015-01-27 01:04:57
【问题描述】：

我是 J Query 初学者。在 $.getJSON 函数方面需要一些帮助。我正在尝试使用此功能从外部服务器检索数据，但是当我运行它时，我什么也得不到。我经历了无数的教程。这是我的代码示例...

    <script src="//code.jquery.com/jquery-1.11.2.min.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">
    $(document).ready(function(){
        var url='https://api.flightstats.com/flex/airports/samples/v1/lts/Airport_response.json';
        $('#button').click(function(){
            $.getJSON(url,function(json){
                $("#results").append(json.airport.name);
            });     
        });
    });
    </script>


</head>
<body>
    <input type="button" id="button" value="Go">
    <div id="results"></div>

</body>

这是 JSON 文件内容..

{
"airport":
        {
    "fs":"PDX",
    "iata":"PDX",
    "icao":"KPDX",
    "faa":"PDX",
    "name":"Portland International Airport",
    "street1":"7000 NE Airport Way",
    "city":"Portland",
    "cityCode":"PDX",
    "stateCode":"OR",
    "postalCode":"97218",
    "countryCode":"US",
    "countryName":"United States"
        }

        }

我只是想获取“名称”内容。 $.getJSON 是正确的函数还是应该使用 $.ajax 或 $.get？谢谢

【问题讨论】：

为什么要包含两个版本的 jquery？
控制台有错误吗？如果您使用console.log 打印出json.airport.name，会出现什么？
@naomik 因为你永远无法拥有足够的 jQuery。
您不能向第三方服务器发出 Ajax 请求，除非它们启用了 CORS。而这个似乎没有。幸运的是，它们似乎支持 JSONP。看看developer.flightstats.com/api-docs/how_to。
@FelixKling 不过他们似乎支持 JSONP。

标签： javascript jquery html json getjson

【解决方案1】：

这里的问题是 .getJSON 无法返回该 url 的数据。

跨域请求被阻止：同源策略不允许读取位于https://api.flightstats.com/flex/airports/samples/v1/lts/Airport_response.json 的远程资源。这可以通过将资源移动到同一域或启用 CORS 来解决。

如果您控制网站 flightstats.com，则可以为此添加必要的标题。如果您不这样做，您可能想创建一个轻量级的服务器端提取，以使用正确的 CORS 响应显示必要的 json。

有关 CORS 的我无法在 stackoverflow 页面中轻松放置的更多信息，请参阅https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS

【讨论】：

看来完整的答案是 OP 应该切换到 $.get() 并使用 JSONP 作为格式，因为 API 支持它并且它可以跨源工作。
我承认不知道 flightstats.com 在 API 方面提供什么。我正在解决为什么 getJSON 本身不起作用的问题。作为一个 jQuery 片段。但是，是的，如果 flightstats.com 支持 JSONP，那么对于 flightstats.com API 使用的这个非常具体的答案，使用 .get 和 JSONP 的答案会更完整。
@Callek ，CORS 对我来说似乎有点令人困惑。使用 $.get 和 JSONP 效果很好。谢谢大家