php - 通过 API 使用默认登录时 Laravel 未经身份验证的方法

Question

我目前正在学习 VUE SPA，目前正在从事有关 laravel 的项目。

我已经成功使用默认 laravel 身份验证使用 api 和以下代码进行身份验证

登录控制器

 /**
     * @return string
     */
    public function username()
    {
        return 'username';
    }

    /**
     * @return \Illuminate\Contracts\Foundation\Application|\Illuminate\Contracts\View\Factory|\Illuminate\View\View
     */
    public function showLoginForm(){

        return view('Login');

    }

    public function authenticated()
    {
        return response()->json(auth()->user());
    }
    /**
     * Log the user out of the application.
     *
     * @param  \Illuminate\Http\Request  $request
     * @return \Illuminate\Http\Response
     */
    public function logout(Request $request)
    {

        Auth::logout();

        return redirect('/');
    }

登录.vue

<template>

    <v-app id="inspire" style="background-repeat: no-repeat; background-size: cover; background-image: url('https://image.freepik.com/free-vector/white-background-with-blue-tech-hexagon_1017-19366.jpg')">
        <v-app-bar app
                   color="primary"
                   dark>
            <v-toolbar-title>Thalasemia App</v-toolbar-title>
        </v-app-bar>
        <v-main>

            <v-container
                class="fill-height"
                fluid
            >
                <v-row
                    align="center"
                    justify="center"
                >
                    <v-col
                        cols="12"
                        sm="8"
                        md="4"
                    >
                        <v-form
                            ref="form"
                            v-model="valid"
                            lazy-validation
                            @submit.prevent="login"
                        >
                            <v-card class="elevation-12">
                                <v-toolbar
                                    color="primary"
                                    dark
                                    flat
                                >
                                    <v-toolbar-title>Please Login to Continue</v-toolbar-title>
                                    <v-spacer></v-spacer>

                                </v-toolbar>
                                <v-card-text>
                                        <v-text-field
                                            label="Username"
                                            name="Username"
                                            prepend-icon="mdi-account"
                                            type="text"
                                            required
                                            :rules="requiredRules"
                                            v-model="form['username']"
                                            :class="{'is-invalid' : errorClass('username')}"
                                            :error-messages="errorMessage('username')"
                                        ></v-text-field>

                                        <v-text-field
                                            id="password"
                                            label="Password"
                                            name="password"
                                            prepend-icon="mdi-lock"
                                            type="password"
                                            v-model="form['password']"
                                            :rules="requiredRules"
                                            :class="{'is-invalid' : errorClass('password')}"
                                            :error-messages="errorMessage('password')"
                                            required
                                        ></v-text-field>

                                </v-card-text>
                                <v-card-actions>
                                    <v-spacer></v-spacer>
                                    <v-btn type="submit" color="primary" class="btn-block" >Login</v-btn>
                                </v-card-actions>
                            </v-card>
                        </v-form>
                    </v-col>
                </v-row>
            </v-container>
        </v-main>
    </v-app>
</template>

<script>
import axios from 'axios';

export default {
    name: "Login",

    data () {
        return {
            valid: true,
            form: {},
            fieldErrors: {},
            requiredRules: [
                v => !!v || 'This field is required',
            ],
        }
    },

    methods: {
        login(){
            if(this.$refs.form.validate()){
                axios.post('/api/login', this.form)
                    .then(response => {
                        console.log(response);
                        if (response.status === 200){
                            window.location.reload(true);
                        }
                        this.$refs.form.resetValidation()

                    }).catch(error => {
                    if(error.response.status === 422){
                        this.fieldErrors = error.response.data.errors;
                    }
                });
            }
        },


        errorClass(field, type) {

            if(type !== 'textarea') {
                return this.fieldErrors[field] ? true : false
            } else{
                console.log(field)
                return this.fieldErrors[field] ? "border: 1px solid red !important" : ""
            }
        },

        errorMessage(field) {
            return this.fieldErrors[field] ? this.fieldErrors[field][0] : '';
        }
    }


}
</script>

<style scoped>

</style>

网页.php

Auth::routes();
Route::group(['middleware' => 'guest'], function (){

    Route::get('/', function (){
       return redirect('login');
    });

});

Route::group(['middleware' => 'auth'], function (){
    Route::get('logout', function (){
       \Illuminate\Support\Facades\Auth::logout();
       return redirect('/login');
    });
    Route::get('/{vue_capture?}', function () {
        return view('welcome');
    })->where('vue_capture', '[\/\w\.-]*');

});

api.php

<?php

use Illuminate\Http\Request;
use Illuminate\Support\Facades\Route;


\Illuminate\Support\Facades\Auth::routes();
Route::get('getAllData', 'LogsController@getData');
Route::group(['prefix' => '/', 'middleware' => 'auth:api'], function () {

    Route::get('/getAccounts', 'LogsController@getAccounts');
});

此方法成功地将我重定向到页面并登录。但是每当我尝试运行auth:api块内的所有内容时，我总是收到未经身份验证的响应。

我已经设置了护照并将其添加到kernel.php

\Laravel\Passport\Http\Middleware\CreateFreshApiToken::class,

到目前为止，我登录时有什么遗漏吗？谢谢！

标签： phplaravelvue.js