Vue + Laravel sanctum令牌不匹配419错误

Vue + Laravel Sanctum令牌不匹配419错误是由于CSRF（跨站请求伪造）保护机制导致的。CSRF是一种攻击方式，攻击者通过伪造用户的请求来执行恶意操作。

在Vue和Laravel Sanctum的结合中，当使用POST、PUT、DELETE等需要CSRF保护的请求时，需要在请求头中添加X-CSRF-TOKEN字段，该字段的值为从服务器获取的CSRF令牌。

解决这个问题的方法如下：

1. 在Vue项目的入口文件（通常是main.js）中，添加以下代码来获取CSRF令牌并设置全局请求头：

import axios from 'axios';

axios.get('/sanctum/csrf-cookie').then(response => {
  // CSRF令牌已经设置到cookie中
  axios.defaults.headers.common['X-CSRF-TOKEN'] = response.data.csrfToken;
});

1. 在发送POST、PUT、DELETE等请求时，确保请求头中包含X-CSRF-TOKEN字段，可以通过axios的拦截器来实现：

import axios from 'axios';

axios.interceptors.request.use(config => {
  const csrfToken = document.querySelector('meta[name="csrf-token"]').getAttribute('content');
  config.headers['X-CSRF-TOKEN'] = csrfToken;
  return config;
});

1. 在Laravel Sanctum的配置文件（config/sanctum.php）中，确保以下选项被正确配置：

'stateful' => explode(',', env('SANCTUM_STATEFUL_DOMAINS', 'localhost,127.0.0.1')),

以上配置将允许CSRF令牌在指定的域名下保持状态。

1. 如果仍然遇到问题，可以尝试清除浏览器缓存和Cookie，然后重新登录。

总结： Vue + Laravel Sanctum令牌不匹配419错误是由于CSRF保护机制导致的。解决方法包括获取并设置CSRF令牌、在请求头中添加X-CSRF-TOKEN字段，并确保Laravel Sanctum的配置正确。如果问题仍然存在，可以尝试清除浏览器缓存和Cookie。