首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

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令牌并设置全局请求头:
代码语言:txt
复制
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的拦截器来实现:
代码语言:txt
复制
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)中,确保以下选项被正确配置:
代码语言:txt
复制
'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。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

没有搜到相关的沙龙

领券