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.

I’ve taken the time to demonstrate this technique using jQuery.

The CSS

a.checkme			{ color:#00ff00; }
a.checkme:visited	{ color:#ff0000; }

The most important part of the CSS is the difference in “:link” and “:visited” color; the method by which we can tell if a site has been visited is by its link color being the “:visited” color.

The jQuery JavaScript

//when the page is ready
$(document).ready(function() {
	//the list of domains to check and an array which will store hits
	var domains = ['davidwalsh.name','css-tricks.com','scriptandstyle.com','cnn.com','digg.com'];
	var visited = [];
	//for every domain...
	$.each(domains,function() {
		//inject a link into page
		var a = $('').attr({
			href: 'http://' + this,
			'class': 'checkme'
		}).appendTo(document.body);
		//check the color of the link
		if($(a).css('color') == '#ff0000' || $(a).css('color') == 'rgb(255, 0, 0)') { //either format of color
			$(a).addClass('highlight');
			visited.push(this);
		}
		//remove from the page -- no longer need the links
		a.remove();
	});
	if(visited.length) {
		//save via ajax!  shady!
		//display items on the page based on "hits"
	}
});

We start by injecting a bunch of hidden links into the page (unbeknownst to the user). For each link we’ve injected into the page, our jQuery JavaScript grabs the link color — if the link’s color matches the designated “:visited” link color we set via CSS, we’ve found a site the user’s been to. Of course we can do anything we want with that information, including saving it via AJAX. Why? Well, if we know a user has been to Digg.com, maybe we show the Digg “share” icon instead of the Reddit icon.

The MooTools JavaScript

var domains = ['davidwalsh.name','css-tricks.com','scriptandstyle.com','cnn.com','digg.com'];
var visited = [];
domains.each(function(url) {
	var anchor = new Element('a', {
		href: 'http://' + url,
		'class': 'checkme',
		html: url
	}).inject(document.body);
	if(anchor.getStyle('color') == '#ff0000') {
		visited.push(url);
	}
	anchor.dispose();
});

The above code accomplishes the same task using MooTools as outlined in my previous Spyjax post.

What are your thoughts on Spyjax? Harmless? Major privacy violation? You tell me!

Follow Me! Twitter | Facebook | LinkedIn | MooTools Forge.

Full David Walsh Blog Post: AJAX For Evil: Spyjax with jQuery

Related posts:

1. AJAX For Evil: Spyjax
2. Spyjax: Ajax For Evil Using Dojo
3. Animated AJAX Record Deletion Using jQuery
4. Form Element AJAX Spinner Attachment Using jQuery
5. Send Email Notifications for Broken Images Using jQuery AJAX

The Robots.txt

User-agent: *
Disallow: /

The above directive prevents the search engines from indexing any pages or files on the website. Say, however, that you simply want to keep search engines out of the folder that contains your administrative control panel. You’d code:

User-agent: *
Disallow: /administration/

Or if you wanted to allow in all spiders except Google’s GoogleBot, you’d code:

User-Agent: googelbot
Disallow: /

What would you prevent the search engines from seeing?

Follow Me! Twitter | Facebook | LinkedIn | MooTools Forge.

Full David Walsh Blog Post: Disallow Robots Using Robots.txt

Related posts:

1. Allow Google Into Password Protected Areas
2. Set the User Agent With PHP cURL
3. Advanced .htaccess Security – Block Access to Include Files Using .htaccess
4. Advanced .htaccess Security – Allow or Block Specific IPs From Your Website
5. Knowing Website State Using PHP

$ch = curl_init();
curl_setopt($ch,CURLOPT_URL,'https://thirdparty.com/token.php'); //not the actual site
curl_setopt($ch,CURLOPT_TIMEOUT,60);
curl_setopt($ch,CURLOPT_RETURNTRANSFER,1);
curl_setopt($ch,CURLOPT_POST,1);
curl_setopt($ch,CURLOPT_POSTFIELDS,'customer_id='.$cid.'&password='.$pass);
curl_setopt($ch,CURLOPT_SSL_VERIFYPEER,true); 
curl_setopt($ch,CURLOPT_CAINFO,'ca-bundle.crt'); /* problem here! */
$result = curl_exec($ch);
if(empty($result)) { /* error: nothing returned */ } else { /* success! */ }
curl_close($ch);

Unfortunately I was persistently receiving the following error message:

error:14090086:SSL routines:SSL3_GET_SERVER_CERTIFICATE:certificate verify failed

It turns out that the SSL bundle file I was using was old, as was the default bundle that came with the old version of cURL the shared hosting server. Essentially the third party didn’t trust that the system’s SSL certificate was valid. I downloaded Mozilla’s bundle file, named it mozilla.pem and changed my PHP code to:

$ch = curl_init();
curl_setopt($ch,CURLOPT_URL,'https://thirdparty.com/token.php'); //not the actual site
curl_setopt($ch,CURLOPT_TIMEOUT,60);
curl_setopt($ch,CURLOPT_RETURNTRANSFER,1);
curl_setopt($ch,CURLOPT_POST,1);
curl_setopt($ch,CURLOPT_POSTFIELDS,'customer_id='.$cid.'&password='.$pass);
curl_setopt($ch,CURLOPT_SSL_VERIFYPEER,true); 
curl_setopt($ch,CURLOPT_CAINFO,'mozilla.pem'); /* fixed! */
$result = curl_exec($ch);
if(empty($result)) { /* error: nothing returned */ } else { /* success! */ }
curl_close($ch);

I share this with you because it cost me over three hours. Hopefully this will save someone time and frustration in the future.

Follow Me! Twitter | Facebook | LinkedIn | MooTools Forge.

Full David Walsh Blog Post: PHP, SSL, and cURL SSL3_GET_SERVER_CERTIFICATE Errors

Related posts:

1. GoDaddy, cURL, HTTP, and 403 Errors
2. GoDaddy Hosting Tip – Using CURL On GoDaddy Shared Hosting
3. Download a URL’s Content Using PHP cURL
4. Get Your FeedBurner Reader Statistic Using PHP cURL and the FeedBurner API
5. Execute a HTTP POST Using PHP CURL

If you develop eCommerce websites or create applications that request sensitive user information, you’re probably well aware of the advantages of using SSL certificates. For those that haven’t, SSL certificates:

• Encrypt data between the user’s browser and the web server.
• Provide peace of mind to users giving their information.
• Are required by credit card companies for vendors accepting credit card payment (even for vendors that have a website WITHOUT eCommerce.

Purchasing a SSL certificate can be quite an investment. Many vendors charge up to $400 per certificate. That’s right: $400! Peace of mind and security are important but that doesn’t mean that SSL certificates should put a dent in your budget. Enter a great SSL certificate vendor called SSLmatic.

SSLmatic provides cheap SSL certificates for as low as $20/year. You’d think that for that cost you’d get a no-name, generic certificate but that’s not the case. SSLmatic provides SSL certificates for some of the web’s largest SSL vendors:

SSLmatic also simplifies the SSL certificate request process. Here’s how it works:

Already have a security certificate? No problem! SSLmatic also offers renewal certificates. As always SSLmatic allows you to lock in your SSL certificate for just one year or up to five years. For more information on specific policies, check out the SSLmatic website.

SSLmatic asked me to try their service and it was by far the easiest non-hosting-provider-forces-you-to-use-them-so-they-hold-you-hostage SSL certificate process I’ve ever completed. I answered a couple quick questions, provided SSLmatic a CSR, and in no-time I had my SSL certificate waiting for me in my inbox. From there I was able to navigate to my Plesk administrative panel, plug in my SSL certificate, and I was done. No hassle — just plug and play. Sweet!

SSLmatic SSL Certificate Giveaway! Yep — Free RapidSSL Certificates!

SSLmatic would like five David Walsh Blog readers to give their service a shot. Want to be one of the chosen five? Easy and fun. In a comment below, post your favorite actor/actress’ name with “FTW” after it. For example:

Christina Ricci FTW!

Winners will be chosen at random and posted Friday. Thank you to SSLmatic for this opportunity and good luck to everyone that comments!

Follow Me! Twitter | Facebook | LinkedIn | MooTools Forge.

Full David Walsh Blog Post: SSLmatic: Quality, Cheap SSL Certificates and Giveaway!

Related posts:

1. SSLmatic SSL Certificate Giveaway Winners
2. Create a Basic Web Service Using PHP, MySQL, XML, and JSON
3. Force A Secure Page Using PHP
4. Google Wave Invites Giveaway
5. PHP, SSL, and cURL SSL3_GET_SERVER_CERTIFICATE Errors

Important Note: This article has been updated here.

We all know how spammers write scripts to slurp pages and collect as many emails as they possibly can, right? Well, I’ve created a really easy way to avoid this problem using MooTools JavaScript. Let me show you the process.

The XHTML

	<a href="/david|davidwalsh.name" class="email" title="Email me.">David Walsh</a>

We create a link with the CSS class “email”. The email address is inside the href attribute, but the “@” is replaced with “|”. Worthless to a spammer’s slurp script. The href’s beginning “/” is an IE workaround.

The MooTools JavaScript

$$('.email').each(function(el) { 
	el.set('href','mailto:' + el.get('href').replace('|','@').replace('/','')); 
});

Once the DOM is ready (as always), we grab each link with the email class. We take each link’s href (the modified email address) and reformat the address so that it acts as a normal email link.

Have a better solution? Share it!

Follow Me! Twitter | Facebook | LinkedIn | MooTools Forge.

Full David Walsh Blog Post: Email Protection with MooTools JavaScript

Related posts:

1. Email Protection with MooTools JavaScript v2
2. Creating Advanced XHTML Email Links: Include Subject, CC, BCC, and Email Body
3. PHP Email Encoder – Prevent Spam Bots From Collecting Email Addresses
4. PHP Email Validator – Email MX DNS Record Check
5. You Know How I Know You Read My Email?

A customer recently asked that I create a whitelisting function that allowed letters, digits, whitespace characters, periods, commas, and dashes. Any other characters were to be replaced with spaces.

The PHP

function make_valid($input) 
{ 
	return preg_replace('/[^A-Za-z0-9.,\(\)\s-]/',' ',$input); 
}

The above function uses preg_match() and a small regular expression to remove the rubbish characters.

Follow Me! Twitter | Facebook | LinkedIn | MooTools Forge.

Full David Walsh Blog Post: Whitelisting: You Set The Rules For Security

Related posts:

1. Simple Username Creation Validation with PHP
2. Advanced .htaccess Security – Block Access to Include Files Using .htaccess
3. Generate Search Engine Friendly URLs with PHP Functions
4. Advanced .htaccess Security – Allow or Block Specific IPs From Your Website
5. JavaScript Exercise: Find the Number of Unique Letters in a String

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 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.

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!

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.

What are your thoughts on this practice?

Follow Me! Twitter | Facebook | LinkedIn | MooTools Forge.

Full David Walsh Blog Post: AJAX For Evil: Spyjax

No related posts.

Typecast Value when Expecting Numbers

When you’re expecting an integer in the querystring, typecast the value before using it. This prevents string values from causing you problems.

$id = (int) $_GET['i'];

Sanitize Input

Build a basic function for each type of variable you are passing that you can use throughout your website. That ensures consistency and security.

Make Sure REGISTER_GLOBALS is Off

Stating the obvious of course, but having REGISTER_GLOBALS on is a major problem. Make sure it’s turned off.

Don’t Make Variable Names Meaningful

Lets just say that having a $_GET variable with the name of ‘user_id’ isn’t a good thing. Change it to ‘u’ or something different.

<!-- no! -->
<a href="/profile.php?user_id=<?php echo $user_id; ?>">Your Profile</a>
<!-- yes! -->
<a href="/profile.php?q=<?php echo $user_id; ?>">Your Profile</a>

Encrypt Querystring Values

If you need to pass sensitive information from page to page, use at least a basic encryption algorythym or an md5.

<a href="/profile.php?i=<?php echo dw_encrypt($user_id); ?>">Click here</a>

Follow Me! Twitter | Facebook | LinkedIn | MooTools Forge.

Full David Walsh Blog Post: Tips for Protecting Querystring Keys & Values in PHP

Related posts:

1. PHP: Validating Numeric Values and Digits
2. Return Multiple Values From AJAX Using MooTools and PHP
3. CSS Variables Using PHP
4. Create a Basic Web Service Using PHP, MySQL, XML, and JSON
5. MooTools onLoad SmoothScrolling

RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_URI} !^/maintenance\.html$
RewriteRule ^(.*)$ http://domain.com/maintenance.html [R=307,L]

Once we posted the maintenance.html page and .htaccess code on both the old hosting environment AND new hosting environment, we switched the DNS settings. Before making the switch, we had ported the website’s code to a “utility” domain and made adjustments so that the website would function well in the new hosting environment. Now that the DNS had been changed, we wanted to make sure that the website would function well on the new domain within the new hosting environment. Unfortunately the code above blocks EVERYONE from accessing any file besides the maintenance.html file. Fortunately my gifted IT team had the answer:

RewriteEngine On
RewriteBase /
RewriteCond %{REMOTE_ADDR} !^11\.111\.111\.111
RewriteCond %{REQUEST_URI} !^/maintenance\.html$
RewriteRule ^(.*)$ http://domain.com/maintenance.html [R=307,L]

The above code sends all users to maintenance.html EXCEPT those with the specified IP, which just so happened to be us. We got to test the website while others were locked out. When we were satisfied with the website, we removed the .htaccess code and the site was back up immediately!

Follow Me! Twitter | Facebook | LinkedIn | MooTools Forge.

Full David Walsh Blog Post: .htaccess “Down For Maintenance” Page Redirect

Related posts:

1. No WWW Using .htaccess
2. Force Secure (SSL) Pages With .htaccess
3. Fixing mod_rewrite and .htaccess on GoDaddy Hosting
4. Prevent Image Hotlinking With .htaccess and mod_rewrite
5. Advanced .htaccess Security – Block Unwanted Referrers

The .htaccess Code

RewriteEngine On
RewriteCond %{SERVER_PORT} 80
RewriteRule ^(.*)$ https://domain.com/$1 [R,L]

Obviously, you’ll want to change “domain.com” to your domain. Another short snippet of code that has a big impact on your website!

Follow Me! Twitter | Facebook | LinkedIn | MooTools Forge.

Full David Walsh Blog Post: Force Secure (SSL) Pages With .htaccess

Related posts:

1. Force A Secure Page Using PHP
2. Secure (SSL) Google Analytics
3. .htaccess “Down For Maintenance” Page Redirect
4. Advanced .htaccess Security – Block Access to Include Files Using .htaccess
5. No WWW Using .htaccess