时间戳

首页 > 解决方案 > 使用 NUXT、Axios、NEST 和 CSURF 进行 CSRF 保护

axios - 使用 NUXT、Axios、NEST 和 CSURF 进行 CSRF 保护

问题描述

我已经在谷歌上搜索了一段时间，但仍然无法在我的 NestJS 应用程序和我的 Nuxt SSR 前端之间获得有效的 CSURF CSRF 保护。

目前我在我的 Nest main.js 中有这个实现：

  app.use(cookieParser());
  app.use(csurf({ cookie: true }));
  app.use((req, res, next) => {
    const token = req.csrfToken();
    res.cookie('XSRF-TOKEN', token);
    next();
  });

我不确定这是正确的方法，但到目前为止我找到了这个解决方案。该token变量正在更改每个请求。在我的理解req.cookie中，将此令牌设置为一个名为的 cookie，该 cookieXSRF-TOKEN应该在我的客户端可用。

在我的 Nuxt 应用程序中，我创建了一个插件：

export default function ({ $axios, $cookies }) {
  $axios.onRequest(() => {
    const token = $cookies.get('XSRF-TOKEN')
    $axios.defaults.headers.common['x-xsrf-token'] = token
  })
}

这里有两种行为：

  1. 这token是从 cookie 中获取的，但是一旦发生这种情况，所有请求都将保持不变 - 当然我会invalid csrf token出错
  2. 另一种情况是当tokenis时undefined。

我的问题是如何在这个库之间实现安全的 csrf 保护？

附加信息： $cookies来自库cookie-universal-nuxt库，我还设置withCredentials: true了 axios 调用：

await this.$axios.patch(`endpoint`, {}, { withCredentials: true })

标签： axiosnuxt.jscsrfnestjscsrf-token

解决方案

推荐阅读