前后端分离项目 Vue+Laravel 如何解决 CSRF 缺失问题

(前端不是很精通,望大神不吝赐教)
前端是用Vue-Cli搭建的,后端用的Laravel6,跨域问题已经解决,但向后端请求返回419,一看就是CSRF的问题,但搜了很多答案都是解决blade模板中添加CSRF的,很少有关于Vue,找到一个还算比较像的答案,在main.js中增加一个请求的拦截器:

axios.interceptors.request.use(config => {
  const cookie = document.cookie
  if (cookie && config.method === 'post') {
    config.headers['X-CSRFToken'] = getCookie(cookie)
  }
  return config
})

响应确实也发生了变化,但仍然返回错误信息:

message: “CSRF token mismatch.”

求大神指点迷津

《L05 电商实战》
从零开发一个电商项目,功能包括电商后台、商品 & SKU 管理、购物车、订单管理、支付宝支付、微信支付、订单退款流程、优惠券等
《L03 构架 API 服务器》
你将学到如 RESTFul 设计风格、PostMan 的使用、OAuth 流程,JWT 概念及使用 和 API 开发相关的进阶知识。
最佳答案

把路由写在routes/api.php

routes/api.php

Route::get('user',function (){
 return "q";
})

访问: /api/user

file

routes/web.php 才会加载 VerifyCsrfToken中间件

3年前 评论
meitian (楼主) 3年前
PHPer技术栈 3年前
讨论数量: 4

把路由写在routes/api.php

routes/api.php

Route::get('user',function (){
 return "q";
})

访问: /api/user

file

routes/web.php 才会加载 VerifyCsrfToken中间件

3年前 评论
meitian (楼主) 3年前
PHPer技术栈 3年前
leo

前后端分离的项目(用 Authorization Header 而不是 Cookie 验证)不需要开启 CSRF,正如一楼所说,将路由放在 api.php 文件里即可

3年前 评论
Insua 3年前
leo (作者) 3年前
xianyunyehe

关闭CSRF

3年前 评论

CSRF 支持从 cookie 获取,axios 默认会设置的,参考我这个回答:问答:Laravel+vue (axios) 上传图片时报错:CSRF token mismatch.

3年前 评论

讨论应以学习和精进为目的。请勿发布不友善或者负能量的内容,与人为善,比聪明更重要!