前后端分离项目 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.”

求大神指点迷津

《L01 基础入门》
我们将带你从零开发一个项目并部署到线上,本课程教授 Web 开发中专业、实用的技能,如 Git 工作流、Laravel Mix 前端工作流等。
《L02 从零构建论坛系统》
以构建论坛项目 LaraBBS 为线索,展开对 Laravel 框架的全面学习。应用程序架构思路贴近 Laravel 框架的设计哲学。
最佳答案

把路由写在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年前 评论

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