Preparing images for online publishing is a difficult task. You might have spent long hours in creating an infographic or a step-by-step template image for your article. In that case, how do you feel if someone simply link your image on their site without your permission? Here comes the hotlink prevention feature offered by most cPanel hosting and CDN services. It is the method to stop anyone stealing your images by directly linking the image URL. But the problem with hotlink prevention is that it will also stop you from linking your own images on other domains. In this article, we will show you how to bypass hotlink protection feature in Cloudflare and exclude domains, HTTP referrers or IP addresses.
Handling Hotlink Protection Exclusion
Hotlink protection will completely stop linking your images from other domains. However, there are many reasons you may want to exclude the protection. For example, you may want to test the site on localhost server with images loading. Otherwise, the page layout might look distorted with broken images. You have two options here:
- Temporarily disable hotlink feature in Cloudflare
- Permanently add exclusion for your localhost or IP address
Temporarily Disable Hotlink Protection in Cloudflare
This is the best option if you are doing one-time testing on localhost or any other domain by linking your images.
- Login to your Cloudflare account and select the site from dashboard.
- Go to “Scrape Shield” section from left sidebar.
- Scroll down on the right settings page and find “Hotlink Protection” option.
- Turn off the button agaisnt the option to disable it.
- When you are done with the testing, follow the same steps and turn the feature on again.
Excluding from Hotlink Protection in Cloudflare
If you are frequently testing with local site layout or on a staging site, then you need all the images from server loading on your testing or staging site. In this case, you can create configuration rules for exclusion instead of disabling/enabling hotlink protection every time.
Step 1 – Access Configuration Rule Section
- When you are in “Scrape Shield > Hotlink Protection” section, click the “Configuration Rule” link. Alternatively, go to “Rules > Configuration Rules” section from the left sidebar and click “Create rule” button.
Step 2 – Provide Rule Name
First you need to provide a descriptive name for your rule. For example, I will use “Localhost Exclusion” to understand the rule is created to bypass hotlink protection for testing in localhost site. You can create up to 10 configuration rules in free account.
Step 3 – Setup Custom Filters
Next step is to select “Custom filter expression” option under “If… When incoming requests match…” heading. This allows you to customize your rule by using various fields, operators and values.
You can select the fields as per your need. For excluding localhost, select the following options from the drop-downs:
- Field – Referrer
- Operator – Contains
- Value – localhost
The “Expression Preview” should show as:
(http.referer contains "localhost")
Similarly, you can exclude IP address by using the following parameters:
- Field – IP Source Address
- Operator – equals
- Value – type your IP address
In this case, the “Expression Preview” should show as:
(ip.src eq IP_Address)
In addition to IP and HTTP referrer, there are numerous fields available for filtering like hostname, URL, full path, etc. You can combine multiple filters using “And” and “Or” logical operators to use them in a single rule. For example, you can combine both IP and localhost referrer using “And” operator which will bypass hotlink protection on localhost only if it is accessed from that particular IP address.
Step 4 – Add Hotlink Protection Exclusion to Rule
After you have added the required filters, scroll down below “Then the settings are…” heading. Find “Hotlink Protection (optional)” item and click on “Add” button against it. This will show a switch in turned off state indicating the configuration rule will be applied for bypassing hotlink protection.
Step 5 – Deploy Your Rule
Scroll down to bottom of the page and click on “Deploy” button to apply your configuration rule on live site.
Now, check your localhost or staging site and you will see all the images will be loading from the live server.
As mentioned, temporarily disabling hotlink protection is a quick fix for testing. However, someone can link your images and steal server’s bandwidth till the time you enable the setting back. If you are worrying about disabling hotlink protection in Cloudflare account, then create custom configuration rules and exclude the fields you want. In that way, you can carry on with the testing while the live site is protected all the time.