Ajax 请求返回 JSON 但抛出错误答案

【问题标题】：Ajax Request returns JSON but throws errorAjax 请求返回 JSON 但抛出错误
【发布时间】：2017-06-17 22:57:03
【问题描述】：

首先：我搜索了我的错误并找到了一些有用的提示，但它们并没有解决我的错误。在大多数被问到的问题中，问题是无效的 json 响应。

我正在通过咖啡脚本向 Google 地图服务发出 Ajax 请求：

console.log 'widget ready - make request'
distrequest = $.ajax 'https://maps.googleapis.com/maps/api/distancematrix/json',
    type: 'GET'
    data:
      origins: 'London',
      destinations: 'Berlin',
      language: 'de-DE',
      key: 'ACTUALGOOGLEKEY'
    #dataType: 'json' #tried to comment this out - same error
    error: (jqXHR, textStatus, errorThrown) ->
        console.log "Ajax error " + textStatus + " " + errorThrown
    success: (data, textStatus, jqXHR) ->
        console.log "success"
        console.log data

当我检查控制台输出时，我看到 widget ready - make request 被打印出来，然后：Ajax error error

当我通过 Firefox 开发者工具检查我的网络时，我看到以下内容：

Method: GET
Status: 200
File: json?origins=...
Type: json
Response: {
"destination_addresses" : [ "London" ],
"origin_addresses" : [ "Berlin" ],
"rows" : [
   {
      "elements" : [
         {
            "distance" : {
               "text" : "24,7 km",
               "value" : 24732
            },
            "duration" : {
               "text" : "19 Minuten",
               "value" : 1146
            },
            "status" : "OK"
         }
      ]
   }
],
"status" : "OK"
}

首先 - 我假设来自 google api 的 json 格式正确。我看不到任何错误，我没有收到解析错误，我的网络控制台 firefox 识别出 json 类型并向我显示（在我看来）一个有效的 json 对象。 Ajax 错误事件以某种方式被触发 - 但我不知道为什么，errorThrown 根本没有帮助。

抱歉，如果这是重复的 - 有什么想法吗？（我实际上更改了 Origin 和 Destination 以及关于隐私的 Google API Key。返回的值是我请求的正确信息 - 谷歌地图不会认为您可以在 19 分钟内从伦敦到柏林）

编辑：数据类型：“文本”不起作用。 jqXHR.responseText 在错误方法中为空

edit2：我在错误函数中添加了以下代码：

        console.debug(jqXHR.responseText)
        console.log "Response Headers "+jqXHR.getAllResponseHeaders() 
        console.log "Status "+jqXHR.status
        console.log "Status Text "+jqXHR.statusText

这给了我一个 statusText error、一个空的 Header 和 responseText 以及一个状态代码 0

关于这个答案https://stackoverflow.com/a/14507670/5119359 它可能是与 CORS 相关的事情吗？但是我会得到 JSON 对象而不是在我的网络 firefox 开发者控制台中吗？

【问题讨论】：

尝试：“console.debug(jqXHR.responseText);”关于“错误”事件
@OfirBaruch 这给了我一个空行，所以显然没有 responseText

标签： jquery json ajax google-maps-api-3 coffeescript

【解决方案1】：

从另一个来源发送请求我收到回复：Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

我认为这取决于您执行 Ajax 请求的上下文。浏览器默认禁用 CORS 以防止任何数据窥探。我想这是在 Firefox 开发中启用的，因此请求已成功完成。

我不确定您在什么上下文中运行上述代码。如果它在 Node 中以与我相同的设置执行，添加设置 $.support.cors = true 就足够了。

$.support.cors = true
distrequest = $.ajax 'https://maps.googleapis.com/maps/api/distancematrix/json',
    type: 'GET'
    data:
      origins: 'London',
      destinations: 'Berlin',
      language: 'de-DE',
      key: 'ACTUALGOOGLEKEY'
    error: (jqXHR, textStatus, errorThrown) ->
        console.log "Ajax error " + textStatus + " " + errorThrown
    success: (data, textStatus, jqXHR) ->
        console.log "success"
        console.log data

【讨论】：