Access-Control-Allow-Origin (CORS origin)

I got a weird message today when trying to use XMLHttpRequest Request

Access to XMLHttpRequest at '' from origin '' has been blocked by CORS policy: Request header field traceparent is not allowed by Access-Control-Allow-Headers in preflight response.

I turns out that i need to turn on some headers on the destination server. This can be fixed by doing with .htaccess

Header set Access-Control-Allow-Origin "*"
Header set Access-Control-Allow-Methods: "GET,POST,OPTIONS,DELETE,PUT"
Header set Access-Control-Allow-Headers: "Accept,traceparent".  (you can customize this list)

Here is the reason behind this. Let say you host a javascript on , this script need to make a XMLHttpRequest on For security reason, the browser has implemented a thing call Cross Origin Resource Sharing (Cors) , this means that your browser will ask to check if is allowed to get data from By default, only calls from only. To overcome this, we must set the Header to let know what it is allowed ( see the example above). There are many level of controls, for example , if make some modification in the Http header before sending to , we must set the “Access-Control-Allow-Headers”.

For your reference:

Leave a Reply

Your email address will not be published. Required fields are marked *