javascript - 使用 Javascript 通过 AJAX 从 URL 获取 JSON 响应

Question

我对 Javascript 比较陌生，并且一直在尝试使用 AJAX 从 URL 获取 JSON 数据。

该 url 返回一个包含我想要请求/获取的字符的数组，然后处理数据以在 html 中显示它。该网址是: http://stark-tundra-9859.herokuapp.com/locations

我正在使用的代码如下，问题是我似乎没有收到任何响应。此外，我不知道请求信息变量应该是什么:

function ajax_request() {

requestInfo='';

var params = JSON.stringify(requestInfo);

$.ajax({
  type: "GET",
  url: 'http://stark-tundra-9859.herokuapp.com/locations',
  data: params,
  contentType: "application/json",
  dataType: "json",
  converters: {
    'text json': true
  },

  success: function(response) {
    $("#responseParagraph").html(response);

  },
  error: function(error) {
    $("#responseParagraph").html(error.responseText);

  }
});

}

@agam360，我还使用 JQUERY 完成了此代码的一个版本，并且我确实在控制台中收到一条消息，如下所示:

获取http://stark-tundra-9859.herokuapp.com/locations 200 OK 198ms

响应头 连接保持事件状态 内容长度 154 内容类型 application/json;charset=utf-8 服务器瘦 1.5.1 代号 Straight Razor X-Content-Type-Options nosniff

请求头 接受 application/json、text/javascript、/； q=0.01 接受编码 gzip、deflate 接受语言 es-ES,es;q=0.8,en-US;q=0.5,en;q=0.3 连接保持事件状态 主机 stark-tundra-9859.herokuapp.com 原点为空 用户代理 Mozilla/5.0(Windows NT 6.1；rv:16.0)Gecko/20100101 Firefox/16.0

用于接收该答案的代码如下:

function json_request() {

$.getJSON(url,
    function(data) {
        alert(data);
        $('#responseParagraph').append("<p>"+data.responseMessage+"</p>");
    });

}

在这个 JQUERY 中，似乎我没有正确接收来自 JSON 请求的数据。也许我处理错误？

如果您能提前提供帮助，我将不胜感激!

Answer 1

要回答这个问题，我需要问你两件事:
1)您在哪个域上运行此脚本？ (与“http://stark-tundra-9859.herokuapp.com/”在同一台服务器上？)
因为该 URL 不允许 CORS (跨源资源共享)

2) 打开您的控制台(在 Chrome 中:Ctrl+shift+j)并告诉我们您收到的错误消息(如果有的话)。

如果您对第一个问题的回答是否(意味着您没有在同一主机上运行脚本)，那么，如果您可以控制该页面，请通过发送以下 header 来启用 CORS ( 请在实现之前阅读一些与安全相关的信息):

Access-Control-Allow-Origin: *

更多特定于语言的实现可以在 enable-cors.org 上找到。 (如果您不愿意使用 CORS，您还可以阅读有关跨域请求的“JSONP”实现)。

另一方面，(您的答案是是)，我们需要查看您的服务器端相关代码，以及客户端抛出的任何错误消息。

注意:据我所知(截至目前 - 发布答案后 5 分钟)，http://stark-tundra-9859.herokuapp.com/locations URL 返回“500 - 内部服务器错误” - 您的问题似乎与服务器端相关。

更新， 获取数据后，您需要将其作为 JSON 对象进行访问，
像这样:

data[0].lat // will hold the lat value of the first object in the JSON wrapper object

关于使用 jQuery 实现 JSONP，我在 SO 中进行了快速搜索，您可能会想看一下:jQuery AJAX cross domain