AJAX For Evil: Spyjax

With great power comes great responsibility. With every advancement in technology we face the threat of it being used for evil purposes. This is the case with AJAX. AJAX has a ton of great uses but one form of negative AJAX has taken life: Spyjax.

Spyjax, as I know it, is taking information from the user's computer for your own use -- specifically their browsing habits. By using CSS and JavaScript, I can inject anchor links into the page and tell whether you've been to the link's URL. How? Quite easy actually.

The JavaScript is really done into parts. The first part is injecting the links into the page, the second part is pulling the link's text color from our injected elements. You'd think it would be harder, huh? Nope!

Spyjax isn't as evil as stealing credit card information or social security numbers but it can be an invasion of privacy. One use I've seen for Spyjax has been checking to see if a user's been to Digg. If so, show the "Digg This" button. If not, check for Reddit, DZone, and so on.

As much as developers now loathe Flash, we're still playing a bit of catch up to natively duplicate the animation capabilities that Adobe's old technology provided us. Of course we have canvas, an awesome technology, one which I highlighted 9 mind-blowing demos. Another technology available...

Chances are that any Web designers using our Ghostlab browser testing app, which allows seamless testing across all devices simultaneously, will have worked with responsive design in some shape or form. And as today's websites and devices become ever more varied, a plethora of responsive images...

As much as developers now loathe Flash, we're still playing a bit of catch up to natively duplicate the animation capabilities that Adobe's old technology provided us. Of course we have canvas, an awesome technology, one which I highlighted 9 mind-blowing demos. Another technology available...

If you troll page markup like me, you've no doubt seen the use of data URI's within image src attributes. Instead of providing a traditional address to the image, the image file data is base64-encoded and stuffed within the src attribute. Doing so saves...

it’s indeed a clever way to learn more about user’s browsing habits. The information you gain can be saved into a DB and used for optimization or even direct marketing purposes. But like you said, it isn’t necessarily evil. it depends on what you do with it.

Incredible. I haven’t understood all of your code, but would this have been possible pre-Ajax?

Andrea

Good call.

If you only use it to decide whether to display a button, like in the examples you mention, this would be ok, but… then you wouldn’t need Ajax at all: this would only affect the visibility of a given element on the page, so you don’t need to send any data back to the server.

In fact, unless I’m missing out on something, you don’t even need to inject anything into the page via Javascript. The hidden links can be simply part of your page template. All you need to do is to check their colours to see whether the browsers knows them as visited.

I must say, I wouldn’t rely all that much on this information: I’m not visiting the *home page* of my social bookmarking site very often, and I’m pretty sure it is not in my history -which only remembers pages visited in the last 9 days- now.

Anyway, as long as you don’t send the results back to the server (or store them in a cookie, for that matter) and use them to truly spy on the visitor, it’s ok.

Andrea

Ben: XMLHttpRequest has been available since IE5 (March 1999) iframes since IE3 (1996): both can be used for what is now called Ajax.

But you can also use cookies (first implemented in 1994) to store the info and send it back to the server with the visitor’s next visit to any page of the web site: not sure about how well JavaScript could support this particular technique at that time.

@Rey: I’m going to get evil on this laptop if doesn’t stop telling me “Operating System Not Found” all the time. :)

I don’t have any more plans for this. I see a super scandalous use and a decent marketing use — neither of which I feel comfortable with.

Keep up the good work at Ajaxian!

Rey Bango

@David Thx man. Your site is one of the blogs I look for content from so keep up the good work as well! :)

Gholister

So then, Acme Widgets could know whether I’ve been checking out the competition’s prices over at the WidgetCo website, and could have tailored their website output accordingly…

@David: I don’t see much point in hiding these uncomfortable ideas, even though they don’t quite sit right – Pandora’s box is well and truly open already. It’s like those replacement keypads and card scanners that people were sticking to the front of ATMs – while the police didn’t want to put the idea in any more criminal heads, they were already out there and the public had to be educated in order to look out for and avoid them. Besides, I’m morbidly curious about security, best interests be damned :)

This could most certainly be a very useful tool for sites who are craving social bookmarking users. Instead of cluttering your design with every social bookmarking tool you could just have the ones your visitors are using!

qwaxys

Ben: sending information to the server doesn’t require XMLHttpRequest
you could simply create a 1×1 pixel image and let it load with JavaScript
example: yourdomain.com/pre-ajax/q1/data1/q2/data2/image.gif

I personally think it’s very important. This isn’t new to the web…it’s not checking anything that is private…and the majority of the time it is used to serve better/more targeted information. Basically, if I’m forced to look at an ad why not be an ad that is relative to my tastes?

I think this has been flagged by Mozilla for ages as a bug to fix, but there’s really no way to fix it other than to remove a:visited altogether. I mean, you could get rid of a:visited altogether, but that’s much worse than knowing about a handful of sites I might have visited before.

You could still use this, though, if you retooled it a bit to rely on the element’s box (height/width/padding) or psuedo-elements, right? As far as I know browsers don’t block against that.

sneaky

I’m sorry – maybe I’m not understanding this… Where do you throw the javascript? In other words, how do you install this on a page?

I get that you throw the CSS in-line, then the PHP in the body, but I don’t know anything about javascript. When I copy/paste this code into a page, everything below the //inject! line simply displays, instead of parsing…