CORS Tester

Test Cross-Origin Resource Sharing (CORS) configuration by sending a fetch request to any endpoint and checking if it passes or fails CORS validation.

What is CORS?

CORS (Cross-Origin Resource Sharing) is a security feature implemented by web browsers that controls how web pages from one domain can access resources from another domain. It's a mechanism that uses HTTP headers to tell browsers whether to allow a web application running at one origin to access selected resources from a server at a different origin.

By default, browsers enforce the Same-Origin Policy, which blocks requests between different origins. CORS provides a controlled way to relax this restriction, allowing servers to specify which origins are permitted to access their resources.

How to Enable CORS in Different Programming Languages?

Node.js (Express)

// Install cors package: npm install cors
const cors = require('cors');
app.use(cors({
  origin: 'https://example.com',
  credentials: true
}));

Python (Flask)

# Install flask-cors: pip install flask-cors
from flask_cors import CORS
CORS(app, origins=['https://example.com'])

Ruby on Rails

# In config/initializers/cors.rb
Rails.application.config.middleware.insert_before 0, Rack::Cors do
  allow do
    origins 'example.com'
    resource '*', headers: :any, methods: [:get, :post, :put, :patch, :delete, :options, :head]
  end
end

PHP

header("Access-Control-Allow-Origin: https://example.com");
header("Access-Control-Allow-Methods: GET, POST, PUT, DELETE");
header("Access-Control-Allow-Headers: Content-Type");

Java (Spring Boot)

@CrossOrigin(origins = "https://example.com")
@RestController
public class ApiController {
  // Your endpoints
}

What are CORS Preflight Requests?

A CORS preflight request is an OPTIONS request that browsers automatically send before certain cross-origin requests. This happens when the request uses methods other than GET, HEAD, or POST, or when it includes custom headers.

The preflight request checks with the server whether the actual request is allowed. The server responds with headers indicating which origins, methods, and headers are permitted. Only if the preflight succeeds will the browser send the actual request.

Understanding preflight requests is crucial for debugging CORS issues, as failures in the preflight phase will prevent your actual request from being sent.

Common CORS Error Messages and Solutions

Error: "No 'Access-Control-Allow-Origin' header"

Solution: The server needs to include the Access-Control-Allow-Origin header in its response. Configure your server to add this header with appropriate origin values.

Error: "CORS header 'Access-Control-Allow-Origin' missing"

Solution: Similar to above, ensure your server is configured to send CORS headers. Check that your server-side CORS configuration is properly set up.

Error: "Credentials flag is true but Access-Control-Allow-Credentials is not 'true'"

Solution: When sending credentials (cookies, auth headers), the server must include Access-Control-Allow-Credentials: true header, and Access-Control-Allow-Origin must not be a wildcard (*).

CORS Headers Explained

  • Access-Control-Allow-Origin: Specifies which origins can access the resource. Use specific domains for security, not wildcard (*) in production.
  • Access-Control-Allow-Methods: Lists the HTTP methods allowed when accessing the resource (GET, POST, PUT, DELETE, etc.).
  • Access-Control-Allow-Headers: Indicates which headers can be used during the actual request.
  • Access-Control-Allow-Credentials: Indicates whether the response can be shared when credentials flag is true.
  • Access-Control-Max-Age: Indicates how long the results of a preflight request can be cached.
  • Access-Control-Expose-Headers: Lists headers that the browser can access from the response.

How to Test CORS Configuration?

Testing CORS configuration is essential to ensure your API is accessible from authorized origins while maintaining security. Use this CORS tester tool to:

  • Verify that your API endpoints are properly configured for cross-origin requests
  • Test different HTTP methods (GET, POST, PUT, DELETE) to ensure they're allowed
  • Check if custom headers are accepted by your server
  • Validate preflight request handling for complex requests
  • Debug CORS errors by examining response headers
  • Test authentication scenarios with credentials

Regular CORS testing helps prevent issues in production and ensures smooth integration with frontend applications hosted on different domains.

Related Tools

View all tools