VueJS SPA 路由不適用於 Laravel

Question

我正在嘗試構建 SPA，我需要在我的路由中對端點進行 axios 調用。 如何使這個 api 調用工作？

這是我的路線

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

Route::get('events', 'EventsController@index')->prefix('api');

有什么建議嗎？

Answer 1

用這個

Route::any('{all}', function () {
    return view('default');
})
->where('all', '^(?!api).*$')
->where('all', '^(?!storage).*$');


Route::get('events', 'EventsController@index')->prefix('api');

因為你需要laravel的api和storage路由handel

Answer 2

您必須轉到文件夾 routes->api 並創建您的 api 路由，自動有 api 前綴。

在你的 .vue 中

axios.get('/api/getUser')
     .then(data => {
            console.log(data)
      });

在您的文件夾中路由-> api

Route::get('/getUser', 'Api\UsersController@getUser');

要不在“.vue”中的所有 axios 調用前面放置“/api”，您可以放置

axios.defaults.baseURL = '/api';

在你的 app.js 中

Answer 3

我們為 SpaController 定義了一個包羅萬象的路由，這意味着任何 Web 路由都將映射到我們的 SPA。 如果我們不這樣做，並且用戶向 /hello 發出請求，Laravel 將響應 404。

Route::get('/{any}', 'SpaController@index')->where('any', '.*');

請記住，在聲明其他路由后，此路由將始終放在您的網絡路由的最后一部分