Question

我目前正在使用 VueJS SPA ， VueJS Router 和 Laravel 构建新的Web应用程序，用户应该能够访问页面以访客身份（未经身份验证）或登录（身份验证）！

我为$this->middleware(['auth', 'verified']);添加了一个用于SpaController的页面，以将我的页面访问限制为仅通过身份验证的用户，但是某些页面（路由）也应该可以公开访问，但应属于SPA。

如何使/:username，/:username/places路由可公开访问？用户注销后使用beforeEach仍会重定向到/login页面，看来$this->middleware(['auth', 'verified']);不允许到达/:username/places路线！

routes.js：

import VueRouter from 'vue-router';

import Cities from './views/Cities';
import Places from './views/Places';
import Home from './views/Home';
import Dashboard from './views/Dashboard';
import NotFound from './views/NotFound';

let routes = [
    {
        path: '/',
        name: 'home',
        component: Home,
        meta: {    requiresAuth: true   },
    },
    {
        path: '/404',
        name: '404',
        component: NotFound,
        meta: {    requiresAuth: false   },
    },
    {
        path: '/:username',
        name: 'dashboard',
        component: Dashboard,
        meta: {    requiresAuth: false   },
        children: [
            {
                path: 'places',
                name: 'places',
                component: Places,
                meta: {    requiresAuth: false   },
            },
        ]
    },
    {
         path: 'cities',
         name: 'cities',
         component: Cities,
         meta: {    requiresAuth: true   },
    },
    {
        path: '*',
        redirect: '/404'
    },
];

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

router.beforeEach((to, from, next) => {
    if (to.meta.requiresAuth) {
       next('/test')
    } else next()
})

export default router

web.php：

Route::get('logout', '\App\Http\Controllers\Auth\LoginController@logout');

Auth::routes(['verify' => true]);

Route::get('/auth/redirect/{provider}', 'Socialite\SocialController@redirect');
Route::get('/callback/{provider}', 'Socialite\SocialController@callback');

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

SpaController.php：

<?php

namespace App\Http\Controllers;

class SpaController extends Controller
{
    // This class and its' functions are available only for authorised and verified users
    public function __construct()
    {
        $this->middleware(['auth', 'verified']);
    }


    /**
     * @return \Illuminate\Contracts\View\Factory|\Illuminate\View\View
     */
    public function index()
    {
        return view('spa');
    }
}

spa.blade.php：

<!doctype html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
    @include('layouts.header')
</head>
<body>
    <div id="app" class="content">
        @include ('layouts.nav')

        <main class="py-4">
            <div class="container">
                <app></app>
            </div>
        </main>
    </div>
    @include('layouts.footer')
</body>
</html>

Answer 1

可以通过您的laravel route

完成

在您的routes>api.php文件中，

Route::middleware('auth:api')->group(function(){
 // contains the api controllers to be accessed when user is logged in
}

//list of routes to be accessed publicly goes here, e.g.
Route::get('/userworkexperience/{user}', 'ControllerName@method')->name('something.else');

我希望这对您有帮助

如何允许用户使用VueJS Router / SPA公开访问某些路由

1 个答案: