如何基于URL路径将域名重定向到子目录（React+Laravel场景）

目录结构确认 #

服务器上的目录布局如下：

• React项目静态文件存放于 /ReactApp/
• Laravel项目完整代码存放于 /Laravel/（注意Laravel的入口文件在其public子目录）

步骤1：主文档根目录的.htaccess配置 #

在虚拟主机的文档根目录（如public_html或www）创建/修改.htaccess文件，添加以下规则：

# 启用URL重写引擎
RewriteEngine On

# 转发/api/开头的请求到Laravel的public目录
RewriteRule ^api/(.*)$ /Laravel/public/$1 [L,P]

# 转发根域名及非API请求到ReactApp目录
RewriteCond %{REQUEST_URI} !^/api/
RewriteCond %{REQUEST_URI} !^/ReactApp/
RewriteRule ^(.*)$ /ReactApp/$1 [L]

规则解析 #

• [L]：标记为最后执行的规则，匹配后不再处理后续规则
• [P]：通过代理转发请求，地址栏将保留/api/前缀（若需跳转显示真实路径，可替换为[L,R=301]）
• 两个RewriteCond确保API请求和已指向ReactApp的请求不会被重复转发

步骤2：调整Laravel的.htaccess #

进入Laravel项目的public目录，修改.htaccess适配/api/前缀：

<IfModule mod_rewrite.c>
    RewriteEngine On
    # 设置重写基准路径
    RewriteBase /api/

    RewriteRule ^(.*)$ index.php/$1 [L]

    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^ index.php [L]
</IfModule>

同时修改Laravel根目录的.env文件，设置正确的应用URL：

APP_URL=https://www.example.com/api

步骤3：React项目适配配置 #

如果使用react-router等前端路由，需修改package.json确保静态资源路径正确：

{
  "homepage": "."
}

在/ReactApp/目录下添加.htaccess，解决前端路由刷新404问题：

RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^ index.html [L]

关键注意事项 #

• 确认虚拟主机已开启mod_rewrite模块，未开启需联系主机商处理
• 确保/ReactApp/和/Laravel/目录权限设置为755，保证Apache进程可访问
• React项目需执行npm run build打包，将build目录下的所有文件上传到服务器/ReactApp/目录

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