How do I enable custom headers with CORS?

Cors is installed

Now it should be noted that this endpoint does require a custom header. My current understanding is that when I use the EnableCors attribute and use a wildcard "*" for the headers, then all headers are allowed. However, when I attempt to call this endpoint I'm met with the following error in Chrome dev tools.

Access to XMLHttpRequest at 'https://myapi/getdata/myid' from origin 'http://localhost:12345' has been blocked by CORS policy: Request header field myheaderfield is not allowed by Access-Control-Allow-Headers in preflight response.

I've tried changing the allowed headers from wildcard "*" to "myheaderfield" but the error remains the same. How do I enable custom headers with CORS?

Below is the JS XHR request I am using to make this call.

var xhr = new XMLHttpRequest(); xhr.addEventListener("readystatechange", function () < if (this.readyState === 4) < console.log(this.responseText); >>); xhr.open("GET", "https://myapi/getdata/myid"); xhr.setRequestHeader("myheaderfield", "abc123"); xhr.send();