Simple Cloaking Tricks

Published in Web Development on Thursday, October 7th, 2004

Tie together some cloaking and the user-agent string widget for Firefox and you've got a handy tool.

Here's a little trick that we've been using lately for certain things, cloaking!

Disclaimer: we've used this trick in the situations descibed below and it has worked well. It is not super secure, so use caution when applying!

What can't Firefox do?

Tied together with the User Agent Toolbar Widget, we've been using cloaking for things from private site previews to in-situ error testing. How you ask?

The idea

We recently finished a redesign for a clients site. What we wanted was a way to lay the new site (new script) over the old one, and have our client, with offices across Europe, be able to seamlessly preview the new site, without the general public sneaking a peek.

In this case what we did was have the server check the user-agent string of the browser for a "top-secret" agreed upon string that the client set in the UA widget. Depending on the value, the script would serve up the appropriate site. We could have done this with specific IP's or a login screen somewhere, but this method was simple, fast, and we managed to get quite a few people to download and install Firefox - they had to to see the site!

Other applications

  1. New sites can be tested "in-situ" to help deal with last minute server troubles, and by allowing the validator you can validate too, all the while with a nice placeholder site up.
  2. While I agree that testing before going live is the way to go, sometimes when you make changes to sites things go weird on the live server and you don't know why. If something is up, you can set error_reporting(E_ALL) in PHP based on the presence of a certain UA string, for example, and again trouble-shoot privately and in place.
  3. It can be used as a 'silent' style-switcher for new CSS files.

Any others ideas??

Comments and Feedback

we managed to get quite a few people to download and install Firefox

Yeah, that's most important!

Beautiful idea! Just remember to switch back afterward or risk a run of 'browser not supported' errors.

That shouldn't be an issue, if I follow you here :-]

Every browser gets a site, just one's with special UA's get the special peek or whatever you're up to.

Highly unlikely but I wonder... since I assume you're applying this technique to a live, publicly indexed site could search engines penalize the site's ranking by interpreting it as typical SEO cloaking attempt?

The only thing I notice about this method is that it doesn't seem to let you test in other browsers. You can only test in firefox, so it seems it's more of a sneak-preview rather than a testing stage; which is what you called it (sneak-preview), so I guess you're exactly right!

Great idea! I'll try and implement it soon

I can not see the point with this solution!? Maybe that I have missed something...

It seems to me like this solution is similar to a tailored URI-variable, for instance http://myDoc.php?id=xxx&mode=sneak-preview

Especially since you will have to change every excisting page to redirect all "Super-Agents" to your new website.

Have you at all considered using a different http port(not 80) for this? Maybe that would create problems that I've missed while thinking....

Besides from that I think that your solution is a good way to get people to use FF, but not so good since you can't test the website with different browsers...

Hey Kalle, really, the usefulness of this depends on how you set up your site.

For example, we tend to use a central script format that handles everything. This makes it easy to drop a test for the useragent into the htaccess file and serve up one script or the other.

We also rewrite our urls, so adding a ?mode=sneak-preview in there would be a pain, especially because you would have to add it to every single link in the new site in order to click thru smoothly and see the new stuff.

Playing with the port is cool too if you have that kind of control. Most people don't, being on shared hosting.

Home » Blog » Web Development

Check out the blog categories for older content

The latest from my personal website,
Mike Papageorge.com

SiteUptime Web Site Monitoring Service

Sitepoint's web devlopment books have helped me out on many occasions both for finding a quick solution to a problem but also to level out my knowlegde in weaker areas (JavaScript, I'm looking at you!). I am recommending the following titles from my bookshelf:

The Principles Of Successful Freelancing

I started freelancing by diving in head first and getting on with it. Many years and a lot of experience later I was still able to take away some gems from this book, and there are plenty I wish I had thought of beforehand. If you are new to freelancing and have a lot of questions (or maybe don't know what questions to ask!) do yourself a favor and at least check out the sample chapters.

The Art & Science Of JavaScript

The author line-up for this book says it all. 7 excellent developers show you how to get your JavaScript coding up to speed with 7 chapters of great theory, code and examples. Metaprogramming with JavaScript (chapter 5 from Dan Webb) really helped me iron out some things I was missing about JavaScript. That said each chapter really helped me to develop my JavaScript skills beyond simple Ajax calls and html insertion with libs like JQuery.

The PHP Anthology: 101 Essential Tips, Tricks & Hacks

Like the other books listed here, this provides a great reference for the PHP developer looking to have the right answers from the right people at their fingertips. I tend to pull this off the shelf when I need to delve into new territory and usually find a workable solution to keep development moving. This only needs to happen once and you recoup the price of the book in time saved from having to develop the solution or find the right pattern for getting the job done..