Node 代理多个 vue的前端dist项目，使用cursf进行全部路由防护时，为什么会出现路径不一样是报错，无效的csrftoken，代码正确示例子

在Node.js中代理多个Vue前端dist项目的CSRF防护问题可能是由于CSRF令牌校验失败导致的。当使用代理时，如果不同的项目有各自的CSRF令牌，并且服务器端配置不正确，可能会导致发送请求时携带的CSRF令牌与服务器预期的令牌不匹配，从而引发错误。

要解决这个问题，首先需要确保代理服务器正确转发CSRF令牌。通常，CSRF令牌是存储在cookies中，并在每次请求时通过HTTP头（如`X-CSRFToken`）或表单提交时附加到请求体中。代理服务器需要配置为将相关的cookies和头信息从前端请求转发到后端服务器。

一个简单的配置示例可以使用Node.js的Express框架和`http-proxy-middleware`中间件来实现跨域请求的代理，并处理CSRF令牌的转发。下面是一个代码示例，展示如何在Express应用中配置代理并转发CSRF令牌：

const express = require('express');
const { createProxyMiddleware } = require('http-proxy-middleware');

const app = express();

// 配置代理，这里以代理到http://localhost:8080为例
const proxyOptions = {
  target: 'http://localhost:8080', // 目标地址
  changeOrigin: true, // 控制服务器接收到的请求头中host字段的值
  ws: true, // 是否代理websockets
  onProxyRes: function(proxyRes, req, res) {
    // 添加CSRF令牌到头部或者处理cookies的转发
    const csrfToken = req.cookies['csrf-token'];
    if (csrfToken) {
      proxyRes.headers['x-csrf-token'] = csrfToken;
    }
  }
};

// 使用http-proxy-middleware创建代理中间件
app.use('/api', createProxyMiddleware(proxyOptions));

app.listen(3000, () => {
  console.log('Proxy server is running on port 3000');
});

在这个示例中，`onProxyRes`是一个回调函数，用来处理服务器响应事件。通过这个回调函数，我们可以访问到请求中的cookies，并将CSRF令牌添加到响应头中，从而确保后端服务器能够接收到正确的CSRF令牌进行校验。

请注意，这个示例仅供参考，实际的实现可能会根据你使用的具体库和框架有所不同。