React前端代理配置失效：请求未转发至Flask后端问题排查

核心问题：你用的是Vite搭建的React项目（默认端口5173），但package.json里的proxy字段是Create React App（CRA）专属配置，Vite不识别这个规则，所以代理完全没生效，请求自然还是打到了前端的5173端口。

关键排查点与修复步骤 #

• 别折腾导入package.json：代理是开发服务器的规则，和前端代码导入无关，这么做完全没用。
• 区分构建工具：5173是Vite默认开发端口，CRA默认是3000，你用的是Vite，得用Vite的代理配置方式。

正确配置Vite代理 #

在项目根目录创建/修改vite.config.ts（JS项目用vite.config.js），添加代理规则：

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'

export default defineConfig({
  plugins: [react()],
  server: {
    proxy: {
      // 匹配/members开头的请求，代理到后端地址
      '/members': {
        target: 'http://localhost:2371',
        changeOrigin: true
      },
      // 如果后续有其他接口，可统一匹配前缀，比如：
      // '/api': {
      //   target: 'http://localhost:2371',
      //   changeOrigin: true
      // }
    }
  }
})

验证生效 #

1. 保存配置后重启Vite开发服务器（必须重启，新配置才会生效）
2. 再用fetch("/members")发起请求，此时会自动代理到http://localhost:2371/members

补充说明 #

你之前用完整地址能正常工作，是因为后端已经配置了CORS(app)允许跨域，但代理的作用就是在开发阶段避免跨域，同时不用写冗长的完整地址。如果后续接口有统一前缀，建议把代理规则改成匹配前缀，这样所有对应请求都会被自动代理，更灵活。

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