How to Check API CORS Headers

1. Open CORS checker. Go to /en/cors.
2. Enter endpoint URL. Example: https://api.example.com/users. Method: GET/POST/PUT/DELETE.
3. Specify Origin. The domain where the fetch originates. Example: https://app.example.com.
4. Run the check. The tool performs an OPTIONS preflight + real request and shows every CORS header in the response.
5. Read diagnostics. Typical fixes: add Access-Control-Allow-Origin: https://app.example.com (or whitelist). With credentials — no wildcard allowed.

Open tool →

Cross-Origin Resource Sharing (CORS) is a security feature implemented by web browsers to control how resources are shared across different origins. An origin is defined by the combination of the protocol, domain, and port number. Without proper CORS configuration, a web application can face significant issues when trying to access resources from a different origin.

CORS is crucial for API developers as it defines which domains can interact with their API. This is particularly important for preventing unauthorized access and protecting sensitive data. When a web application makes a request to a different origin, the browser checks the CORS settings of the target server to determine whether the request is permitted. If CORS is not configured correctly, the browser will block the request, resulting in errors.

Common CORS Errors:

• No 'Access-Control-Allow-Origin' header is present on the requested resource: This indicates that the server is not allowing requests from the origin of your web application.
• Credentialed requests require preflight: This means that the request includes credentials (like cookies or HTTP authentication) and requires a preflight check.
• Wildcard '*' cannot be used in the 'Access-Control-Allow-Origin' header when the credentials flag is true: This shows that you cannot use a wildcard for requests that include credentials.

Checking and configuring CORS settings can be done through various methods, including command-line tools, server configuration files, and API testing tools. Below are some practical commands and configurations for checking and setting CORS.

Using Curl to Check CORS Headers:

You can use the curl command to inspect the CORS headers returned by your API:

This command sends a request to your API's endpoint with a specified origin and retrieves the response headers. Look for the Access-Control-Allow-Origin header to see if the request is allowed.

Configuring CORS in Node.js with Express:

If you're using Node.js with the Express framework, you can easily configure CORS:

This configuration allows requests from https://example.com and supports credentialed requests.

Apache Server Configuration:

To enable CORS in an Apache server, you can modify the .htaccess file:

This setup ensures that only https://example.com can access your API resources while allowing credentials.

CORS misconfigurations can lead to frustrating issues for developers. Understanding these common pitfalls and knowing how to resolve them is essential for ensuring smooth API interactions.

1. Missing Access-Control-Allow-Origin Header:

If your API does not return the Access-Control-Allow-Origin header, browsers will block requests from different origins. To fix this, ensure your server is configured to include the header with the appropriate origin or a wildcard.

2. Wildcard with Credentials:

When credentials are included in a request, using a wildcard ('*') in the Access-Control-Allow-Origin header will cause errors. Instead, specify the exact origin that is allowed to access the resource.

3. Preflight Request Issues:

For requests that involve methods other than GET or POST, or that include custom headers, the browser sends a preflight OPTIONS request. If your server does not handle this request properly, it will result in errors. Ensure that your server responds to OPTIONS requests with the correct CORS headers.

4. Allowing All Origins:

While it may seem convenient to allow all origins using a wildcard, it can lead to security vulnerabilities. Always define specific origins that are permitted to prevent unauthorized access.

By addressing these common misconfigurations, you can significantly improve the reliability and security of your API's CORS settings.