Request header field X-CSRF-Token is not allowed by Access-Control-Allow-Headers in preflight response.

[adambedford]

I'm running into an issue making a request to the Clearbit Company Autocomplete API where the following error is being raised:

Request header field X-CSRF-Token is not allowed by Access-Control-Allow-Headers in preflight response.

I'm pretty sure this is because my request contains the header:

Access-Control-Request-Headers: x-csrf-token

and Clearbit is configured with

access-control-allow-headers: Authorization, API-Version, Content-Type, Salesforce-App-Id

So I tried to unset this header as follows:

const results = yield this.get("ajax").request(`https://autocomplete.clearbit.com/v1/companies/suggest?query=${param}`, {
        method: "GET",
        headers: {
          "Access-Control-Request-Headers": ""
        }
      })

However I'm now getting this error

Refused to set unsafe header "Access-Control-Request-Headers"

Is there a way to remove x-csrf-token from the Access-Control-Request-Headers header? Or perhaps a better way to approach this?

It might also be worth noting that I ran into the same problem using $.getJSON()

[alexlafroscia]

If you ran into the same problem with jQuery alone, I’m not sure how much I can help you... this doesn’t sound like an ember-Ajax issue.

[alexlafroscia]

Closing because, per my last commend here, this appears to be a jQuery issue, not something with ember-ajax.