Blog - Watermarking hotlinked images

Watermarking hotlinked images

"Hotlinking" is usually associated with using images from someone's web site without permission and at the same time stealing that person's bandwidth. It sure sounds like and is a bad thing, but the topic doesn't end there. Most hotlinkers have no clue what they are doing, and, in my case, the stolen bandwidth really isn't considerable.

One popular solution is to block all requests to images with an unknown referrer (HTTP_REFERER request header) as described in the Apache URL Rewriting Guide (under "Blocked Inline-Images"). I previously used this method myself, actually serving a lo-fi "DO NOT HOTLINK" image instead of the requested image. It works, but it wasn't quite what I wanted. It's not like most of the hotlinking was stealing heaps of my bandwidth anyway. After a while I stopped.

Recently I re-thought this method to instead automatically serve a "watermarked" image only when hotlinked, in my case adding just a small logo with this site's URL (as seen on the right) in a corner of the image and serving it that way.
I generally dislike watermarking, and I strongly agree with Jason Scott's thoughts on the topic. However I don't care giving a watermarked image to those who don't know better than to hotlink my images, and I think it is only fair since they're using my bandwidth. If viewers like the hotlinked image, they might as well know its source (almost never credited by hotlinkers).

This solution can be put in place by adding a few lines to .htaccess (Apache server), and creating a short PHP script.

.htaccess

RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http://(www\.)?chipple\.net/  [NC]
RewriteRule ^(.*\.jpg)$ /hotlink.php?fn=$1 [L]

This translates to "for all JPG images, redirect internally to script /hotlink.php, except if the HTTP_REFERER is empty or starts with http://www.chipple.net/ or http://chipple.net/".

Additionally, one can add lines similar to the second one, allowing unobstructed images to be used on other specific sites, or on search services like Google Images. That's what I do.

Next is the script that adds the watermark. You will need to create a small image that will be used as the watermark image. I chose to make it a grayscale image with transparent parts. This example assumes that the watermark image is called hotlink.png and located in the same folder as the script. Also, the $sRoot variable must be set to your site's server root path.

hotlink.php

<?php

$sFN = $_GET['fn'];  // Request filename

// Reject bad request filenames, adjust if needed
if (strpos($sFN,'../') !== false || strpos($sFN,'.jpg') === false) {
  header('Status 403 Forbidden');
  exit();
}

$sRoot = "/usr/myaccount/public_html/";  // Server root, ADJUST

// Load requested image
if ($img = @imagecreatefromjpeg($sRoot.$sFN)) {
  // Add watermark to bottom-left corner of image, at 80% opacity
  if ($imgLogo = @imagecreatefrompng('hotlink.png')) {
    $iHeight = imagesy($img);
    $iWidthLogo = imagesx($imgLogo);
    $iHeightLogo = imagesy($imgLogo);
    imagecopymerge(
       $img,$imgLogo,  // Destination and source images
       0,$iHeight-$iHeightLogo,  // Position for logo on destination image
       0,0,$iWidthLogo,$iHeightLogo,  // Area of logo image to copy
       80);  // Opacity (1-100)
    imagedestroy($imgLogo);
  }
}
else {
  header('Status 404 Not Found');
  exit();
}

// Output image to browser
header('Content-Type: image/jpeg');
imagejpeg($img);
imagedestroy($img);

?>

That should be it!

Posted on November 4, 2006 at 11:47 | Tweet |

---

Trackback

---

Comments RSS

---

© 2003-2024, chi­pple­.n­et