Netlify部署的React前端无法连接PythonAnywhere的Flask后端如何解决

Create React App 框架package.json中配置的proxy字段仅作用于本地开发环境（npm start启动的内置开发服务器），生产构建（npm run build）生成的静态产物不会包含任何代理逻辑，这是框架的预设设计，并非配置错误。
你部署到Netlify后发起API请求返回404、且PythonAnywhere无日志的原因是：前端默认将请求发送到了Netlify的当前域名下，Netlify没有对应API路由直接返回404，请求根本没有到达PythonAnywhere的服务端。

方案1：使用Netlify内置重写规则（推荐，无需额外配置CORS） #

Netlify支持通过静态重写规则实现代理转发，操作步骤如下：

1. 在React项目的public目录下新建无后缀的规则文件_redirects
2. 在文件中添加如下规则（替换为你自己的PythonAnywhere域名）：

/api/*  https://<你的PythonAnywhere服务域名>/api/:splat  200

规则说明：所有路径前缀为/api的请求，Netlify会自动转发到你的PythonAnywhere服务对应路径，200状态码表示静默重写，前端不会感知到跳转。

注意：需保证你前端代码中的所有API请求统一使用/api/xxx的路径格式，不要写死服务端域名。如果你的Flask API没有/api前缀，可以将规则调整为/api/* https://<你的PythonAnywhere服务域名>/:splat 200，转发时自动去掉/api前缀。

方案2：前端直接请求PythonAnywhere域名 #

直接修改前端代码中API请求的baseURL为PythonAnywhere的完整域名，需同步配置Flask服务的跨域规则：

1. 安装flask-cors依赖，在Flask启动代码中添加跨域配置，允许你的Netlify域名跨域访问
2. 前端所有API请求路径替换为完整的服务端地址，比如https://<你的PythonAnywhere服务域名>/xxx

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