Web Programming: Hot Linking

If people are ‘hotlinking’ to your image files, they are using your bandwidth which you will ultimately pay for.

You can stop this from happening by placing a ‘.htaccess’ file in the folder where your images are stored. This will only allow requests from your own pages to display the images – anyone linking to them from outside of your website, or any website you choose, will have the ‘red x’ instead of the image.

Example: Your site url is http://www.mysite.com. To stop hotlinking of your images from other sites and display a replacement image called hotlink.gif from our server, place this code in your .htaccess file:

RewriteEngine On
RewriteCond %{HTTP_REFERER} !^http://(.+\.)?mysite\.com/ [NC]
RewriteCond %{HTTP_REFERER} !^$
RewriteRule .*\.(jpe?g|gif|bmp|png)$ http://altlab.com/hotlink.gif [L]

The first line of the above code begins the rewrite. The second line matches any requests from your own mysite.com url. The [NC] code means “No Case”, meaning match the url regardless of being in upper or lower case letters. The third line means allow empty referrals. The last line matches any files ending with the extension jpeg, jpg, gif, bmp, or png. This is then replaced by the hotlink.gif image from the altlab.com server. You could easily use your own hotlink image by placing an image file in your site’s directory and pointing to that file.

To stop hotlinking from specific outside domains only, such as myspace.com, blogspot.com and livejournal.com, but allow any other web site to hotlink images:

RewriteEngine On
RewriteCond %{HTTP_REFERER} ^http://(.+\.)?myspace\.com/ [NC,OR]
RewriteCond %{HTTP_REFERER} ^http://(.+\.)?blogspot\.com/ [NC,OR]
RewriteCond %{HTTP_REFERER} ^http://(.+\.)?livejournal\.com/ [NC]
RewriteRule .*\.(jpe?g|gif|bmp|png)$ http://altlab.com/hotlink.gif [L]

You can add as many different domains as needed. Each RewriteCond line should end with the [NC,OR] code. NC means to ignore upper and lower case. OR means “Or Next”, as in, match this domain or the next line that follows. The last domain listed omits the OR code since you want to stop matching domains after the last RewriteCond line.

You can display a 403 Forbidden error code instead of an image. Replace the last line of the previous examples with this line:

RewriteRule .*\.(jpe?g|gif|bmp|png)$ – [F]

Warning: Do not use .htaccess to redirect image hotlinks to another HTML page or server that isn’t your own (such as this html page). Hotlinked images can only be replaced by other images, not with an HTML page.

As with any htaccess rewrites, you may block some legitimate traffic (such as users behind proxies or firewalls) using these techniques.

HOwever, we sure want google reader to be able to access our image,

For those who don’t know, Google Reader can’t access images from blogs that have enabled hotlink protection.

If you have the same problem with Google Reader not displaying your blog’s post images and have disabled hotlinking via .htaccess, just follow this short and simple tutorial.

NOTE: Make sure you back up your existing .htaccess file before you do any modifications. In case something goes wrong, you can always revert to the original file.

The following is the basic code or .htaccess rule to disable hotlinking or protect images from hotlinking:

# Disable Hotlinking
RewriteEngine On
RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http://(www.)?domain.com/ [NC]
RewriteRule .*.(jpeg|jpg|gif|png)$ - [F]


NOTE: Replace ?domain.com/ with  your own blog URL.

The following code/htaccess rule is the one  that will allow  Google Reader access to the hotlink-protected images  from your server. If you noticed, there are two lines. The first line is  for the regular Google Reader and the second one is  for Google Reader Mobile just in case you have readers  who use that.

RewriteCond %{HTTP_REFERER} !^http://www.google.com/reader/view/.*$ [NC]
RewriteCond %{HTTP_REFERER} !^http://www.google.com/reader/m/view/.*$ [NC]

Now, combine the previous code to basic disable hotlinking code and you should have this:

# Disable Hotlinking
RewriteEngine On
RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http://(www.)?domain.com/ [NC]
RewriteCond %{HTTP_REFERER} !^http://www.google.com/reader/view/.*$ [NC]
RewriteCond %{HTTP_REFERER} !^http://www.google.com/reader/m/view/.*$ [NC]
RewriteRule .*.(jpeg|jpg|gif|png)$ - [F]

Copy and paste the code to your .htaccess file, save it and upload it back to your web server. That should fix the issue and solve your problem with Google Reader not displaying your blog post images.
---

source:

jaypeeonline.net

htmlbasix.com

altlab.com

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s