Asp.Net Core 2.0中Ajax与toastr.js结合的调用异常问题

听起来你遇到的这个问题有点棘手——明明请求返回200且能拿到数据，但Ajax的success和error回调都不触发，还显示请求发起者是toastr.js。我之前也碰到过类似第三方库干扰Ajax全局设置的情况，给你几个排查方向和解决方案：

1. 先确认是不是toastr.js劫持了Ajax请求 #

既然Chrome显示请求发起者是toastr.js，大概率是toastr或其依赖插件修改了jQuery的Ajax全局配置，或者注册了全局Ajax钩子，导致你的自定义回调被覆盖或拦截。

• 临时隔离测试：先注释掉页面中所有toastr相关的引入和调用代码，单独测试你的Ajax请求。如果这时候success/error能正常触发，那问题肯定出在toastr和Ajax的冲突上。
• 检查全局Ajax设置：看看你的代码里有没有$.ajaxSetup()的调用，或者toastr的初始化代码里是否修改了默认的Ajax行为。比如有些toastr扩展会自动给Ajax请求添加提示，但可能不小心覆盖了回调逻辑。

2. 确保Ajax配置与后端返回格式匹配 #

有时候状态码200但回调不触发，是因为响应内容的格式和Ajax期望的不一致，导致jQuery解析失败，进而跳过了success（也可能没走到error，因为状态码是200）。

• 明确指定dataType和contentType：在Ajax请求里加上dataType: 'json'和contentType: 'application/json'，同时把请求数据用JSON.stringify()序列化：

  $.ajax({
      url: '/YourController/YourAction',
      type: 'POST',
      dataType: 'json',
      contentType: 'application/json',
      data: JSON.stringify({ param: yourValue }),
      success: function(data) {
          console.log('Success:', data);
          toastr.success('操作成功');
      },
      error: function(xhr, status, err) {
          console.error('Error:', status, err);
          toastr.error('操作失败');
      },
      complete: function() {
          // 加个complete回调，不管成功失败都会触发，用来排查回调是否执行
          console.log('Ajax请求完成');
      }
  });
  

• 检查后端返回的Content-Type：Asp.Net Core 2.0中用return Json(result)会自动设置Content-Type: application/json，但如果是用return Content()手动返回，一定要指定类型：

  [HttpPost]
  public IActionResult YourAction(string param)
  {
      var response = new { Success = true, Data = "你的数据" };
      // 确保返回正确的JSON格式和内容类型
      return Json(response);
  }
  

3. 排查全局Ajax事件钩子 #

toastr可能注册了全局的$.ajaxComplete()、$.ajaxError()等事件，这些全局钩子会优先于你的自定义回调执行，甚至可能阻止自定义回调触发。

• 查看全局事件注册：在Chrome控制台里执行console.log($.ajaxSettings.complete)，看看有没有被toastr相关的函数覆盖。如果有，可以临时移除这些全局钩子测试：

  // 保存原来的全局complete钩子，测试完再恢复
  var originalComplete = $.ajaxSettings.complete;
  $.ajaxSettings.complete = null;
  // 然后测试你的Ajax请求
  

4. 检查响应内容是否有隐藏错误 #

虽然状态码是200，但响应的JSON可能有语法错误（比如多余的逗号、未闭合的引号），导致jQuery无法解析，这时候success不会触发，而error可能因为状态码是200也不触发。

• 直接查看响应内容：在Chrome Network面板里找到这个请求，查看Response标签页的内容，复制到JSON校验工具里检查格式是否合法。

最后一步：检查版本兼容性 #

确认你用的jQuery版本和toastr版本是否兼容。Asp.Net Core 2.0默认的jQuery版本可能是3.x，有些旧版的toastr可能对jQuery 3.x的Ajax API支持不好，导致冲突。可以尝试升级toastr到最新兼容版，或者降级jQuery到2.x测试。

按这个步骤排查下来，应该能找到问题所在。

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