API 路由在 Laravel VueJS 应用程序中不起作用答案

【问题标题】：API routes are not working in Laravel VueJS appAPI 路由在 Laravel VueJS 应用程序中不起作用
【发布时间】：2021-09-05 01:17:04
【问题描述】：

我正在使用 Laravel 和 Vue 构建一个 SPA。但是，我需要使用 axios 进行 API 调用，但它不起作用。

这是我的web.php：

Route::get('/{any}', function () {
    return view('index');
})->where('any', '.*');

这是我的api.php 路线：

Route::get('/notification', 'NotificationController@index');

每当我进行 API 调用时，它都会显示空白或损坏的页面。

您能就这个问题给我任何建议并解决吗？

【问题讨论】：

在 web.php 中将 Route::get('/{any}'... 替换为 Route::fallback laravel.com/docs/8.x/routing#fallback-routes
@Guru 但是通过这样做，我得到： UnexpectedValueException: Invalid route action: [App\Http\Controllers\/{any}]。
你不需要{any} 只需Route::fallback(function(){return ...})

【解决方案1】：

你应该防止api路由被web.php路由捕获。

一、前缀api路由：

api.php

Route::get('/api/notification', 'NotificationController@index');

然后，从网络路由中排除前缀路由：

web.php

Route::get('/{any}', function () {
    return view('index');
})->where('any', '^(?!api).*$');

【讨论】：