AngularJS 1.3.13请求返回200却触发错误回调问题求助

我之前碰到过好几个类似的AngularJS 1.x的奇葩问题，结合你提供的URL、响应头和代码来看，核心问题大概率出在JSON解析环节——虽然浏览器控制台能看到合法的JSON，也返回了200状态码，但AngularJS 1.3的内置响应解析逻辑比浏览器更严格，导致解析失败进而触发错误回调。下面给你具体的排查方向和解决办法：

可能的触发原因 #

• 响应带UTF-8 BOM标记：有些服务端返回的JSON开头会偷偷带个\ufeff（字节顺序标记），浏览器控制台会自动忽略这个字符，但AngularJS的angular.fromJson会因为这个额外字符直接抛出解析错误。
• JSON格式不符合AngularJS 1.3的严格要求：从1.3版本开始，AngularJS对JSON的校验比原生JSON.parse更严格——比如不允许数组/对象末尾有多余逗号、不允许加JavaScript风格的注释，这些情况浏览器能兼容，但AngularJS会判定为无效JSON。
• Content-Type头的小细节：虽然响应头显示是application/json，但如果存在大小写问题（比如Application/Json）或者附带了额外参数（比如application/json; charset=utf-8），也可能导致AngularJS的响应类型判断异常，触发错误处理。

针对性解决办法 #

办法1：自定义transformResponse，手动处理解析逻辑 #

绕过AngularJS的自动解析，自己来处理响应文本，包括清理可能的BOM和容错解析：

var oohahhel = $sce.trustAsResourceUrl(urlVar);
$http.get(oohahhel, {
  transformResponse: function(data) {
    // 先移除可能存在的UTF-8 BOM
    data = data.replace(/^\ufeff/, '');
    try {
      // 先用AngularJS的解析，如果失败再试原生JSON.parse
      return angular.fromJson(data);
    } catch (e) {
      console.error('AngularJS解析失败，尝试原生解析:', e);
      try {
        return JSON.parse(data);
      } catch (e2) {
        console.error('原生解析也失败了:', e2);
        return {}; // 返回空对象避免触发错误回调，或者根据需求调整
      }
    }
  }
})
.then(function success(response) {
  // 这里的response.data就是解析好的JSON对象了
  console.log('终于拿到数据啦:', response.data);
  // 你的业务处理逻辑
}, function error(reason) {
  // 现在只有真正的网络错误才会走到这里，比如跨域、404之类的
  console.error('真·请求错误:', reason);
});

办法2：提前清理不规范的JSON内容 #

如果服务端返回的JSON有多余逗号、注释这类不规范内容，你可以在解析前先清理：

transformResponse: function(data) {
  data = data.replace(/^\ufeff/, '');
  // 移除单行注释
  data = data.replace(/\/\/.*$/gm, '');
  // 移除多行注释
  data = data.replace(/\/\*[\s\S]*?\*\//g, '');
  // 移除数组/对象末尾的多余逗号
  data = data.replace(/,(\s*[\]}])/g, '$1');
  
  try {
    return JSON.parse(data);
  } catch (e) {
    console.error('清理后还是解析失败:', e);
    return {};
  }
}

办法3：先在控制台验证解析情况 #

你可以先在浏览器控制台里手动测试，快速定位问题根源：

// 从网络面板复制原始的响应文本（不是格式化后的）
var rawResponse = '这里粘贴原始响应文本';

// 测试AngularJS的解析
try {
  angular.fromJson(rawResponse);
  console.log('AngularJS解析成功');
} catch (e) {
  console.log('AngularJS解析失败:', e.message);
}

// 测试原生JSON解析
try {
  JSON.parse(rawResponse);
  console.log('原生JSON解析成功');
} catch (e) {
  console.log('原生解析失败:', e.message);
}

如果AngularJS解析失败但原生成功，那就是AngularJS的严格校验导致的；如果两者都失败，那就是响应本身的JSON格式有问题。

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