首页 文章

laravel - Vuejs路线与Laravel路线相冲突，试图提出axios请求

提问于
浏览 次
0

我正在尝试提出请求 .

我的项目设置为SPA，因此VueJS正在处理每个“页面”的路线 .

我认为我已经缩小了VueJS路由干扰Laravel路由，因为无论我访问/ someEndPoint哪个无效 endpoints ，在开发工具下我总是收到与下面相同的html响应 . 我也可以发一个帖子请求，数据可以输入我的数据库，这很好 . 但无论得到什么请求我都会尝试它不会进入指定的Controller函数

这是我想要的标准获取请求

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路线 - routes.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路线一起使用？

laravel vue.js routes axios

1 回答

  • 1

    正如OP的评论中所提到的，它恰好是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
    回复于

相关问题