ReactJS对接C# .NET后端特定接口响应极慢无返回问题排查求助

可能的核心原因 #

后端侧（概率最高，优先排查） #

• 序列化死循环：接口返回的DTO/实体存在循环引用（例如EF Core导航属性双向关联），JSON序列化器未配置循环引用忽略规则，陷入无限序列化流程，无法生成响应内容，导致TTFB无限拉长
• 返回数据量暴增：业务数据增长导致该接口单次返回数据量较之前翻了数十上百倍，未做分页限制，序列化+传输耗时远超预期
• 自定义中间件异常：全局响应包装、日志、加密类中间件存在边界处理bug，仅对该接口的返回类型/内容处理时卡住，未正常将响应刷入输出流
• 响应流操作错误：接口内存在手动操作HttpContext.Response输出流的逻辑，未正确调用Flush/CompleteAsync方法，导致响应一直处于未完成状态

前端侧（仅Postman调用正常时排查） #

• axios响应拦截器边界bug：该接口返回的响应头、状态码、内容格式刚好触发拦截器的未兼容逻辑（例如解密逻辑异常、特殊Content-Type处理死循环），未正常抛出错误也未把响应返回给业务代码
• 请求参数异常：前端传参较之前发生了预期外的变化（例如参数类型错误、传了超大体积的参数），导致后端逻辑进入未覆盖的分支
• 超时配置异常：该接口单独配置了无限超时，未触发axios的超时抛出逻辑，一直处于等待状态

分步排查流程 #

第一步：定位问题端 #

直接用Postman/APIFox等接口调试工具复现请求参数调用该接口：

若接口调用同样卡顿无返回，可完全排除前端问题，所有排查工作放在后端
若接口可正常快速返回，再执行前端侧排查

第二步：后端侧排查操作 #

• 在控制器return语句前、全局中间件响应结束节点分别加日志，确认是否执行到了返回后逻辑，判断卡在序列化环节还是中间件环节
• 临时修改接口查询逻辑，增加Take(10)限制返回条数，若可正常返回，说明问题为循环引用或数据量过大，检查JSON序列化配置：
  若使用System.Text.Json，添加配置：builder.Services.AddControllers().AddJsonOptions(opt => opt.JsonSerializerOptions.ReferenceHandler = ReferenceHandler.IgnoreCycles);
  若使用Newtonsoft.Json，添加配置：builder.Services.AddControllers().AddNewtonsoftJson(opt => opt.SerializerSettings.ReferenceLoopHandling = ReferenceLoopHandling.Ignore);
• 临时注释所有自定义中间件，仅保留基础路由、控制器映射逻辑，若接口恢复正常，逐个启用中间件定位问题组件

第三步：前端侧排查操作 #

• 对比Chrome网络面板中该接口的请求头、请求体，和Postman的请求参数完全对齐，排除参数不一致问题
• 临时用原生fetch替换axios调用该接口，若可正常拿到返回，说明问题出在axios配置/拦截器
• 临时注释全局axios请求、响应拦截器，单独调用该接口，若恢复正常，逐步放开拦截器定位问题逻辑
• 检查该接口的axios请求配置，是否单独设置了超长/无限超时，未触发超时错误

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