21 September, 2007

How to Prevent Bandwidth Theft

One problem every webmaster should be aware of is bandwidth theft. Sometimes, malignant webmasters who like your images may decide to hotlink them, effectively serving your images (using up your bandwidth) on their site. While it may not be a problem ordinarily, all it takes is one time: if a blog with a large readership hotlinks your image, you may use up your monthly bandwidth allowance in the space of a day.
As with most problems, the best way to solve this issue is to prevent it from happening in the first place.
There are a few of ways you can stop hotlinkers from showing your images:
  • Denial of Access
  • Alternate Image Served
  • HTML Document Served
Each of these methods requires modifying the .htaccess file associated with your site. Your .htaccess file protects all files in the same directory as the .htaccess file as well as all files in subdirectories of that folder. When modifying the .htaccess file, remember that it must remain in ASCII format, so use Notepad or any other plain text editor.
The denial of access route is the most common method used. It basically consists of refusing any domain other than the ones you specify to show the image. The modification to your .htaccess file should include the following lines of code:
RewriteEngine On
RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http://yoursite.com [NC]
RewriteCond %{HTTP_REFERER} !^http://www.yoursite.com [NC]
RewriteRule .*\.(gif|jpg|swf|png)$ - [NC,F]
Make sure that each line is unbroken, and remember to replace yoursite.com with your actual domain name. Notice that this code refuses hotlinking of gifs, jpgs, pngs, and flash files.
Alternately, you may wish to try and gain hits from unwanted bandwidth theft. By serving an alternate image, you will still be serving up images, which causes you to lose bandwidth, but instead of the image the hotlinker requested, you may show an image that states: "To see this image, please visit YourSite.com" or something similar. To do this, simply replace that last line of code (the Rewrite Rule line) with the following:
RewriteRule .*\.(gif|jpg)$ http://yoursite.com/hotlinked.gif [R,NC]
Please notice that in this case, the image replaces only gifs and jpgs with your custom image.
The last method is rarely used, because it takes much more effort to implement, and requires php. But the last method has the added benefit of allowing people to link to your image, which the aforementioned methods do not allow. For example, if someone likes your image and decides to link to it, when the page loads, it will show the referrer as the page that linked to it–which means the RewriteRule from above takes effect, and the above code will deny or replace it. Yet you may not want to deny viewers from seeing your image in such a situation, since the person linking your image is not stealing it for their own use, but is actively referring their visitors to your content.
The idea is to change all requests for a picture file to instead serve an html file that shows the image requested. If someone hotlinks this image, the request will fail, because what your site will serve them is an html file, and browsers will be unable to render the file, and instead will show the generic image placeholder. But if someone links to the image, they will silently be redirected to an html page which will not only show them the image they wanted, but also provide links back to the rest of your content! So with this method, you disallow hotlinkers, and yet provide image linkers with the image they wanted, plus additional content that you specify.
There are two drawbacks to this final method: first, you must be using php; second, you will not be able to serve up an alternate image to hotlinkers. For an in-depth description of how to implement html document serving on image requests, see Thomas Scott’s excellent article on AListApart.

No comments:

Post a Comment