如何配置Laravel路由使vue-router仅排除/admin后端路径生效

当前配置的前端兜底通配路由，正则规则仅排除了/api前缀的请求，没有将/admin前缀的后端路由路径加入排除范围，加上Laravel本身是按注册顺序从上到下匹配路由，一旦先匹配到通配路由就会终止后续匹配，最终所有/admin开头的请求直接返回welcome视图，无法走到对应的后端admin路由逻辑。

• 第一步：调整通配路由的正则匹配规则，将/admin前缀加入排除列表
  修改routes/web.php里的通配路由代码如下：

  Route::get('/{any?}', function () {
      return view('welcome');
  })->where('any', '^(?!api\/|admin\/)[\/\w\.\,-]*');
  

  这里的正则通过负向预查，直接放行所有以api/、admin/开头的路径，不让它们匹配到这个前端兜底路由。

• 第二步：调整路由注册顺序
  必须把所有/admin前缀的后端路由组，放在这个前端通配路由的前面注册，参考正确的路由结构：

  // routes/web.php
  // 优先注册后端/admin路由组
  Route::prefix('admin')->group(function () {
      // 此处放所有admin相关后端路由，例如：
      Route::get('users', [\App\Http\Controllers\Admin\UserController::class, 'index']);
      Route::get('roles', [\App\Http\Controllers\Admin\RoleController::class, 'index']);
      // 其余admin路由...
  });
  
  // 最后注册前端兜底路由，交给vue-router处理
  Route::get('/{any?}', function () {
      return view('welcome');
  })->where('any', '^(?!api\/|admin\/)[\/\w\.\,-]*');
  

配置完成后：

• 所有/admin/*、/api/*开头的请求会正常走Laravel后端路由逻辑
• 其余所有路径都会返回welcome视图，由history模式的vue-router接管前端路由，不会再出现admin路径被重定向到前端页面的问题

补充：如果后续还有其他不需要前端接管的后端专属路径前缀，只需要在正则的负向预查部分用|分隔追加即可，例如要排除/docs前缀，就把正则改成^(?!api\/|admin\/|docs\/)[\/\w\.\,-]*

内容的提问来源于stack exchange，提问作者Hai Truong IT