Как получить данные JSONP в виде объекта javascript

#javascript #jquery #ajax #json

Вопрос:

Я пытаюсь получить данные JSONP, чтобы я мог проанализировать их в javascript. У меня есть некоторые фиктивные данные, которые я могу проанализировать, которые выглядят следующим образом:

 var employees = [
    { "Cost": 50, "Date": "2014-05-25T00:00:00", "Distance": "5k", "Id": "137", "Location": "Salt Lake City", "Name": "Employee 1", "Type": "normal" },
    { "Cost": 50, "Date": "2014-05-25T00:00:00", "Distance": "5k", "Id": "138", "Location": "Provo", "Name": "Employee 2", "Type": "normal" },
    { "Cost": 50, "Date": "2014-05-25T00:00:00", "Distance": "5k", "Id": "139", "Location": "Ogden", "Name": "Employee 3", "Type": "normal" }
];

Но когда я пытаюсь получить те же данные из RESTful API на другом сервере, используя JSONP, это не работает. Я хотел бы иметь возможность получать данные в том же формате, что и макет данных. Я не знаю, является ли способ, которым я запрашиваю, неправильным, но это то, что я подозреваю, потому что данные есть, и в формате JSONP. Вот как я запрашиваю это:

 var employees;
var url = 'http://marketing.wasatchtechies.com/api/JSONraces/callback=?';

$.ajax({
    type: 'GET',
    url: url,
    async: true,
    contentType: "application/json",
    dataType: 'jsonp',
    success: function (data) {
        employees = data;
    },
    error: function (err) {
        // nothing
    }
});

Спасибо, что взглянули.

Редактировать: когда вы переходите по этой ссылке http://marketing.wasatchtechies.com/api/JSONraces ?обратный вызов =foobar вы получаете следующее:

 foobar([{"id":137,"name":"JE Cosgriff Tiger Trot","location":"Salt Lake City","date":"2014-05-25T00:00:00","url":"http://www.utahrunning.com/events/race/ref/JE-Cosgriff-Tiger-Trot","distance":"5k","cost":"50        ","type":"normal"},{"id":138,"name":"Race for Grief Event","location":"West Bountiful","date":"2014-05-26T00:00:00","url":"http://www.utahrunning.com/events/race/ref/Race-for-Infant--Pregnancy-Loss---10K-run--2-mile-awareness-walk","distance":"5k","cost":"45        ","type":"normal"},{"id":139,"name":"Heber Valley Memorial Run","location":"Heber City","date":"2014-05-26T00:00:00","url":"http://www.utahrunning.com/events/race/ref/Heber-Valley-Memorial-Run","distance":"5k, mile","cost":"35        ","type":"glow"}]);

1. где ваша функция обратного вызова? JSONP работает путем включения скрипта на вашу страницу, который будет вызывать функцию с вашими данными в качестве аргументов функции. jQuery автоматически сопоставит это, если у вас есть callback=? в URL, и будет использовать функцию, установленную в option success

2. вам нужна функция успеха, а затем назначить сотрудников для responseText

3. Спасибо за ваши комментарии, я только что отредактировал свой код на основе ваших комментариев, и он все еще не работает. Правильно ли я реализовал ваши комментарии?

4. async: false не работает с jsonp. прекратите использовать async false.

5. Нам нужно видеть фактический ответ от сервера при посещении его по следующему URL: http://marketing.wasatchtechies.com/api/JSONraces/callback=foobar . Если они не совпадают foobar(<array or object here>) , то служба не поддерживает jsonp в этой конечной точке.

Ответ №1:

Вы просто устанавливаете это в обратном вызове:

 var employees;

$.ajax({
  type: 'GET',
  url: url,
  contentType: "application/json",
  dataType: 'jsonp',
  success: function(data) {
    employees = data; 
  }
});

Ответ №2:

Вам не хватает метода обратного вызова

метод успеха и ошибки в вашем запросе ajax. Что-то вроде этого

 var employees = $.ajax({
    type: 'GET',
    url: url,
    async: false,
    contentType: "application/json",
    dataType: 'jsonp',
    success: function(result) {
        // access your mock data in result
    },
    error: function(err) {
         // acces err object to handle the error
    }
});