Prevent JavaScript Hotlinking with .htaccess

By  on  

Almost a decade (!) ago I wrote a post about preventing image hotlinking.  We all have the right to protect imagery hosted on our domain because it can slow our site down tremendously.  I love that post because it shows you how to replace the image requested with any image of your choosing; for example, I could replace any incoming image request with my logo:

<IfModule mod_rewrite.c>
  RewriteEngine on
  RewriteCond %{HTTP_REFERER} !^$
  RewriteCond %{HTTP_REFERER} !^https://davidwalsh.name/.*$ [NC]
  RewriteRule .*.(png|gif|jpe?g)$ [F,NC]
</IfModule>

But what should we do when someone is hotlinking JavaScript files?  I've written a ton about JavaScript over the years, oftentimes providing a demo page, so you can probably guess I host many JavaScript files, including all of my MooTools plugin files.  I've chosen a somewhat harsh approach to prevent hotlinking of JavaScript files:

<IfModule mod_rewrite.c>
  RewriteEngine on
  RewriteCond %{HTTP_REFERER} !^$
  RewriteCond %{HTTP_REFERER} !^https://davidwalsh.name/.*$ [NC]
  RewriteRule \.(js)$ http://davidwalsh.name/hotlink.js [R,L]
</IfModule>

The snippet above, placed in my .htaccess file, directs my server to ignore the JavaScript file the foreign domain has requested and instead provide a hotlink.js file whose contents are a bit devious:

window.location = 'https://davidwalsh.name/';

A bit harsh?  Perhaps, but my server is put under undue stress, they shouldn't be hotlinking files, and being redirected to my site is a good indication of where they should be looking to fix the issue.  I could do worse, like serve evil.js or redirect them to an adult site, but I'd prefer not to go that far.

Protect your server from hotlinking -- you have every right to and, in the end, you're probably doing them a favor.

Recent Features

  • By
    5 HTML5 APIs You Didn&#8217;t Know Existed

    When you say or read "HTML5", you half expect exotic dancers and unicorns to walk into the room to the tune of "I'm Sexy and I Know It."  Can you blame us though?  We watched the fundamental APIs stagnate for so long that a basic feature...

  • By
    CSS Filters

    CSS filter support recently landed within WebKit nightlies. CSS filters provide a method for modifying the rendering of a basic DOM element, image, or video. CSS filters allow for blurring, warping, and modifying the color intensity of elements. Let's have...

Incredible Demos

  • By
    Chris Coyier’s Favorite CodePen Demos IV

    Did you know you can triple-heart things on CodePen? We’ve had that little not-so-hidden feature forever. You can click that little heart button on any Pen (or Project, Collection, or Post) on CodePen to show the creator a little love, but you can click it again...

  • By
    MooTools Font-Size Scroller with Cookie Save

    Providing users as many preferences as possible always puts a smile on the user's face. One of those important preferences is font size. I can see fine but the next guy may have difficulty with the font size I choose. That's why...

Discussion

    Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!