Блог

Главная - Вопросы по программированию - Ошибка несоответствия маркера CSRF Vue Laravel sanctum 419

Ошибка несоответствия маркера CSRF Vue Laravel sanctum 419

#php #laravel #vue.js #laravel-8 #laravel-sanctum

Вопрос:

Я получаю ошибку «419 (неизвестный статус)» с сообщением «Несоответствие токенов CSRF».

СООБЩЕНИЕ http://127.0.0.1:8000/login 419 (неизвестный статус)

Несоответствие токенов CSRF.

Сервер Laravel : http://127.0.0.1:8000

Сервер Vue : http://localhost:8080

app/Http/Kernel.php

 'api' => [
    LaravelSanctumHttpMiddlewareEnsureFrontendRequestsAreStateful::class,
    'throttle:api',
    IlluminateRoutingMiddlewareSubstituteBindings::class,
],

app/Models/User.php

 <?php

namespace AppModels;

use IlluminateDatabaseEloquentFactoriesHasFactory;
use IlluminateNotificationsNotifiable;
use LaravelSanctumHasApiTokens;

class User extends Authenticatable
{
    use HasApiTokens, HasFactory, Notifiable;
    //...
}

config/cors.php

 <?php

return [
    'paths' => [
        'api/*',
        'sanctum/csrf-cookie',
        'register',
        'login',
    ],
    'allowed_methods' => ['*'],
    'allowed_origins' => ['*'],
    'allowed_origins_patterns' => [],
    'allowed_headers' => ['*'],
    'exposed_headers' => [],
    'max_age' => 0,
    'supports_credentials' => true,
];

.env

 SESSION_DRIVER=cookie
SESSION_DOMAIN=localhost
SANCTUM_STATEFUL_DOMAINS=localhost:8080

src/main.js

 axios.interceptors.request.use((config) => {
    config.baseURL = 'http://127.0.0.1:8000'
    config.withCredentials = true

    return config
})

src/просмотры/авторизация/Вход.vue

 import axios from 'axios'
import { reactive } from '@vue/reactivity';

export default {
    setup() {

        const credential = reactive({
            email: '',
            password: '',
        })

        const login = async () => {
            axios.get('/sanctum/csrf-cookie').then( async () => {
                let response = await axios.post('/login', credential)
                console.log(response);
            });
        }

        return { login, credential }
    }
};

Ответ №1:

У вас SANCTUM_STATEFUL_DOMAINS установлено значение localhost:8080 , но остальная часть кода показывает, что вы работаете на порту 8000 вместо 8080. Если вы измените это на 8000, вы должны быть золотыми.

Ответ №2:

Мне было трудно справиться с этой же проблемой. После нескольких поисков я попал на эту страницу. Увидев возможные предлагаемые решения, я изменил

 SANCTUM_STATEFUL_DOMAINS=localhost:8080

Для

 SANCTUM_STATEFUL_DOMAINS=http://localhost:8080

И это было все! Это сработало отлично!!

Метки: