Reactjs 请求标头字段<；字段名>；飞行前响应中的访问控制允许标头不允许

我有一个React应用程序正在尝试向我的Express服务器发出axios请求，以在Mongo数据库中查找用户。之前，我在Rails上构建了后端，并为CORS开发了一个gem，在尝试在Express端配置CORS之后，我似乎找不到解决方案。我希望能够在标题中传入一个自定义字段（即用户名），以便可以使用该字段查询我的数据库

浏览器中出现错误：

XMLHttpRequest cannot load http://localhost:3000/api/users/test. 
Request header field username is not allowed by Access-Control-Allow-Headers 
in preflight response.

我的Express服务器设置了以下CORS，我的React-axios代码正在尝试向服务器发出请求，并将参数传递到headers对象，但仍然在响应错误中获取飞行前信息

app.use(function(req, res, next) {
  res.setHeader('Access-Control-Allow-Origin', '*');
  res.setHeader('Access-Control-Allow-Credentials', 'true');
  res.setHeader('Access-Control-Allow-Methods', 'GET,HEAD,OPTIONS,POST,PUT,DELETE');
  res.setHeader("Access-Control-Allow-Headers",
    "Access-Control-Allow-Headers, 
    Origin, 
    Accept, 
    X-Requested-With, 
    Content-Type, 
    Access-Control-Request-Method, 
    Access-Control-Request-Headers, 
    Authorization")
  res.setHeader('Cache-Control', 'no-cache');
  next();
});

export const loadAccount = (username) => {
  return(dispatch) => {
    axios
    .get(`${url}/users/test`, {
      headers: {username: username}
    })
    .then(resp => {
      dispatch({
        type: 'LOAD_ACCOUNT',
        account: resp.data
      })
    })
    .catch(errors => {
      console.log(errors)
    })
  }
}

---

在我看来，您必须在

访问控制允许标头

子句中添加

用户名

作为有效标头，即：

res.setHeader("Access-Control-Allow-Headers",
  "Access-Control-Allow-Headers, 
  Origin, 
  Accept, 
  X-Requested-With, 
  Content-Type, 
  Access-Control-Request-Method, 
  Access-Control-Request-Headers, 
  Authorization,
  username")
res.setHeader('Cache-Control', 'no-cache');
next();

---

请使用编辑/更新您的问题，并粘贴到您在浏览器devtools控制台中看到的确切错误消息中。这就成功了！我确实想知道，在我的项目变得足够大的情况下，我需要将许多自定义头传递给headers子句，那么该子句可能会变大。是否有一种变通方法或一种可以在子句中声明的捕获所有/所有自定义标题的方法？您应该能够只使用

*

或完全删除标题，我相信默认情况下允许任何内容，但我不能100%确定