Question

我正在测试Laravel5.6 + Vue应用程序，我已经激活了Laravel Auth和Passport。

我的项目：

API使用Laravel Passport。
Web Laravel身份验证处于活动状态。
Vue App

由于Laravel身份验证处于活动状态，因此，无论是否登录并重定向到身份验证/登录路由，似乎身份验证都会触发并验证用户会话。

当我在web.php中禁用身份验证路由时，会发生错误。

// Auth::routes();

错误

InvalidArgumentException
Route [login] not defined.

由于我将Vue应用程序和Laravel API与Passport一起使用，如何避免Laravel Web Auth验证Vue应用程序？

web.php

Auth::routes();
Route::get('{any}', 'HomeController@index')->name('home')->where('any','.*');

api.php

    Route::group([
        'prefix' => 'auth'
    ], function () {
        Route::group(['middleware' => 'auth:api'], function() {
            Route::get('logout', 'API\AuthController@logout');
            Route::get('user', 'API\AuthController@user');

        });
    });
    Route::group(['middleware' => 'auth:api'], function() {

        Route::get('/application/all', 'ApplicationController@index');

    });

    Route::post('/auth/login', 'API\AuthController@login');
    Route::post('/auth/register', 'API\AuthController@register');

Vue

routes.js

从'./components/Home.vue'导入Home；

    import Login from './components/auth/Login.vue';
    import Logout from './components/auth/Logout.vue';
    import Profile from './components/auth/Profile.vue';
    import Register from './components/auth/Register.vue';

    import ApplicationList from './components/content-app/ApplicationList.vue';


    export const routes = [
        {
            path: '/',
            component: Home,
            meta: {
                requiresVisitor: true,
            }
        },
        {
            name: 'user-login',
            path: '/user/login',
            component: Login,
            meta: {
                requiresVisitor: true,
            }
        },
        {
            name: 'user-register', 
            path: '/user/register',
            component: Register,
            meta: {
                requiresVisitor: true,
            }
        },
        {
            name: 'user-profile', 
            path: '/user/profile',
            component: Profile,
            meta: {
                requiresAuth: true,
            }
        },
        {
            path: '/logout',
            component: Logout,
            meta: {
                requiresAuth: true,
            }
        },
        {
            path: '/content/application-list',
            component: ApplicationList,
            meta: {
                requiresAuth: true,
            }
        }
    ];

app.js

require（'./ bootstrap'）;

  import Vue from 'vue';
  import VueRouter from 'vue-router';
  import Vuex from 'vuex';
  import axios from 'axios'

  import {routes} from './routes';
  import StoreDate from './store';
  import MainApp from './components/MailApp.vue';


  Vue.use(VueRouter);
  Vue.use(Vuex);

  const store = new Vuex.Store(StoreDate);

  const router = new VueRouter({
      routes,
      mode: 'history'
  });

  router.beforeEach((to, from, next) => {
    if (to.matched.some(record => record.meta.requiresAuth)) {
      // this route requires auth, check if logged in
      // if not, redirect to login page.
      if (!store.getters.loggedIn) {
        next({
          path: '/login',
          query: { auth: 'unauthenticated' } //query: { redirect: to.fullPath }
        })
      } else {
        next()
      }
    } else if (to.matched.some(record => record.meta.requiresVisitor)) {
      if (store.getters.loggedIn && (to.path == '/login' || to.path == '/register')) {
        next({
          path: '/profile',
        })
      } else {
        next()
      }
    } else {
      next() // make sure to always call next()!
    }
  })


  const app = new Vue({
      el: '#app',
      router,
      store,
      components: {
          MainApp
      }
  });


  /////////  OVER WRITING JS
  $('.navbar-nav>li>a').on('click', function(){
      $('.navbar-collapse').collapse('hide');
  });
  $('.navbar-nav>navbar-brand').on('click', function(){
      $('.navbar-collapse').collapse('hide');
  });

Laravel 5.6 + vue.js应用路由器+ Laravel护照

0 个答案: