The Access-Control-Allow-Origin is a response header that is used to indicates whether the response can be shared with requesting code from the given origin.
Syntax:
Access-Control-Allow-Origin: * | <origin> | null
Directives: Access-Control-Allow-Origin accepts there types of directives mentioned above and described below:
- *: This directive tells the browsers to allow requesting code from any origin to access the resource. Used as a wildcard.
- <origin>: This directive defines any single origin.
- null: This directive defines null that should not be used due to any origin can create a hostile document with a “null” Origin. The “null” value for the ACAO(Access-Control-Allow-Origin) header should therefore, be avoided.”
Example:
- This example tells the browser to allow code from any origin to access a resource.
access-control-allow-origin: *
- A response that tells the browser to allow requesting code from the origin https://www.geeksforgeeks.org to access a resource will include the following:
access-control-allow-origin:https://www.geeksforgeeks.org
Here the value of the Origin request header is compared with the list of allowed origins, and if the response header origin value is present in that compared list. Then set the Access-Control-Allow-Origin value to the same value as the Origin value.
To check this Access-Control-Allow-Origin in action go to Inspect Element -> Network check the response header for Access-Control-Allow-Origin like below, Access-Control-Allow-Origin is highlighted you can see.
Supported browsers: The browsers compatible with HTTP headers Access-Control-Allow-Origin are listed below:
- Google Chrome 4.0
- Internet Explorer 10.0
- Firefox 3.5
- Safari 4.0
- Opera 12.0