从jQuery 1.x升级到2.x时$.ajax失效，返回data为undefined

核心问题分析 #

从jQuery 1.x升级到2.x后，$.ajax的响应解析逻辑变得更严格，一些在1.x中被忽略的不规范设置，会导致2.x无法正确解析响应，最终使done回调中的data为undefined——即便网络面板显示服务器已返回预期响应。

具体解决方案 #

• 移除GET请求的contentType设置
  GET请求没有请求体，contentType是用于定义请求体格式的参数，对GET完全无效。jQuery 1.x会忽略这个错误配置，但2.x的严格处理会干扰响应解析。修改后代码：

  $.ajax({
      type: "GET",
      url: searchUrl,
      cache: true,
  })
  .done(function (data) {
      console.log(data);
  })
  

• 显式指定dataType
  如果服务器返回JSON格式数据，必须明确设置dataType: 'json'。jQuery 2.x对响应类型的自动检测比1.x严格很多，若服务器返回的Content-Type头不符合标准（比如未设置为application/json），自动解析会直接失败，导致data为undefined。示例代码：

  $.ajax({
      type: "GET",
      url: searchUrl,
      dataType: "json",
      cache: true,
  })
  .done(function (data) {
      console.log(data);
  })
  

• 校验服务器响应头
  确认服务器返回的Content-Type头与实际响应格式匹配：

  • 返回JSON时，响应头应为Content-Type: application/json; charset=utf-8
  • 返回纯文本时，对应Content-Type: text/plain
    jQuery 2.x会严格按照响应头解析数据，不匹配的话直接解析失败。

• 添加失败回调排查细节
  增加fail回调捕获错误信息，能快速定位具体问题：

  $.ajax({
      type: "GET",
      url: searchUrl,
      dataType: "json",
      cache: true,
  })
  .done(function (data) {
      console.log(data);
  })
  .fail(function(xhr, status, error) {
      console.log("请求错误状态:", status);
      console.log("错误信息:", error);
      console.log("原始响应内容:", xhr.responseText);
  })
  

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