How to Set CORS in AWS S3: Simple Steps and Example

To set CORS in an AWS S3 bucket, you add a CORS configuration JSON to the bucket's permissions. This configuration defines which origins can access your bucket and what HTTP methods are allowed.

Syntax

The CORS configuration for an S3 bucket is a JSON document with a list of rules. Each rule includes allowed origins, methods, headers, and other settings.

• AllowedOrigins: List of URLs allowed to access the bucket.
• AllowedMethods: HTTP methods like GET, PUT, POST allowed.
• AllowedHeaders: Headers allowed in requests.
• ExposeHeaders: Headers exposed in responses.
• MaxAgeSeconds: How long browsers cache the response.

json

{
  "CORSRules": [
    {
      "AllowedOrigins": ["string"],
      "AllowedMethods": ["string"],
      "AllowedHeaders": ["string"],
      "ExposeHeaders": ["string"],
      "MaxAgeSeconds": integer
    }
  ]
}

Example

This example allows any website to read objects from the bucket using GET requests and caches the permission for 3000 seconds.

json

{
  "CORSRules": [
    {
      "AllowedOrigins": ["*"],
      "AllowedMethods": ["GET"],
      "AllowedHeaders": ["*"],
      "ExposeHeaders": [],
      "MaxAgeSeconds": 3000
    }
  ]
}

Output

CORS configuration applied successfully to the S3 bucket.

Common Pitfalls

Common mistakes when setting CORS in S3 include:

• Using * in AllowedOrigins but also specifying credentials, which is not allowed.
• Forgetting to include the HTTP methods your application uses.
• Not setting AllowedHeaders properly, causing requests to fail.
• Not applying the configuration to the correct bucket.

Always test your CORS settings with your application to ensure they work as expected.

json

Wrong example:
{
  "CORSRules": [
    {
      "AllowedOrigins": ["*"],
      "AllowedMethods": ["GET", "POST"],
      "AllowedHeaders": [],
      "ExposeHeaders": [],
      "MaxAgeSeconds": 3000
    }
  ]
}

Right example:
{
  "CORSRules": [
    {
      "AllowedOrigins": ["https://example.com"],
      "AllowedMethods": ["GET", "POST"],
      "AllowedHeaders": ["*"],
      "ExposeHeaders": [],
      "MaxAgeSeconds": 3000
    }
  ]
}

Quick Reference

Remember these tips when setting CORS in S3:

• Use specific origins instead of * when credentials are needed.
• Include all HTTP methods your app uses.
• Set AllowedHeaders to * to allow all headers or specify needed headers.
• Test changes immediately as CORS errors can block your app.

Key Takeaways

Set CORS in S3 by adding a JSON configuration with allowed origins and methods.

Avoid using wildcard origins with credentials to prevent errors.

Include all HTTP methods and headers your application requires.

Test your CORS settings to ensure your app can access the bucket.

Apply the configuration to the correct S3 bucket to take effect.