ASP.NET Core 5.0搭配React.JS获取数据时出现连接拒绝错误

net::ERR_CONNECTION_REFUSED 错误发生在TCP连接建立阶段，说明请求根本没有成功发送到后端服务，和CORS拦截无关——CORS拦截是服务端收到请求后返回跨域响应头才会触发的报错，连接被拒阶段还没走到跨域校验逻辑。

核心问题1：API地址端口配置错误 #

你当前环境变量配置的REACT_APP_API_URL=https://localhost:3000指向的是React开发服务器默认端口，不是ASP.NET Core Web API的监听端口，请求发到React服务自身自然会被拒绝。

• 先单独启动ASP.NET Core后端项目，查看控制台输出的实际监听地址，默认本地开发端口一般为http://localhost:5000、https://localhost:5001，如果是自定义launchSettings配置，以控制台打印的Now listening on:后面的地址为准
• 修改React项目.env文件中的API地址为后端实际监听地址，示例：

REACT_APP_API_URL=https://localhost:5001

注意：修改环境变量后必须完全重启React开发服务，新的环境变量才会生效

核心问题2：CORS中间件未正确启用 #

你仅在ConfigureServices中添加了CORS服务配置，没有在HTTP请求管道中注册CORS中间件，配置不会实际生效。
打开后端项目的Startup.cs文件，找到Configure方法，在app.UseRouting()之后、app.UseAuthorization()和端点映射配置之前添加CORS中间件引用，顺序不能错：

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
    // 原有默认配置（异常处理、静态文件等）保持不变
    app.UseRouting();

    // 新增这行启用CORS
    app.UseCors();

    app.UseAuthorization();

    app.UseEndpoints(endpoints =>
    {
        endpoints.MapControllers();
    });
}

修改完成后重启后端服务。

核心问题3：相对路径请求未配置开发代理 #

你之前尝试使用相对路径const baseUrl = 'api/todo'请求失败，是因为React开发服务默认不会转发接口请求到后端，请求会直接发到React服务自身的3000端口，找不到对应资源。
推荐本地开发时配置代理解决这个问题，不需要硬编码后端全路径，也能规避跨域问题：

1. 在React项目根目录（和package.json同级）新建setupProxy.js文件，写入以下配置：

const { createProxyMiddleware } = require('http-proxy-middleware');

module.exports = function(app) {
  app.use(
    '/api',
    createProxyMiddleware({
      target: 'https://localhost:5001', // 替换为你后端实际监听地址
      changeOrigin: true,
      secure: false // 本地开发用自签名HTTPS证书时添加该配置，跳过证书校验
    })
  );
};

2. 安装代理依赖包：

npm install http-proxy-middleware --save-dev

3. 把前端接口baseUrl改为相对路径：

const baseUrl = `/api/todo`;

修改完成后重启React开发服务即可。

连通性前置校验方法 #

启动后端服务后，直接在浏览器地址栏访问后端测试接口（比如https://localhost:5001/todo），如果能正常返回接口数据，说明后端服务启动正常，再启动前端对接即可；如果浏览器直接提示无法访问，优先排查后端启动状态、端口占用、防火墙拦截问题。

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