title: Request header field <field-name> is not allowed by Access-Control-Allow-Headers in preflight response
body: <p>I have a React app that is trying to make an axios request to my Express server to find a user in a Mongo database. Before, I built the back-end on Rails and had a gem for CORS, and after trying to configure CORS on the Express side, I can't seem to find a solution. I want to be able to pass in a custom field in headers (i.e. username) so I can use that field to query against my database. </p>
  
  <p>Error I get in browser:</p>
  
  <pre><code>XMLHttpRequest cannot load http://localhost:3000/api/users/test. 
  Request header field username is not allowed by Access-Control-Allow-Headers 
  in preflight response.
  </code></pre>
  
  <p>My Express server has the following CORS set up and my React axios code is attempting to make a request to the server with a param passed into the headers objects, but still getting preflight in response error. </p>
  
  <pre><code>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) =&gt; {
    return(dispatch) =&gt; {
      axios
      .get(`${url}/users/test`, {
        headers: {username: username}
      })
      .then(resp =&gt; {
        dispatch({
          type: 'LOAD_ACCOUNT',
          account: resp.data
        })
      })
      .catch(errors =&gt; {
        console.log(errors)
      })
    }
  }
  </code></pre>