thinkphp对接react报404绝大多数因nginx未正确转发/api请求未进框架：react静态资源须独立部署，thinkphp仅处理/api/路径；nginx需配置location ^~ /api/并确保path_info传递，通过/tmp/tp-hit.log验证是否进入框架。
ThinkPHP 前后端分离对接 React 时接口报 404，绝大多数情况不是接口写错了，而是请求根本没进到 ThinkPHP 框架里——Nginx 或 Apache 直接返回了原生 404，index.php 甚至都没执行。React 是纯前端路由（history 模式），而 ThinkPHP 是后端 API 服务，二者必须物理隔离、路径互不干扰，否则就会出现“刷新页面 404”或“调用 /api/user 报 404”这类问题。
确认前后端是否真正分离部署
这是最容易被忽略的前提。React 打包后的静态文件（index.html、js/、css/）不能放在 ThinkPHP 的 public 目录下，否则 Nginx 会把所有请求先按前端规则匹配，再试图交给 PHP，造成路径冲突。
- ✅ 正确做法：React 静态资源单独部署在一个目录（如
/var/www/react-frontend/），用独立的 Nginxserver块或子域名（如fe.example.com）托管 - ✅ ThinkPHP API 单独部署在另一个目录（如
/var/www/thinkphp-api/），配置为仅处理/api/开头的请求 - ❌ 错误做法：把 React 的
dist整个丢进public/，还用同一 location 处理所有请求 —— 这会导致/api/login被当成前端路由去查index.html，最终 404
检查 Nginx 是否正确转发 API 请求
React 前端发起的请求（如 fetch('/api/user')）必须明确指向 ThinkPHP 后端，且 Nginx 必须将该路径准确转发给 index.php。关键看 location 配置是否精准匹配。
- 确保 ThinkPHP 的
root指向public/目录，例如：root /var/www/thinkphp-api/public; - 用
location ^~ /api/显式匹配 API 请求，避免被其他规则覆盖：location ^~ /api/ {<br> try_files $uri $uri/ /index.php?$query_string;<br>} - 内部 PHP 处理块中必须包含：
fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;<br>fastcgi_param PATH_INFO $fastcgi_path_info;
漏掉PATH_INFO，TP6 就无法解析/api/user中的/user段
验证请求是否真正进入 ThinkPHP
别急着改路由代码，先确认框架有没有启动。最简单的方法是加一行日志：
- 在
public/index.php开头插入：file_put_contents('/tmp/tp-hit.log', date('Y-m-d H:i:s') . " - hit\n", FILE_APPEND); - 用 curl 测试接口：
curl -v http://your-api-domain/api/user - 如果
/tmp/tp-hit.log没新增记录 → 请求压根没进 PHP，问题 100% 在 Nginx 配置或网络代理层 - 如果有记录但返回 404，再运行
php think route:list | grep user看路由是否存在；若无输出，说明路由文件没加载（检查route/app.php路径、url_route_on是否为 true、多应用模式下是否放错目录）
React 端注意请求路径写法
前端 fetch 的 URL 写法直接影响后端能否收到请求：
- ❌ 错误：
fetch('/user')—— 这会请求当前页面同域下的/user，而你根本没有这个静态路径 - ✅ 正确：
fetch('/api/user')（前提是 Nginx 已配置location ^~ /api/） - ✅ 更稳妥：
fetch('http://api.example.com/user')（用完整 URL，彻底规避路径歧义） - 检查浏览器 Network 面板：确认请求发出的 实际 URL 和 Status（是 404 from nginx？还是 404 from TP？响应头是否有
X-Powered-By: ThinkPHP？）
php免费学习视频：立即使用
踏上前端学习之旅，开启通往精通之路！从前端基础到项目实战，循序渐进，一步一个脚印，迈向巅峰！
