DEV Community

Randika Madhushan Perera
Randika Madhushan Perera

Posted on

Configuring AWS WAF, CloudFront, and S3 Bucket for Secure Access

This document provides step-by-step instructions on configuring AWS WAF, CloudFront, and an S3 bucket to serve content securely while allowing access only from specific origins. We will address potential issues like 403 Forbidden errors and ensure seamless operation.

1. Objective

To configure AWS WAF, CloudFront, and S3 bucket:

  • Allow access only from specific origins: https://dev.test.com and https://int.test.com.
  • Serve the index.html file by default when accessing the CloudFront distribution.
  • Prevent unauthorized access and address common errors.

2. You will need..

  • An AWS S3 bucket (e.g., sample-bucket) containing your static website files.
  • An AWS CloudFront distribution with OAC linked to the S3 bucket.

3. Configuration Steps

Step 1: Make Sure S3 Bucket Policy has below

  1. Open the S3 Console.
  2. Select your bucket (e.g., sample-bucket).
  3. Check the following bucket policy to allow access from CloudFront:
{
    "Version": "2008-10-17",
    "Id": "PolicyForCloudFrontPrivateContent",
    "Statement": [
        {
            "Sid": "AllowCloudFrontServicePrincipal",
            "Effect": "Allow",
            "Principal": {
                "Service": "cloudfront.amazonaws.com"
            },
            "Action": "s3:GetObject",
            "Resource": "arn:aws:s3:::sample-bucket/*",
            "Condition": {
                "StringEquals": {
                    "AWS:SourceArn": "arn:aws:cloudfront::AWS_ACC_ID:distribution/CLOUDFRONT_ID"
                }
            }
        }
    ]
}
Enter fullscreen mode Exit fullscreen mode

Step 2: Configure CORS for the S3 Bucket

  1. In the S3 Console, go to the Permissions tab.
  2. Edit the CORS configuration and set the following:
[
    {
        "AllowedHeaders": ["*"],
        "AllowedMethods": ["GET", "HEAD", "PUT", "POST", "DELETE"],
        "AllowedOrigins": [
            "https://dev.test.com",
            "https://int.test.com"
        ]
    }
]
Enter fullscreen mode Exit fullscreen mode
  • Replace AllowedOrigins with your allowed domains.
  • Restrict AllowedHeaders to necessary headers for production.

Step 3: Configure AWS WAF

Create WAF Rules:

  1. Open the AWS WAF Console and select your Web ACL.
  2. Add the following rules:

Rule 1: Allow-Traffic

  • Description: Allows requests from specific origins.
  • Rule Definition:
{
    "Name": "Allow-Traffic",
    "Priority": 1,
    "Statement": {
        "OrStatement": {
            "Statements": [
                {
                    "ByteMatchStatement": {
                        "SearchString": "https://dev.test.com",
                        "FieldToMatch": {
                            "SingleHeader": {
                                "Name": "origin"
                            }
                        },
                        "TextTransformations": [
                            {
                                "Priority": 0,
                                "Type": "NONE"
                            }
                        ],
                        "PositionalConstraint": "EXACTLY"
                    }
                },
                {
                    "ByteMatchStatement": {
                        "SearchString": "https://int.test.com",
                        "FieldToMatch": {
                            "SingleHeader": {
                                "Name": "origin"
                            }
                        },
                        "TextTransformations": [
                            {
                                "Priority": 0,
                                "Type": "NONE"
                            }
                        ],
                        "PositionalConstraint": "EXACTLY"
                    }
                }
            ]
        }
    },
    "Action": {
        "Allow": {}
    },
    "VisibilityConfig": {
        "SampledRequestsEnabled": true,
        "CloudWatchMetricsEnabled": true,
        "MetricName": "Allow-Traffic"
    }
}
Enter fullscreen mode Exit fullscreen mode

Rule 2: Block-All-Other-Traffic

  • Description: Blocks all requests that don’t match the allowed origins.
  • Rule Definition:
{
    "Name": "Block-All-Other-Traffic",
    "Priority": 2,
    "Statement": {
        "NotStatement": {
            "Statement": {
                "OrStatement": {
                    "Statements": [
                        {
                            "ByteMatchStatement": {
                                "SearchString": "https://dev.test.com",
                                "FieldToMatch": {
                                    "SingleHeader": {
                                        "Name": "origin"
                                    }
                                },
                                "TextTransformations": [
                                    {
                                        "Priority": 0,
                                        "Type": "NONE"
                                    }
                                ],
                                "PositionalConstraint": "EXACTLY"
                            }
                        },
                        {
                            "ByteMatchStatement": {
                                "SearchString": "https://int.test.com",
                                "FieldToMatch": {
                                    "SingleHeader": {
                                        "Name": "origin"
                                    }
                                },
                                "TextTransformations": [
                                    {
                                        "Priority": 0,
                                        "Type": "NONE"
                                    }
                                ],
                                "PositionalConstraint": "EXACTLY"
                            }
                        }
                    ]
                }
            }
        }
    },
    "Action": {
        "Block": {}
    },
    "VisibilityConfig": {
        "SampledRequestsEnabled": true,
        "CloudWatchMetricsEnabled": true,
        "MetricName": "Block-All-Other-Traffic"
    }
}
Enter fullscreen mode Exit fullscreen mode

4. Testing and Verification

Test Allowed Origins

Run the following command:

curl -X GET https://cloudfront_domain_name \
     -H "Origin: https://dev.test.com" \
     -v
Enter fullscreen mode Exit fullscreen mode

Expected Result: HTTP 200 OK.

Test Disallowed Origins

Run the following command:

curl -X GET https://cloudfront_domain_name \
     -H "Origin: https://unauthorized.com" \
     -v
Enter fullscreen mode Exit fullscreen mode

Expected Result: HTTP 403 Forbidden.

Check WAF Logs

  1. Enable logging for the Web ACL in the AWS WAF Console.
  2. Monitor logs in CloudWatch to verify rule matches.

Top comments (0)