Как использовать аутентификацию Laravel и vue-router вместе - PullRequest
Новая
       33

Как использовать аутентификацию Laravel и vue-router вместе

1 голос
/ 24 марта 2019

Я новичок в Laravel и PHP в целом, но знаком с Vue и SPA.Я знаю, как создать аутентификацию с помощью Bcrypt, например.Однако я использовал Laravel для запуска php artisan make:auth и для создания нескольких разных конечных точек для бэкэнда.

Я пытался преобразовать свое приложение в SPA с помощью Vue, однако использование маршрутизации с Vue вызывает проблемы с маршрутами, определенными в web.php.Например, у меня есть мой web.php с несколькими разными маршрутами. 

<?php

Route::get('/{vue_capture?}', function () {
    return view('app');
 })->where('vue_capture', '^(?!storage).*$'); 

Route::get('/', function () {
    return view('app');
});
Route::resource('Videos', 'VideoController')->middleware('auth','isAdmin');
Route::resource('Categories', 'CategoriesController')->middleware('auth');
Route::get('/search', 'VideoController@search')->middleware('auth');

Auth::routes();

Route::get('/settings/account', 'AccountsController@edit')->middleware('auth');
Route::get('/auth', 'AccountsController@get');
Route::put('/settings/account', 'AccountsController@update')->middleware('auth');

Однако у меня также есть route.js, чтобы vue-router обрабатывал маршрутизацию следующим образом: 

import Home from './components/Home.vue'
import Videos from './components/Videos.vue'
import Categories from './components/Categories.vue'

export default{
    mode: 'history',


    routes: [
        {
            path:'/',
            component:Home
        },

        {
            path:'/Videos',
            component:Videos
        },
        {
            path:'/Categories',
            component:Categories
        },
        {
            path:'/login',
            component:login
        },
        {
            path:'/register',
            component:register
        },
        {
            path:'/logout',
            component:logout
        }
    ]
}

Я понимаю, что Vue должен взять на себя маршрутизацию, если вы используете SPA, но есть ли способ использовать оба?Я не могу найти ничего, что решает эту проблему, но я не могу поверить, что Laravel заставит вас выбрать либо использование их встроенных команд, таких как php artisan make:auth, либо придется отказаться от всего этого и сделать все вручную, если вы хотитеSPA с маршрутизацией.

Я пробовал проходить через различные CRUD-ториалы при использовании Laravel и или Vue.Я попытался направить все маршруты в Vue, чтобы Vue-router обрабатывал маршрутизацию.Я пытался не передавать всю маршрутизацию на vue-router и сохранять внутренние маршруты, которые были у меня в web.php

Другая проблема, связанная с полупериодом, заключается в том, что мои маршруты даже не отображаются как ссылки, использующие router-linkЭто просто выглядит как обычный текст.Но сейчас мой приоритет - проблема маршрутизации.

1 Ответ

1 голос
/ 24 марта 2019

Вы можете комбинировать маршрут Vue и маршрут Laravel. Но для достижения наилучшего результата я советую вам использовать vue router, так как вы строите спа.

  1. удалить 
Route::get('/', function () {
    return view('app');
});
  1. поместите весь внутренний маршрут перед маршрутом, указывающим на ваше значение. 
Route::resource('Videos', 'VideoController')->middleware('auth','isAdmin');
Route::resource('Categories', 'CategoriesController')->middleware('auth');
Route::get('/search', 'VideoController@search')->middleware('auth');

Auth::routes();

Route::get('/settings/account', 'AccountsController@edit')->middleware('auth');
Route::get('/auth', 'AccountsController@get');
Route::put('/settings/account', 'AccountsController@update')->middleware('auth');

Route::get('/{vue_capture?}', function () {
    return view('app');
 })->where('vue_capture', '^(?!storage).*$');

Также убедитесь, что у вас нет конфликтующих маршрутов на вашем бэкэнде (запустите php artisan route:list, чтобы увидеть список маршрутов вашего Laravel) и VUE. Надеюсь, это поможет.

...