Vue + Laravel Sanctum遇到CSRF令牌不匹配的419错误

Question

<p>我收到一个“419（未知状态）”错误，错误信息为“CSRF令牌不匹配。”</p> <p>POST http://127.0.0.1:8000/login 419（未知状态）</p> <p>CSRF令牌不匹配。</p> <p>Laravel 服务器：http://127.0.0.1:8000

<p>Vue 服务器：http://localhost:8080</p> <p>应用程序/Http/Kernel.php</p> <pre class="lang-php Prettyprint-override"><code>'api' => [ \Laravel\Sanctum\Http\Middleware\EnsureFrontendRequestsAreStateful::class， '节流阀：API', \Illuminate\Routing\Middleware\SubstituteBindings::class， ], </代码></pre> <p>应用程序/模型/User.php</p> <pre class="lang-php Prettyprint-override"><代码><?php 命名空间 App\Models； 使用 Illuminate\Database\Eloquent\Factories\HasFactory； 使用照亮\通知\可通知； 使用 Laravel\Sanctum\HasApiTokens； User 类扩展了 Authenticatable { 使用 HasApiTokens、HasFactory、Notifying； //... } </代码></pre> <p>配置/cors.php</p> <pre class="lang-php Prettyprint-override"><代码><?php 返回 [ '路径' => [ 'api/*', '圣所/csrf-cookie', '登记'， '登录'， ], 'allowed_methods' =>; ['*'], 'allowed_origins' =>; ['*'], 'allowed_origins_patterns' =>; [], 'allowed_headers' =>; ['*'], 'expose_headers' =>; [], '最大年龄' => 0, 'supports_credentials' =>;真的， ]; </代码></pre> <p>.env</p>

SESSION_DRIVER=cookie
SESSION_DOMAIN=本地主机
SANCTUM_STATEFUL_DOMAINS=本地主机:8080</pre>
<p>src/main.js</p>
<代码>axios.interceptors.request.use((config) => {
    config.baseURL = 'http://127.0.0.1:8000'
    config.withCredentials = true

    返回配置
})
</代码></pre>
<p>src/views/auth/Login.vue</p>
<pre class="lang-js Prettyprint-override"><code>从 'axios' 导入 axios
从'@vue/reactivity'导入{reactive}；

导出默认值{
    设置（） {

        const 凭证 = 反应式({
            电子邮件： ''，
            密码： ''，
        })

        const 登录 = async () => {
            axios.get('/sanctum/csrf-cookie').then( async () => {
                让响应 =等待 axios.post('/登录', 凭证)
                控制台.log(响应);
            });
        }

        返回 { 登录名，凭证 }
    }
};
</code></pre></p>

Answer 1

我在处理这个相同问题上遇到了困难。经过几次搜索，我找到了这个页面。在看到可能的建议解决方案后，我修改了

SANCTUM_STATEFUL_DOMAINS=localhost:8080

为

SANCTUM_STATEFUL_DOMAINS=http://localhost:8080

然后就好了！它正常工作了！！

Answer 2

您将SANCTUM_STATEFUL_DOMAINS设置为localhost:8080，但其余代码显示您正在使用8000端口而不是8080端口。如果您将其更改为8000，您应该是正常的。