我如何将 jsonp 解析为 javascript 对象？

Question

我正在使用返回 jsonp 字符串的跨域 api。我想将它解析成一个 javascript 对象，以便更容易使用。 我知道使用 json 字符串你可以这样做：

  success: function (val) {
                    var result = JSON.parse(val);
                }

但如果我使用从 api 获得的 jsonp 执行此操作，我会得到“Uncaught SyntaxError: Unexpected token o”

是我做错了还是这不是用 jsonp 做的方式？

--------编辑 1--------------- 如果我打开它，这就是我的 jsonp 字符串的样子：

Object {resource: "boxscore", parameters: Object, resultSets: Array[22]}
parameters: Object
resource: "boxscore"
resultSets: Array[22]
0: Object
1: Object
2: Object
3: Object
4: Object
 headers: Array[28]
    0: "GAME_ID"
    1: "TEAM_ID"
    2: "TEAM_ABBREVIATION"
    3: "TEAM_CITY"
    4: "PLAYER_ID"
    5: "PLAYER_NAME"
    6: "START_POSITION"
    7: "COMMENT"
length: 28
__proto__: Array[0]
name: "PlayerStats"
rowSet: Array[26]
    0: Array[28]
        0: "0041300201"
        1: 1610612764
        2: "WAS"
        3: "Washington"
        4: 2772
        5: "Trevor Ariza"
        6: "F"
        7: ""
        8: "37:20"
        9: 7
        10: 10
        11: 0.7
        12: 6
1: Array[28]
2: Array[28]
3: Array[28]
4: Array[28]
5: Array[28]
6: Array[28]

所以我想做的是用每个数组中的 header-info 解析数据，我该怎么做？ 因此，例如，如果我想要 GAME_ID，我只需编写 GAME_ID，然后为每个数组获取游戏 ID“0041300201”。

Answer 1

你可以使用 jsonp 库..，如果跨域站点提供 json sting 会很好：

go to this link it may be helpful.

http://www.jquery4u.com/function-demos/jsonp/

or you can use the code like


    /* Loading JSON objects using JSONP */
    (function($) {
        var url = 'http://www.jquery4u.com/scripts/jquery4u.settings.json';
        $.ajax({
           type: 'GET',
            url: url,
            async: false,
            contentType: "application/json",
            dataType: 'jsonp'
        });
    })(jQuery);

Answer 2

如果您正在获取成功回调并且这是一个 jsonp 调用，则您的 val 参数已经是一个 javascript 对象。

success: function (result) {
    console.log(result);
    console.log(result.someproperty);
}

如果result 是一个对象，这也解释了您的错误，因为JSON.parse({}) 会引发相同的错误。

SyntaxError: Unexpected token o

相当于

JSON.parse("[object Object]"); // now you see where `o` came frome

Answer 3

如果您正在访问支持 JSONP 并且有 jQuery 可用的远程 API，则可以轻松跳过中间解析步骤：

// Assuming you have jQuery available:
$.ajax('http://example.com/jsonpapi?callback=?', {
  dataType: 'jsonp',
  success: function(data) {
    // No parsing necessary.
    console.log(data);
  }
});

这会注入一个指向您的 JSONP 端点的脚本元素，并且该端点通过将 JSON 包装在对 jQuery 自动为您定义的函数的调用中来响应。 callback 是 JSONP 回调的相对标准命名约定，但请仔细检查您的 API 期望什么。

如果你没有 jQuery 可用或者不想使用它，你可以定义一个回调函数并自己注入一个脚本元素：

var jsonpCallback = function(data) {
  console.log(data);
};

var s = document.createElement('script');

s.src = 'http://example.com/jsonpapi?callback=jsonpCallback';

document.getElementsByTagName('head')[0].appendChild(s);

这基本上就是 jQuery 在 JSONP 场景中为您所做的。

Answer 4

希望这能解决您的问题：

function jsonp(data) {
  alert('jsonp was called');
}

$.ajax({
  url: 'http://jsfiddle.net/echo/jsonp/?callback=jsonp',
  dataType: 'jsonp',
  data: {
    'foo': 'bar'
  },
  success: function(data) {
    console.log(data);
  }
});

---

实际上，JSONP 根本不是 JSON，它只是 JavaScript 代码。在这种情况下没有理由进行 eval ......你可以在全局定义该函数后简单地做。 jquery 还提供了使用特定 jsonp 回调发出同域 jsonp 请求的方法，如果您必须使用 jQuery 来执行

// Create the function the JSON data will be passed to.
function myfunc(json) {
  alert(json);
}

$.ajax({
  type: "GET",
  url: "http://example.com?keyword=r&callback=jsonp",
  dataType: 'jsonp',
  jsonpCallback: 'myfunc', // the function to call
  jsonp: 'callback', // name of the var specifying the callback in the request
  error: function (xhr, errorType, exception) {
    var errorMessage = exception || xhr.statusText;
    alert("Excep:: " + exception + "Status:: " + xhr.statusText);
  }
});