意外的令牌“：”从节点和快递返回 JSON答案

【问题标题】：Unexpected token ":" with JSON returned from node and express意外的令牌“：”从节点和快递返回 JSON
【发布时间】：2017-06-04 22:25:32
【问题描述】：

我正在使用 Node.js 和 Express 构建一个小型 Web 服务，但遇到了一些问题。一切似乎都很好，直到我真正在浏览器中使用 Ajax。如果我在 Postman 中运行它，我会得到：

{
  "status": "ok",
  "data": [
    {
      "GUID": "2f779770-9e1c-415f-9518-ff7fd7d6631c",
      "name": "The Revolver",
      "description": "Rye heavy bourbon, coffee liqueur, orange bitters, orange garnish.",
      "active": 1,
      "categories": [
        "94162f2e-3b2f-4521-a543-068ed6c81011"
      ]
    },
    {
      "GUID": "f05a33ad-e684-4ae0-804c-0c1a61b9945d",
      "name": "Jack Rose",
      "description": "Laird's Applejack, Grenadine, Lemon, Peychaud's bitters, Lemon twist",
      "active": 1,
      "categories": []
    }
  ]
}

标题包括 Content-Type →application/json; charset=utf-8

但是当我进行 ajax 调用时，Chrome 显示“Uncaught SyntaxError: Unexpected token :”

我正在使用res.json({status: "ok", data: result}) 从 Express 返回响应。我也试过res.setHeader('Content-Type', 'application/json');，但没有成功。

有什么想法吗？

编辑：这里是 ajax 调用：

function getDrinks(){
  $.ajax({
    url: serviceURL + "getDrinks",
    type: "GET",
    dataType: "jsonp",
    success: function(result){
      if (result.status=="ok"){
        var tableHTML=""
        for (var i = 0; i < result.data.length; i++) {
          var drink=result.data[i]
          tableHTML+="<tr><td>"+drink.name+"</td></tr>"
        }
        tableHTML="<table>"+tableHTML+"</table>"
        $("#drinksContainer").html(tableHTML);
      }
    }
  })
}

【问题讨论】：

显示 ajax 调用
客户端是否期望 JSON 或 JSON-P 来响应其 Ajax 请求？当 JSON 被解析为 JavaScript（JSON-P 就是这样）时，可能会发生此错误。大括号被解释为一个块而不是一个对象初始值设定项，在这种情况下，字符串文字后面不允许有冒号。
哦，详细的，@JonathanLonowski？

标签： javascript json node.js ajax express

【解决方案1】：

客户端和服务器需要就使用 JSON 还是 JSON-P 达成一致。这两种格式相关但不可互换。

目前，客户端期待 JSON-P...

dataType: "jsonp",

当服务器以 JSON 响应时...

res.json({status: "ok", data: result})

对于 JSON-P，服务器的响应应在 JSON 数据周围包含填充，由 callback 名称和括号组成。

var json = JSON.stringify({status: "ok", data: result});
res.send(req.query.callback + '(' + json + ')');

Express 还定义了res.jsonp() 来简化这一点。

res.jsonp({status: "ok", data: result});

而且，jQuery 将为您提供生成的回调名称，通常由您正在使用的 jQuery 版本、随机数和时间戳组成。有了这个，响应应该是这样的：

jQuery32101234567890123456_1496534400000({"status":"ok","data":...});

【讨论】：