Expected behaviour

Access-Control-Max-Age: 10s header should cache preflight requests for 10s when the Authorization header is set programmatically e.g. using a value from localStorage.

Reproduce

Response headers:

"Access-Control-Allow-Methods": "*",
"Access-Control-Allow-Headers": "*",
"Access-Control-Allow-Origin": "*",
"Access-Control-Max-Age": "10"

Execute this fetch request twice from a different origin. Separate executing each request by about 6s.

const url = "https://prairie-bright-earl.glitch.me/";
const opts = {
  headers: {
    "Content-Type": "application/json",
    Authorization: "asdf",
  },
  method: "POST",
  body: JSON.stringify({ message: "ping" }),
};
fetch(url, opts);

Observe that:

• Every single request produces a preflight request.
• Things can be "fixed", in the sense that Access-Control-Max-Age will be respected by doing one of the following:
  • Removing the Authorization header
  • Enabling credentials mode. ie Adding fetch request header: credentials: include and setting the response headers Access-Control-Allow-Headers: Authorization, Content-Type and Origin: ${origin}.
  • Setting Access-Control-Allow-Headers: Authorization, *.

Links to minimal failing demo:

• Server code: https://glitch.com/edit/#!/prairie-bright-earl?path=server.js%3A22%3A0
• Client code: https://jsbin.com/dejetem/16/edit?js,console

Tested in chrome and firefox, they both exhibit this behaviour. Preflight requests are not visible in safari.

According to @jakearchibald this could be a bug? From reading the spec, at least to me, it's not clear whether programatically setting Authorization header should require credentials mode. Regardless, it seems like an unnecessary precaution to require setting origin if I know as the developer that I don't use cookies and therefore I am not susceptible to CORS attacks?

Also the workarounds seem totally unintuitive to me.

Disclaimer: I am a spec issue contributor virgin. 👋