请求协助排查：无法将localhost:3000的/api/products请求代理到http://127.0.0.1:5000

1. 确认后端服务可用性 #

• 直接在浏览器访问http://127.0.0.1:5000/api/products，验证后端是否正常返回响应
• 若后端未启动，先启动服务；若启动后无响应，排查后端端口配置、/api/products路由是否正确

2. 校验前端代理配置 #

• 检查package.json中的代理配置，确保格式正确：

  "proxy": "http://127.0.0.1:5000"
  

• 若需多路径代理，放弃package.json的简单配置，改用http-proxy-middleware，在项目src目录下新建setupProxy.js：

  const { createProxyMiddleware } = require('http-proxy-middleware');
  
  module.exports = function(app) {
    app.use(
      '/api',
      createProxyMiddleware({
        target: 'http://127.0.0.1:5000',
        changeOrigin: true,
      })
    );
  };
  

  安装依赖：执行npm install http-proxy-middleware --save-dev

3. 清理缓存并重启服务 #

• 彻底关闭前端、后端所有进程
• 执行npm cache clean --force清除前端缓存（使用yarn则执行yarn cache clean）
• 先启动后端服务，再启动前端服务

4. 排查端口与防火墙问题 #

• 检查5000端口是否被占用：Windows执行netstat -ano | findstr :5000，Mac/Linux执行lsof -i :5000，占用则杀死对应进程或修改后端端口
• 确认本地防火墙未拦截3000、5000端口的请求

5. 核对请求路径匹配度 #

• 前端发起请求时，使用相对路径/api/products，不要写完整域名路径http://127.0.0.1:5000/api/products
• 检查后端路由是否正确处理/api/products路径，避免前缀不匹配

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