Маршруты laravel - Vuejs конфликтуют с маршрутами Laravel, пытаясь сделать запрос axios - PullRequest
Новая
       31

Маршруты laravel - Vuejs конфликтуют с маршрутами Laravel, пытаясь сделать запрос axios

0 голосов
/ 16 ноября 2018

Я пытаюсь сделать запрос на получение.

Мой проект настроен как SPA, поэтому VueJS обрабатывает маршруты для каждой из моих «страниц».

Я думаю, что я сузил, что маршруты VueJS мешают маршрутизации Laravel, так как какую бы недопустимую конечную точку я не посетил / someEndPoint, в инструментах разработки я всегда получаю тот же html-ответ, что и ниже. И я также могу сделать почтовый запрос, и данные могут быть введены в мою базу данных, что хорошо. Но какой бы запрос я ни пытался получить, он не войдет в указанную функцию контроллера

Вот стандартный запрос на получение, который я пытаюсь сделать 

axios.get('/reservation/date/2018-11-13/')
  .then(function(response) {
    console.log("data", response.data);
    console.log("status", response.status);
  }).catch(function (error) {
    console.log(error);
  });

Ответ с кодом состояния 200 

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>My Home Page</title>
    <meta name="csrf-token" content="hrfSpnUDNsVv6pLQM4v0UFUk2yrq3m8yPYiss2YT">
    <link href="http://localhost:8000/css/app.css" rel="stylesheet">
  </head>
  <body>
    <div id="root">
      <ps-header></ps-header>

      <router-view>

      </router-view>
      <ps-footer></ps-footer>
    </div>
    <script src="http://localhost:8000/js/app.js"></script>
  </body>
</html>

VueJS маршруты - rout.js 

import VueRouter from 'vue-router';

let routes = [
  {
    path: '/',
    name: 'home',
    component: require('./components/views/pages/home.vue')
  },
  {
    path: '/faq',
    name: 'faq',
    component: require('./components/views/pages/faq.vue')
  },
  {
    path: '/register',
    name: 'register',
    component: require('./components/views/pages/register.vue')
  },
  {
    path: '/login',
    name: 'login',
    component: require('./components/views/pages/login.vue')
  },
  {
    path: '/testPage',
    name: 'testPage',
    component: require('./components/views/pages/testPage.vue')
  }
]

export default new VueRouter({
  routes,
  linkActiveClass: 'is-active',
  mode: 'history'
});

Маршруты Laravel - web.php 

Route::get('/{vue?}', function () {
    return view('index');
})->where('vue', '[\/\w\.-]*');

Route::get('/reservation/date/{date}', 'ReservationContoller@getScheduleForDate'); //route in question
Route::resource('/reservation', 'ReservationController');
Route::get ('/admin', 'AdminController@index');
Route::get('/home', 'HomeController@index')->name('home');
Auth::routes();

Как мне использовать мои маршруты Laravel вместе с моими маршрутами VueJS?

1 Ответ

0 голосов
/ 16 ноября 2018

Как уже упоминалось в комментариях ОП, это произошло из-за упорядочения моих маршрутов в файле web.php.Вот обновленный файл для ясности 

Route::get('/reservation/date/{date}', 'ReservationController@getScheduleForDate');
Route::resource('/reservation', 'ReservationController');
Route::get ('/admin', 'AdminController@index');
Route::get('/home', 'HomeController@index')->name('home');
Auth::routes();

Route::get('/{vue?}', function () {
    return view('index');
})->where('vue', '[\/\w\.-]*');

Никаких изменений не нужно было делать где-либо еще, также была опечатка в оригинальном файле web.php, поскольку ответ об ошибке возвращался с неизвестным контроллером.Просто нужно исправить имя.

Должен был щелкнуть, когда я печатал его, говоря о маршрутах VueJS, мешающих маршрутам Laravel.Я реорганизовал его, но маршрут Vue ускользнул от меня.

Если переупорядочение маршрутов не работает, я бы пошел дальше и очистил кэш и маршрут 

php artisan route:clear
php artisan cache:clear
...