Vue 3简单通配回退路由在Apache服务器上失效求助

问题根源：Vue是单页应用（SPA），所有路由逻辑由前端接管。当你直接在地址栏输入路由链接时，Apache会尝试在服务器上寻找对应的物理文件，而这些文件并不存在，因此返回404。你配置的前端通配路由只有在请求先进入Vue应用时才会生效，但现在服务器层面直接拦截了请求，根本到不了前端路由环节。

解决步骤：

1. 创建.htaccess文件
   在你的dist文件夹根目录（即Apache部署的网站根目录）新建.htaccess文件，写入以下规则：

<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteBase /
  RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteRule . /index.html [L]
</IfModule>

这段规则的作用是：开启URL重写功能，排除index.html本身，只要请求的不是服务器上真实存在的文件或目录，就将请求转发到index.html，让Vue的前端路由来处理。

2. 开启Apache的mod_rewrite模块
   在Ubuntu服务器上执行以下命令开启模块并重启Apache：

sudo a2enmod rewrite
sudo systemctl restart apache2

3. 配置Apache站点允许.htaccess生效
   打开你的Apache站点配置文件（通常位于/etc/apache2/sites-available/你的站点.conf），找到对应网站根目录的<Directory>块，设置AllowOverride All，示例如下：

<Directory /var/www/html/classifieds>
  AllowOverride All
  Require all granted
</Directory>

修改完成后重启Apache使配置生效：

sudo systemctl restart apache2

4. 优化前端通配路由（可选）
   你之前配置的两条通配路由存在重复，建议合并为一条，用来处理前端层面的404场景（比如用户输入不存在的前端路由）：

const router = createRouter({
  history: createWebHistory('/'),
  routes: [
    // 其他业务路由放在前面
    // ...
    {
      path: "/:catchAll(.*)*",
      name: "NotFound",
      component: HomeView
    }
  ]
})

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