如何通过jQuery从响应获取JSON字符串？弹出undefined问题排查

后端返回的JSON结构和前端取值逻辑不匹配。
你当前后端代码写的return Json(new { json = json });，实际返回给前端的响应结构为：

{
  "json": "{\"percentcomplete\": 10}"
}

你把手动拼接的JSON字符串作为名为json的属性值返回，前端拿到的响应对象顶层根本没有percentcomplete字段，只有一个存着字符串的json属性，所以json.percentcomplete取值结果必然是undefined。

任选一种即可，优先推荐第一种：

• 方案1：后端直接返回匿名对象，不要手动拼接JSON字符串，由框架自动完成序列化
  修改控制器Action代码如下：

  [HttpPost]
  public ActionResult ImportStatus()
  {
      return Json(new { percentcomplete = 10 }); 
  }
  

  修改后接口返回结构为{"percentcomplete":10}，原有前端代码不需要任何改动就能正常弹出10。
• 方案2：如果一定要手动拼接JSON字符串，不要把字符串包在匿名对象中返回，直接指定内容类型返回JSON字符串
  后端代码修改为：

  [HttpPost]
  public ActionResult ImportStatus()
  {
      string json = "{\"percentcomplete\": 10}";
      return Content(json, "application/json"); 
  }
  

  该写法返回的结构和方案1完全一致，前端无需改动。
• 方案3：不修改后端代码，调整前端取值逻辑，先解析嵌套的JSON字符串再取值
  前端AJAX成功回调修改为：

  success: function (res) {
      const data = JSON.parse(res.json);
      alert(data.percentcomplete);    
  }
  

  不推荐该方案，属于冗余的无效逻辑。

内容的提问来源于stack exchange，提问作者Zenacity