Return to topic cards

Understanding Access-Control-Allow-Origin Header

CORSWeb SecurityHTTP HeadersAccess ControlServer Configuration

The Access-Control-Allow-Origin header is a crucial component of web security, used by servers to specify whether resources on a website can be accessed by web pages from different origins. This header is essential for implementing Cross-Origin Resource Sharing (CORS) policies.

Key Points

  • Single Origin: Allows access from a specific origin.

    • Example: Access-Control-Allow-Origin: https://example.com

  • Multiple Origin: Allows access from multiple specified origins.

    • Example: Access-Control-Allow-Origin: ["https://example1.com", "https://example2.com"]

  • Wildcard Origin: Permits requests from any origin.

    • Example: Access-Control-Allow-Origin: *

  • With Credentials: Allows access from a specific origin and includes credentials.

    • Example: Access-Control-Allow-Origin: https://example.com along with Access-Control-Allow-Credentials: true

Configurations

Single Origin

Use this configuration to allow access from a single, specific origin.

Access-Control-Allow-Origin: https://example.com

Multiple Origin

Use this configuration to allow access from multiple specified origins.

Access-Control-Allow-Origin: ["https://example1.com", "https://example2.com"]

Wildcard Origin

Use this configuration to permit requests from any origin.

Access-Control-Allow-Origin: *

With Credentials

Use this configuration to allow access from a specific origin and include credentials. Wildcards are not allowed in this case.

Access-Control-Allow-Origin: https://example.com
Access-Control-Allow-Credentials: true

Learn More

For more detailed information on CORS and the Access-Control-Allow-Origin header, you can refer to the MDN Web Docs on CORS.