Vue + Laravel 圣所 CSRF 令牌不匹配 419 错误

Question

我收到“419（未知状态）”错误，并显示消息“CSRF 令牌不匹配”。

POST http://127.0.0.1:8000/login 419（状态未知）

CSRF 令牌不匹配。

Laravel 服务器：http://127.0.0.1:8000

Vue 服务器：http://localhost:8080

应用程序/Http/Kernel.php

'api' => [
    \Laravel\Sanctum\Http\Middleware\EnsureFrontendRequestsAreStateful::class,
    'throttle:api',
    \Illuminate\Routing\Middleware\SubstituteBindings::class,
],

应用程序/模型/User.php

<?php

namespace App\Models;

use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Notifications\Notifiable;
use Laravel\Sanctum\HasApiTokens;

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

配置/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

SESSION_DRIVER=cookie
SESSION_DOMAIN=localhost
SANCTUM_STATEFUL_DOMAINS=localhost:8080

src/views/auth/Login.vue

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

    return config
})

Answer 1

我很难处理同样的问题。经过多次搜索，我到达了这个页面。看到可能的建议解决方案后，我改变了

SANCTUM_STATEFUL_DOMAINS=localhost:8080

到

SANCTUM_STATEFUL_DOMAINS=http://localhost:8080

就是这样！效果很好！

Answer 2

您已将其SANCTUM_STATEFUL_DOMAINS设置为localhost:8080，但其余代码显示您正在端口 8000 而不是 8080 上运行。如果您将其更改为 8000，您应该会很高兴。