部署在Heroku的LaraVue应用Vue Router失效，访问路由出现404错误求助

问题根源在于Vue Router使用history模式时，Heroku的Web服务器（默认是Apache或Nginx）会直接尝试匹配请求路径对应的物理文件，而非将所有路由请求转发给Laravel的入口文件index.php，导致直接访问/read这类前端路由时返回404。本地环境正常是因为Laravel内置服务器已经处理了所有路由转发逻辑。

以下是两种可行的解决方法：

方法1：针对Apache（PHP Buildpack）修改.htaccess #

在项目的public目录下，修改或创建.htaccess文件，添加Rewrite规则让所有非文件/目录的请求都指向index.php：

<IfModule mod_rewrite.c>
    <IfModule mod_negotiation.c>
        Options -MultiViews -Indexes
    </IfModule>

    RewriteEngine On

    # 处理Authorization请求头
    RewriteCond %{HTTP:Authorization} .
    RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]

    # 重定向末尾带斜杠的请求
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_URI} (.+)/$
    RewriteRule ^ %1 [L,R=301]

    # 将所有非文件/目录请求转发到index.php
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^ index.php [L]
</IfModule>

配置后，服务器会把所有前端路由请求交给Laravel处理，再由Laravel返回Vue的app视图，最终由Vue Router解析前端路由。

方法2：针对Nginx Buildpack配置nginx.conf #

如果你的Heroku应用使用Nginx buildpack，在项目根目录创建nginx.conf文件，添加如下配置：

server {
    listen <%= ENV["PORT"] %>;
    server_name localhost;
    root /app/public;

    index index.php index.html index.htm;

    location / {
        # 优先匹配文件/目录，找不到则转发到index.php
        try_files $uri $uri/ /index.php?$query_string;
    }

    location ~ \.php$ {
        fastcgi_pass unix:/var/run/php/php-fpm.sock;
        fastcgi_index index.php;
        fastcgi_param SCRIPT_FILENAME $realpath_root$fastcgi_script_name;
        include fastcgi_params;
    }
}

核心逻辑是try_files $uri $uri/ /index.php?$query_string;，确保所有无法匹配物理资源的请求都被转发到Laravel入口文件。

额外检查项 #

• 确保修改后的.htaccess或nginx.conf已添加到Git仓库，部署到Heroku时能被正确加载。
• 确认Vue Router的createWebHistory未传入错误的base路径（当前为根域名部署，保持默认即可）。

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