AJAX call fails with a CORS redirect error message

Problem

A redirected AJAX call is being rejected with a CORS error message, for example:

Access to XMLHttpRequest at 'https://my-domain-2/path' (redirected from 
'https://my-domain-1/path') from origin 'https://my-website-domain' has been
blocked by CORS policy: Request header field x-newrelic-id is not allowed by 
Access-Control-Allow-Headers in preflight response.

Solution

To resolve this error, update your code to make the AJAX call to the new URL provided by the redirect. For more information, see the MDN article CORS request external redirect not allowed.

Cause

The browser agent automatically adds custom headers to outgoing same-origin AJAX calls in order to support the Distributed Tracing feature.

When the server that receives the AJAX call responds with a redirect status code (such as 302), the browser will automatically make the same AJAX call to the redirected URL. And if this new URL is on a different origin and the call does not pass the CORS preflight, the browser will fail the call with the error message listed above.