从外部 JavaScript 访问 JSON 数据答案

【问题标题】：Access JSON data from external JavaScript从外部 JavaScript 访问 JSON 数据
【发布时间】：2015-04-06 12:41:58
【问题描述】：

我想使用原生 JavaScript 来访问一些 MeetUp API 数据。我在我的网站上使用以下代码：

function addScript(src) {
    console.log(src);
    var s = document.createElement( 'script' );
    s.setAttribute( 'src', src );
    document.body.appendChild( s );
}

addScript('https://api.meetup.com/2/groups?callback=?&sign=true&member_id=8377069&page=20&api&key=API_KEY_GOES_HERE&only=name,link');

我正在使用脚本标签来访问数据以避免跨域问题。我很欣赏这可以使用 jQuery 解决，但我不想使用任何外部库。

以上代码返回此错误：

Uncaught SyntaxError: Unexpected token :

我相信这是因为返回了 JSON 格式。我该如何解决这个问题，但同时仍然可以访问 JSON 数据。非常感谢任何帮助。

示例链接：http://jsfiddle.net/londonfed/7ms44ft6/

【问题讨论】：

你在用这个吗：vanilla-js.com?
不熟悉那个网站。我的意思是简单的 javascript :-)

标签： javascript json meetup

【解决方案1】：

您需要在您的 URL 中指定一个回调参数，该参数与用于处理返回数据的函数的名称相同：

function processJSONP(json) {
  console.log(json.results);
}

addScript('https://api.meetup.com/2/groups?callback=processJSONP&sign=true&member_id=8377069&page=20&api&key=5746c1b12324669953258703b11&only=name,link');

请记住，results 是一个需要循环遍历的数组。

【讨论】：

谢谢安迪，就像布尔日的回答一样，效果很好。

【解决方案2】：

由于meetup API支持回调参数，创建一个全局函数（在窗口中）并将回调参数设置为函数名：

function addScript(src) {
    console.log(src);
    var s = document.createElement( 'script' );
    s.setAttribute( 'src', src );
    document.body.appendChild( s );
}

// Callback for loading api data:
window.apiCallback = function(data) {
     // do what you want with the data
     alert(data.results[0].name);
}
addScript('https://api.meetup.com/2/groups?callback=apiCallback&sign=true&member_id=8377069&page=20&api&key=API_KEY_GOES_HERE&only=name,link');

【讨论】：

谢谢布克。发挥了魅力。请您查看我的帖子编辑。