Laravel SPA是否仍应使用CSRF令牌进行安全保护？

Question

在使用Laravel和Vue.js 构建一个小型SPA时,我遇到了CSRF的多个困难:

• 我index.html用作唯一的视图,其余的是vue-router使用单个文件组件(即.vue文件)处理
• 因为我在前面没有使用PHP或Blade,所以我不能注入csrf_token()我的视图.即使我这样做,令牌也会最终到期,但由于应用程序没有(或很少)页面刷新,它不知道令牌是否发生了变化,并且它最终无法用旧的方式发出AJAX请求代币
• 一些答案建议在cookie中传递令牌,然后用JS检索它.这种方法遇到与上述相同的问题 - 当令牌改变时,SPA永远不会得到通知
• 我可以挖掘Laravel的内部工作,并在每次令牌改变时抛出一个事件; 前端可以使用Laravel Echo来听取变化,但随后问题提出,是否值得打扰？
• 最后,我被建议使用JWT; 但是,据我所知,JWT用于身份验证,而CSRF - 用于每个请求,无论HTTP动词或意图如何.

考虑到最后两点,您认为在Laravel SPA中使用CSRF令牌是否必要/可取？如果是这样,最好的实现是什么(带有令牌的cookie,返回令牌的专用路由,或其他)？如果没有,有哪些替代方案？

Answer 1

评论没有足够的空间,所以我将其添加为答案,但这只是一个概念,因为我对Vue的经验非常低.

来自文档

// Add a request interceptor
axios.interceptors.request.use(function (config) {
    // Do something before request is sent
    return config;
  }, function (error) {
    // Do something with request error
    return Promise.reject(error);
  });

// Add a response interceptor
axios.interceptors.response.use(function (response) {
    // Do something with response data
    return response;
  }, function (error) {
    // Do something with response error
    return Promise.reject(error);
  });

所以这个概念是这样的:

• 从Laravel设置自定义标头.
• 在构建/启动Vue应用程序时,获取自定义标头并将其设置为全局.

• 发出请求时,拦截它并从全局存储中添加CSRF令牌

  axios.interceptors.request.use(function(config){//从存储它的地方获取令牌并添加到请求中});

• 拦截响应并存储新令牌

  axios.interceptors.response.use(function(response){//将新的CSRF令牌存储在存储第一个的同一位置.});

• 永远循环