Referer Checking with WAF + CloudFront (Block Hotlinking)
Overview
This is a summary of how I implemented referer-based access control on CloudFront using AWS WAF (Web Application Firewall).
I introduced it as a measure to block hotlinking (direct linking).
The steps are as follows.
Navigate to Services > WAF & Shield and click Go to AWS WAF.
We’ll configure an ACL (Access Control List).
Review the overview
Without checking anything in particular, click the Next button.
Web ACL settings
Configure the following settings, then click the Next button.
| Item | Value |
|---|---|
| Web ACL name | (Any value) In this example I set the CloudFront CNAME. |
| CloudWatch metric name | Automatically filled in when you enter the Web ACL name. Change it only if you want a different value. |
| Region | Select Global (CloudFront). |
| AWS resource to associate | The place to select the target CloudFront. If you target a CloudFront distribution that is in production, set it later. |
Create a condition
Since we’ll use string matching as the condition this time, click the Create condition button under String match conditions.
Create a string match condition
Configure the following and click the Add filter button.
If you have multiple filters, repeat Add filter.
| Item | Value |
|---|---|
| Name | (Any value) |
| Part of the request to filter on | Header |
| Header | Referer |
| Match type | Contains |
| Transformation | Convert to lowercase |
| Value to match | Set the target domain |
What you added isn’t reflected immediately.
Just click the Next button as is.
Create a rule
Click the Create rule button.
Attach the condition to the rule
Set the Name and CloudWatch metric name,
and add the condition with Add conditions.
After that, click the Create button.
Deny access to requests that don’t match the rule
As expected, the rule isn’t reflected yet. But continuing on,
check Block all requests that don't match any rules and click the Review and create button.
- If you don’t want this applied to the target CloudFront, you need to deselect the resource where CloudFront is selected.
* You can associate it at the end, so I think you shouldn’t do it here.
Create after reviewing the entered content on the confirmation page
Click the Confirm and create button.
Edit the target web ACL
Select it from WEB ACLs and click the Edit web ACL button.
Edit the web ACL
- Select the rule you created
- Click the
Add rule to web ACLbutton - Select Allow
- Click the
Updatebutton
[f:id:kenzo0107:20171005183720p:plain]
Associate CloudFront
Click the Add association button.
Associate CloudFront with the web ACL
Select the target CloudFront in Resource and click the Add button.
That’s it. After a few minutes, referer checking via WAF + CloudFront will be in effect.
Verifying access
In my own environment,
I edited the local /etc/hosts, placed a link from the target domain to the CloudFront CNAME, and verified it.
When I accessed a resource directly via the CloudFront CNAME domain,
I confirmed that an error page like the one below was displayed.
Making it a bit more user-friendly
The error page above can be customized by going to CloudFront > Error Pages and specifying a path on S3 with Create Custom Error Response.
By all means, preparing an error page that matches your site’s concept will make for a more user-friendly delivery.
That’s all.
I hope this is helpful.
