在AJAX调用中获取数据

Question

我有一个按钮，然后单击按钮，我想使用AJAX调用获取JSON数据，这是我在按钮单击中尝试的代码。但它不起作用

    function loadXMLDoc() {
        var request = $.ajax({

            url: 'https://api.flightstats.com/flex/airports/rest/v1/json/iata/SAN?appId=952b68c2&appKey=9d5a372da9f88679ac97a60c1e0c58f9',
            type: 'POST',
            //data: $("#ganttForm").serialize(),
            dataType: 'json',
            accepts: {
                json: "application/json"
            },
            headers: {
                Accept: "application/json; charset=utf-8",
                "Content-Type": "application/json; charset=utf-8"
            },

            success: function (data) {
                alert('success')
                var data1 = $.parseJSON(data);
                alert(data1);
                //console.log(window.JSON.parse(data));
                //alert(obj.ganttdata) 
                //console.log($.parseJSON(data.d));
                //console.log(JSON.stringify(data1));
                createEmptyGanttChart1(data1);

            },

            complete: function () {
                alert('complete')
                //  console.log('complete 1!!!!!!!!!!!!!!!!!!!!!!!!');
            },
            failure: function () {
                alert('failure')
                //  console.log('complete 1!!!!!!!!!!!!!!!!!!!!!!!!');
            }
        });
    }

Answer 1

您正在尝试执行跨域Ajax请求，因为它违反了同源策略 ，所以该请求不起作用。

但是，api.flightstats.com网站似乎确实支持jsonp-至少在我将URL修改为此时：

https://api.flightstats.com/flex/airports/rest/v1/jsonp/iata/SAN?appId=952b68c2&appKey=9d5a372da9f88679ac97a60c1e0c58f9
// Note the "p" that I've added here -----------------^

...它以jsonp格式返回响应。 因此，请尝试以下代码：

    var request = $.ajax({

        url: 'https://api.flightstats.com/flex/airports/rest/v1/jsonp/iata/SAN?appId=952b68c2&appKey=9d5a372da9f88679ac97a60c1e0c58f9',
        type: 'POST',
        //data: $("#ganttForm").serialize(),
        dataType: 'jsonp',   // NOTE the type is 'jsonp' not 'json'

        success: function (data) {
            alert('success')
            alert(data);
            createEmptyGanttChart1(data);  // NOTE no need to parse data

        },

        complete: function () {
            alert('complete')
            //  console.log('complete 1!!!!!!!!!!!!!!!!!!!!!!!!');
        },
        failure: function () {
            alert('failure')
            //  console.log('complete 1!!!!!!!!!!!!!!!!!!!!!!!!');
        }
    });

演示： http ： //jsfiddle.net/Lc8H8/

注意，不需要使用$.parseJSON(data)因为jQuery会自动为您解析响应，并且data已经是一个对象。

Answer 2

尝试这样的事情

改变这个

dataType: 'json',

至

dataType: 'jsonp',