<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	>

<channel>
	<title>Devlog</title>
	<atom:link href="http://devlog.info/feed/" rel="self" type="application/rss+xml" />
	<link>http://devlog.info</link>
	<description>One developers blog.</description>
	<pubDate>Thu, 22 May 2008 22:25:56 +0000</pubDate>
	<generator>http://wordpress.org/?v=2.5.1</generator>
	<language>en</language>
			<item>
		<title>Encoding Numbers as Base 36</title>
		<link>http://devlog.info/2008/05/22/encoding-numbers-as-base-36/</link>
		<comments>http://devlog.info/2008/05/22/encoding-numbers-as-base-36/#comments</comments>
		<pubDate>Thu, 22 May 2008 22:19:59 +0000</pubDate>
		<dc:creator>Christopher</dc:creator>
		
		<category><![CDATA[General]]></category>

		<category><![CDATA[PHP]]></category>

		<category><![CDATA[base 10]]></category>

		<category><![CDATA[base 36]]></category>

		<category><![CDATA[decimal]]></category>

		<guid isPermaLink="false">http://devlog.info/?p=34</guid>
		<description><![CDATA[A few days ago I went and registered the domain dashto.cc and created a really quick-n-dirty URL shortening site.
A URL shortening service takes any URL and "shortens" it. The website TinyURL is the most famous. It's being used everywhere around the web, from blog posts to tweets. Since the creation of TinyURL there have been [...]]]></description>
			<content:encoded><![CDATA[<p>A few days ago I went and registered the domain <a href="http://dashto.cc/">dashto.cc</a> and created a really quick-n-dirty URL shortening site.<span id="more-34"></span></p>
<p>A URL shortening service takes any URL and "shortens" it. The website <a href="http://tinyurl.com/">TinyURL</a> is the most famous. It's being used everywhere around the web, from blog posts to <a href="http://twitter.com/">tweets</a>. Since the creation of TinyURL there have been numerous copy-cat sites.</p>
<p>What I really wanted to talk about briefly was how these services work. It's probably not too to difficult to figure out. Basically you have a database table with an ID field and a URL field. When someone requests a URL with an ID, you map it to the URL and perform the redirect.</p>
<p>But notice how these sites are using the <em>base 36</em> number system rather then base 10 (our decimal system). This makes it possible to create very short URLs even when the ID's in the database are huge. Base 36 is most convenient because it can be encoded using plain ASCII characters 0-9 and (case insensitive) letters A-Z. Using base 36 we can represent an ID of 1000000 (1 million) as "LFLS" which is both shorter, and easier to write out then a long series of numbers.</p>
<p>Since it is easy to convert between base 36 and base 10 (using PHP's built-in <a href="http://php.net/base_convert">base_convert</a> function), we can still take advantage of the efficient indexes database systems have to offer on integers.</p>
<div class="igBar">
<div class="wrap"><span id="lphp-2" style="float:right"><a href="#" onclick="javascript:showCodeTxt('php-2'); return false;">Plain Text</a></span><span class="langName">PHP:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="php-2">
<div class="php">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#0000FF;">$base10</span> = <span style="color:#CC66CC;color:#800000;">1000000</span>;</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><a href="http://www.php.net/echo"><span style="color:#000066;">echo</span></a> <span style="color:#FF0000;">"$base10 in base 36: "</span> . <a href="http://www.php.net/base_convert"><span style="color:#000066;">base_convert</span></a><span style="color:#006600; font-weight:bold;">&#40;</span><span style="color:#0000FF;">$base10</span>, <span style="color:#CC66CC;color:#800000;">10</span>, <span style="color:#CC66CC;color:#800000;">36</span><span style="color:#006600; font-weight:bold;">&#41;</span>; <span style="color:#FF9933; font-style:italic;">// lfls</span></div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp;</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#0000FF;">$base36</span> = <span style="color:#FF0000;">'ceft'</span>;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><a href="http://www.php.net/echo"><span style="color:#000066;">echo</span></a> <span style="color:#FF0000;">"$base36 in base 10: "</span> . <a href="http://www.php.net/base_convert"><span style="color:#000066;">base_convert</span></a><span style="color:#006600; font-weight:bold;">&#40;</span><span style="color:#0000FF;">$base36</span>, <span style="color:#CC66CC;color:#800000;">36</span>, <span style="color:#CC66CC;color:#800000;">10</span><span style="color:#006600; font-weight:bold;">&#41;</span>; <span style="color:#FF9933; font-style:italic;">// 578585 </span></div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p></p>
<p>(Even more efficient might be to use base 64 which makes a distinction between upper and lower-case letters, but that is less user-friendly/portable.)</p>
<p>Have you ever thought of using base 36 to encode your ID's? Do you think it is really any more user-friendly than decimal numbers? One might argue it's <em>less</em> user friendly because you introduce ambiguous characters like 1/i and 0/O. But certainly for some cases it is something to consider.</p>
<p>Just some food for thought!</p>
]]></content:encoded>
			<wfw:commentRss>http://devlog.info/2008/05/22/encoding-numbers-as-base-36/feed/</wfw:commentRss>
		</item>
		<item>
		<title>php&#124;architect&#8217;s Guide to Programming with Zend Framework</title>
		<link>http://devlog.info/2008/04/22/phparchitects-guide-to-programming-with-zend-framework/</link>
		<comments>http://devlog.info/2008/04/22/phparchitects-guide-to-programming-with-zend-framework/#comments</comments>
		<pubDate>Wed, 23 Apr 2008 03:29:50 +0000</pubDate>
		<dc:creator>Christopher</dc:creator>
		
		<category><![CDATA[Books]]></category>

		<category><![CDATA[PHP]]></category>

		<category><![CDATA[book]]></category>

		<category><![CDATA[framework]]></category>

		<category><![CDATA[guide]]></category>

		<category><![CDATA[php|a]]></category>

		<category><![CDATA[php|architect]]></category>

		<category><![CDATA[zend]]></category>

		<category><![CDATA[zf]]></category>

		<guid isPermaLink="false">http://devlog.info/?p=32</guid>
		<description><![CDATA[One of the first books to be published on the topic of Zend Framework was php&#124;architect's Guide to Programming with Zend Framework (Amazon). If you're looking for an "in" into ZF then -- eh, well, skip this book.
I purchased this book before it was published. I love php&#124;a. I subscribe to their magazine, and I've [...]]]></description>
			<content:encoded><![CDATA[<p>One of the first books to be published on the topic of Zend Framework was <a href="http://phparch.com/c/books/id/9780973862157">php|architect's Guide to Programming with Zend Framework</a> (<a href="http://www.amazon.com/architects-Guide-Programming-Zend-Framework/dp/0973862157/">Amazon</a>). If you're looking for an "in" into ZF then -- eh, well, skip this book.<span id="more-32"></span></p>
<p>I purchased this book before it was published. I love php|a. I subscribe to their magazine, and I've purchased a few of their other books. But this publication is just way below par.</p>
<p>First point: I didn't much care for the writing style. I've heard it described as "light" or "humorous", but to me it just seemed amateur. It was as if a bunch of articles were taken off a blog and bound together into a book. Just imagine if <em>my</em> blog posts were published (well, my writing sucks, so perhaps not that bad). Add in the numerous obvious spelling/grammatical errors, I couldn't help but think <em>who the hell was the editor?</em></p>
<p>Let's put that aside, though. I don't really care about how the book is written or if it had some typos. I buy a book to learn about a topic. So it all comes down to <em>did the book deliver?</em> and the answer, in my opinion, is a big <em>no</em>.</p>
<p>The author only covers the bare basics of each topic. After reading each chapter I was filled with questions like "but how does x work" or "how would I change x". Not until I Google'd for further reading did I totally understand how each part of the MVC components actually worked. For example, in the MVC chapters there's no mention at all about routing or dispatching, and no mention of plugin hooks. </p>
<p>I'm one of those people who needs to understand the big picture before I can feel comfortable using something. After reading this book, my mind was full of fragmented bits of information that I was having trouble piecing together. The book explained some things fairly well, but others were just glanced over or you were expected to just "accept" that the code did what it was supposed to.</p>
<p>My final thoughts: The book feels very rushed. It is only about 200 pages, not nearly enough to cover ZF. It lacks depth and doesn't fully explain certain things. The <a href="http://framework.zend.com/manual/en/">online documentation</a> over at the Zend Framework website is easily 10x better. The title of this book should be <em>Primer to ZF</em> or <em>Overview of ZF</em>.</p>
<p><strong>My Rating:</strong> <span style="color:#AA0000;">4/10</span></p>
]]></content:encoded>
			<wfw:commentRss>http://devlog.info/2008/04/22/phparchitects-guide-to-programming-with-zend-framework/feed/</wfw:commentRss>
		</item>
		<item>
		<title>PHP Certification</title>
		<link>http://devlog.info/2008/04/21/php-certification/</link>
		<comments>http://devlog.info/2008/04/21/php-certification/#comments</comments>
		<pubDate>Tue, 22 Apr 2008 01:14:30 +0000</pubDate>
		<dc:creator>Christopher</dc:creator>
		
		<category><![CDATA[Check It Out]]></category>

		<category><![CDATA[PHP]]></category>

		<category><![CDATA[certification]]></category>

		<category><![CDATA[exam]]></category>

		<category><![CDATA[zend]]></category>

		<guid isPermaLink="false">http://devlog.info/?p=31</guid>
		<description><![CDATA[I get asked about this a lot. Why did I take the PHP Certification exam? What does it do for me? Was it hard?
The Zend PHP Certification is basically a badge that says "I know my stuff". Zend's site actually has a pretty good summary of the benefits of becoming certified.
I became certified for a [...]]]></description>
			<content:encoded><![CDATA[<p>I get asked about this a lot. Why did I take the PHP Certification exam? What does it do for me? Was it hard?<span id="more-31"></span></p>
<p>The <a href="http://www.zend.com/en/services/certification/">Zend PHP Certification</a> is basically a badge that says "I know my stuff". Zend's site actually has a pretty good summary of the benefits of becoming certified.</p>
<p>I became certified for a couple of reasons (other than me being an egotistical bastard). I wanted to test myself and make sure I was actually up to date with everything. I came into the world of PHP around version 4.1. Since then a lot has changed, especially with the advent of PHP5. Taking the practice exams I discovered that there were a few areas I definitely needed to improve upon. For example, primarily working on products that needed to run under a PHP4, I never had much experience with the new XML features.</p>
<p>The other reason was that the exam was really cheap for the possible benefit. Noted, the Zend PHP Certification is hardly mentioned at all by employers. It is relatively new as far as certifications go. But by sticking that badge on your resume, you automatically have a one-up over your adversaries. PHP programmers are a dime a dozen these days, and most of them only know enough to slap together something that barely works. If a possible client knows you've passed the official PHP Certification exam, it gives you some credibility. $125 is a small price to pay. You can make that back in just a single job.</p>
<h3>Preparation</h3>
<p>I know you're thinking it. Everyone whose asked me about the exam always asks "was it hard?". <em>For me</em>, it was simple. I found it really easy. But I've been working with PHP for a long long time, so obviously your milage may vary (it's all relative, after all).</p>
<p>What you really need to do is a little research. I ended up buying the <a href="http://www.zend.com/en/store/php-certification/study-guide">bundle</a> which included the study guide, 10 practice exams, and the actual exam voucher. It's a pretty good deal, I encourage anyone interested in taking the exam to do the same.</p>
<p>The study guide was not bad. It's basically a quick walkthrough over the entire language. But the practice exams were really useful. The practice exams tell you if you're really ready to take the real thing. I can tell you, they are very very close to the real exam; they are actually a bit harder. If you pass the practice exams, you will surely pass the real exam.</p>
<p>After you finish a practice exam, you get a scorecard telling you which areas you passed, which you failed, and which you did excellent in. For me, this scorecard revealed I needed to brush up with SimpleXML.</p>
<p>I should mention that the exam is a pass or fail thing. There are no grades. My PHP Certification can not be better than yours. So just because you get "pass" instead of "excellent" doesn't really matter unless your ego requires it (like mine!).</p>
<h3>What you should know</h3>
<p>The Zend website has an <a href="http://www.zend.com/en/services/certification/php5-certification">overview</a> of the topics covered by the exam. Of course you need to know every inch of PHP, but I will point-out/stress:</p>
<ul>
<li>Regular expressions: You should know some basic regex.</li>
<li>SQL: You will need to know some basic SQL, and how it works (i.e., fetching rows with PDO). Some topics you might need to brush up on include indexes, table joins and transactions. You don't need to be a DBA to pass the exam, but you should know how to work with a database.</li>
<li>How numbers are represented in hex or octal notation. I mention this here because a lot of us don't need to worry about hex or octal notation in PHP.</li>
<li>How the bitwise operators work.</li>
<li>Differences between PHP4 and PHP5. There are a bunch of little nuances here that you may be asked about.</li>
<li>Security: You should know things like how to avoid XSS, session fixation, filtering input, validation etc.</li>
<li>XML: There may be a number of questions about XML, XPath, SimpleXML etc. If you've been working with PHP4 a lot, then it's time to get in tune with the improvements PHP5 introduced.</li>
<li>PDO: If you've been working with a database abstraction layer (which is probably just about everyone reading this), then you probably will need to read up on how PDO works.</li>
<li>There may be a few questions regarding software architecture such as design patterns (MVC for example), OOP principals etc.</li>
<li>Streams and network programming is something you will probably need to look into a bit.</li>
</ul>
<h3>Who should take the exam</h3>
<p>You should only take the exam if you actually know PHP well. It does an excellent job at weeding out the half-assed PHP programmers, so don't even attempt it unless you know your stuff already. If you are just starting out, or are of average skill, your money would be best spent buying some other material like <a href="http://www.amazon.com/Advanced-PHP-Programming-Developers-Library/dp/0672325616">Advanced PHP Programming</a>.</p>
<p>You should take the exam if you are a freelancer, or looking for work. I think it definitely does give you a heads up over your competition. Even if you have other credentials. Case in point: recently I was looking for a new programmer to help develop a product I work on. One applicant was a CS major, but was an absolutely horrible programmer. You might have passed a few college classes, but that doesn't mean much to me. I need to know that you can deliver.</p>
<p>You should take the exam if you want to test yourself, like I did. It is certainly a good way to discover your weaknesses and your strengths. You might find multiple areas where you had no experience.</p>
<p>So with all that said, good luck!</p>
]]></content:encoded>
			<wfw:commentRss>http://devlog.info/2008/04/21/php-certification/feed/</wfw:commentRss>
		</item>
		<item>
		<title>Sounds, IE7 and Security Warnings</title>
		<link>http://devlog.info/2008/04/11/sounds-ie7-security-warnings/</link>
		<comments>http://devlog.info/2008/04/11/sounds-ie7-security-warnings/#comments</comments>
		<pubDate>Fri, 11 Apr 2008 23:33:40 +0000</pubDate>
		<dc:creator>Christopher</dc:creator>
		
		<category><![CDATA[Check It Out]]></category>

		<category><![CDATA[Javascript]]></category>

		<category><![CDATA[embed]]></category>

		<category><![CDATA[flash]]></category>

		<category><![CDATA[ie]]></category>

		<category><![CDATA[ie7]]></category>

		<category><![CDATA[js]]></category>

		<category><![CDATA[Security]]></category>

		<category><![CDATA[sound]]></category>

		<category><![CDATA[sound manager]]></category>

		<guid isPermaLink="false">http://devlog.info/?p=30</guid>
		<description><![CDATA[Some of you may know that the last few weeks I've been writing an AJAX chat application that plugs in to DeskPRO. One of the problems we ran into is playing sound notifications. The problem is that IE7 likes to pop up a security warning when you use the usual &#60;embed&#62; code. This was unacceptable. [...]]]></description>
			<content:encoded><![CDATA[<p>Some of you may know that the last few weeks I've been writing an AJAX chat application that plugs in to DeskPRO. One of the problems we ran into is playing sound notifications. The problem is that IE7 likes to pop up a security warning when you use the usual &lt;embed&gt; code. This was unacceptable. So today I just want to briefly talk about how I solved the problem.<span id="more-30"></span></p>
<p>The solution that I came up with was to use Flash. Seeing as how over <a href="http://www.adobe.com/products/player_census/flashplayer/">98% of all users</a> have Flash installed, it was the perfect solution.</p>
<p>I ended up finding an open source project called <a href="http://www.schillmania.com/projects/soundmanager2/">Sound Manager</a>. You just embed the Flash movie on your page somewhere, and talk to it with plain old Javascript. You don't need Flash installed, you don't need to create your own movie -- all you do is use the API provided by Sound Manager.</p>
<p>For the curious ones amongst you, the API is really simple (taken directly from the linked page above):</p>
<div class="igBar">
<div class="wrap"><span id="ljavascript-4" style="float:right"><a href="#" onclick="javascript:showCodeTxt('javascript-4'); return false;">Plain Text</a></span><span class="langName">JAVASCRIPT:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="javascript-4">
<div class="javascript">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">soundManager.<span style="color: #006600;">createSound</span><span style="color: #66cc66;">&#40;</span><span style="color: #3366CC;">'myNewSound'</span>,<span style="color: #3366CC;">'/path/to/some.mp3'</span><span style="color: #66cc66;">&#41;</span>;</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">soundManager.<span style="color: #006600;">play</span><span style="color: #66cc66;">&#40;</span><span style="color: #3366CC;">'myNewSound'</span><span style="color: #66cc66;">&#41;</span>;</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">soundManager.<span style="color: #006600;">setVolume</span><span style="color: #66cc66;">&#40;</span><span style="color: #3366CC;">'myNewSound'</span>,<span style="color: #CC0000;color:#800000;">50</span><span style="color: #66cc66;">&#41;</span>;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">soundManager.<span style="color: #006600;">setPan</span><span style="color: #66cc66;">&#40;</span><span style="color: #3366CC;">'myNewSound'</span>,-<span style="color: #CC0000;color:#800000;">100</span><span style="color: #66cc66;">&#41;</span>; </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p></p>
<p>The <em>only</em> problem I had with using Sound Manager is that it requires MP3's, and all of our sounds were WAV's. No biggie. Converting the files to MP3's was simple, and the resulting filesize a bit smaller anyway.</p>
<h3>Even more accessible?</h3>
<p>98% of internet users have Flash. That's a pretty good percentage. But I still wanted to make sure those rare 2% of users didn't get some "install this plugin" popup.</p>
<p>Basically what I ended up doing was using a Flash sniffer (some JS to determine if Flash is installed, and which version) to see if the user can use the Sound Manager. If they could use it, then great -- we're all set to go. If they couldn't, then the app reverts back to using good ol'd &lt;embed&gt;'s (except for IE7; no sound is better then an annoying security popup!).</p>
]]></content:encoded>
			<wfw:commentRss>http://devlog.info/2008/04/11/sounds-ie7-security-warnings/feed/</wfw:commentRss>
		</item>
		<item>
		<title>MVC With The Zend Framework</title>
		<link>http://devlog.info/2008/04/08/mvc-with-the-zend-framework/</link>
		<comments>http://devlog.info/2008/04/08/mvc-with-the-zend-framework/#comments</comments>
		<pubDate>Wed, 09 Apr 2008 01:24:52 +0000</pubDate>
		<dc:creator>Christopher</dc:creator>
		
		<category><![CDATA[Application Design]]></category>

		<category><![CDATA[Design Patterns]]></category>

		<category><![CDATA[How To]]></category>

		<category><![CDATA[PHP]]></category>

		<category><![CDATA[mvc]]></category>

		<category><![CDATA[zend]]></category>

		<category><![CDATA[zend framework]]></category>

		<category><![CDATA[zf]]></category>

		<guid isPermaLink="false">http://devlog.info/?p=28</guid>
		<description><![CDATA[I've been using the Zend Framework a lot lately and have come to really appreciate it. Today I want to write about ZF and how to use the MVC components. This post will be all about ZF itself, how the MVC components work, and getting a simple example up and going. I will write another [...]]]></description>
			<content:encoded><![CDATA[<p>I've been using the Zend Framework a lot lately and have come to really appreciate it. Today I want to write about ZF and how to use the MVC components. This post will be all about ZF itself, how the MVC components work, and getting a simple example up and going. I will write another post later on some more advanced usage.<span id="more-28"></span></p>
<h2>About Zend Framework</h2>
<p>The <a href="http://framework.zend.com/">Zend Framework</a> is a free (<a href="http://framework.zend.com/license">BSD-like</a> license) PHP framework. It contains components to tackle many common problems including authentication, cacheing, mail, sessions, and of course MVC.</p>
<p>ZF is simple. It is a "use at will" framework, meaning you can take specific components and use them wherever you want. You can, for example, take just the Mail component and stick it into your already existing PHP application. This decoupled architecture is contrary to some other frameworks (including symfony or CakePHP to certain extents) where you are forced into using a single paradigm.</p>
<p>This framework is written for PHP5 only, so it is not encumbered by the limitations of PHP4. It is written using the best OOP principals, is thoroughly tested, and has a marvelous community of maintainers that keep it up to date.</p>
<h3>Zend Framework versus other frameworks (symfony, CakePHP etc)</h3>
<p>Typically when you think of a framework, you envision a completely developed codebase that includes its own of configuration, its own conventions, and specific programming paradigms. Many frameworks including <a href="http://www.symfony-project.com/">symfony</a>, <a href="http://cakephp.com/">CakePHP</a>, <a href="http://codeigniter.com/">Code Igniter</a> and Ruby's <a href="http://www.rubyonrails.org/">Rails</a>, follow this kind of thinking.</p>
<p>Zend Framework is a collection of loosely coupled components. As mentioned earlier, you can use any one of the components separately without running into any problems. Even so, the components still work very well together (for example, Zend_Auth can seamlessly use Zend_Session for persistence).</p>
<p>You need to do a bit more work to use ZF initially. ZF is not all tied together, so if you want to use MVC  (for example) then you have to create your own bootstrap, and create your own directory structure etc. When you download ZF it's simply a directory that contains the library files, you're the one who has to initialize and use everything. Compare this to symfony (or many others) where everything is ready to go after you edit a couple configuration lines.</p>
<p>I prefer ZF because I feel like I have more control. I am not tied into any one paradigm, I don't need to play around with configuration files and I can mix and match my code to my hearts content. </p>
<p>Please note that I am not belittling the other frameworks, I am just trying to explain what sets ZF apart. If you read some of my previous posts, you'll see I'm also an advocate of symfony.</p>
<h2>The Parts</h2>
<p><a href="http://devlog.info/2007/06/27/php-model-view-controller/">MVC</a> with Zend Framework is quite easy. Here's a brief overview of each part and how they relate to each other.</p>
<h3>1. Front Controller</h3>
<p>Most people will use a <a href="http://www.martinfowler.com/eaaCatalog/frontController.html">Front Controller</a>. Using a Front Controller means that all requests come through a central starting point (usually a single index.php file).</p>
<p>The Front Controller starts up your whole app. If there are certain things you need to initialize, here is where you'd do it (loading config for example).</p>
<p>If you've been developing on the web for a while, you've probably seen lots of scripts that have many entry points. For example, you might have index.php, login.php, article.php etc. Most of the time you also have a global.php file that is included at the top of each script. When you have all these entry points, it can quickly become hard to manage and you also start to get a bunch of code duplication.</p>
<p>A Front Controller solves this. Instead of physical files on the disk defining how a request should be handled, the request itself is entered through the Front Controller and then analyzed to see what should be done with it.</p>
<h3>2. The Request Object</h3>
<p>Each request made has a corresponding Request object. This object wraps up the entire request environment. For example, the default HTTP environment contains things like request parameters from GET and POST. The Request object also contains which controller and action should be called upon.</p>
<h3>3. The Router</h3>
<p>The Router is what actually inspects the incoming request and decides which Controller and Action should be called up. For example, it will look at a request of /login and decide that the Login Controller should handle the request, and the Index Action should be called.</p>
<p>ZF comes with a default router, so you don't need to change anything unless you want special behavior. By default, the incoming URL is analyzed and the parts are mapped to specific controllers and actions: /:controller/:action. If they are not provided at all, then they are assumed to be 'index'.</p>
<h3>3. The Dispatcher</h3>
<p>Dispatching is the process of looking at the requested controller and action, and actually including the correct Controller file, instantiating it, and calling on the action. The Dispatcher is in a loop. That means you can run as many controllers and actions as you like.</p>
<p>Again, ZF comes with a default dispatcher that sets down some naming conventions that we'll explore in a bit.</p>
<h3>4. The Controller</h3>
<p>Finally there is your actual controller. A controller handles a specific part of your app (for example, working with articles) and can have multiple actions (for example, listing articles, viewing a single article, viewing a printable version etc).</p>
<h2>The Process</h2>
<p>A request is handled like so:</p>
<ol>
<li>A web request is made to a single entry point (usually an index.php file)
<li>The entry point creates a Front Controller and runs it</li>
<li>The Front Controller creates a Request object that wraps up the environment. At this point there is no controller or action set.</li>
<li>The Front Controller uses a Router to inspect the request to figure out which controller and action should be called upon. It sets these values in the Request object.</li>
<li>The Front Controller starts the Dispatcher loop which includes the correct Controller source file, instantiates it, and runs the correct Action.</li>
<li>A Controller does what it does. It can handle forms, get database info, render HTML etc.</li>
<li>Any Controller can also modify the Request object and set a different Controller or Action, so the Dispatch loop is run again. If no change is made, then the Dispatch loop ends and the result is served to the user</li>
</ol>
<p>You can get a visual representation of the process by viewing <a href="http://framework.zend.com/manual/en/figures/zend.controller.basics.png">this image</a>.</p>
<h2>Let's Get Started</h2>
<h3>The File Structure</h3>
<p>I like to separate my files into two parts. One part for the actual application files (controllers, libs, views, functions etc) and then public files that the user needs access to (javascript, css, images etc).</p>
<p>For the sake of simplicity, I also like to package ZF with my app. If you have a shared directory where you place libraries (PEAR, for example), then you of course don't need to include it with your own files.</p>
<p>Here's the structure I use:</p>
<ul>
<li>root
<ul>
<li>/client
<ul>
<li>/css</li>
<li>/images</li>
<li>/js</li>
</ul>
</li>
<li>/appfiles
<ul>
<li>/application
<ul>
<li>/controllers</li>
<li>/views
<ul>
<li>/scripts</li>
</ul>
</li>
</ul>
</li>
<li>/lib
<ul>
<li>/Zend</li>
</ul>
</li>
</ul>
</li>
<li>/.htaccess</li>
<li>/index.php</li>
</ul>
</li>
</ul>
<p>This also makes it easy to split up the appfiles from the public files. For example, may people like to place the application source files outside of the document root on the webserver.</p>
<p>The /appfiles/application directory contains all of your controller and view files. We'll talk about the naming convention the default Dispatcher expects in a sec.</p>
<p>The /appfiles/lib directory is where I personally like to keep the Zend Framwork files.</p>
<p>You can of course have any other directories you'd like. On one of my recent projects I had /appfiles/functions and /appfiles/classes for some various custom code files.</p>
<h3>Rewrite URLs</h3>
<p>To create friendly URL's like /login or /article/view, you need a way to rewrite all URL's to go through the main index.php file. If you are using an Apache webserver and htaccess is a viable option, then the following simple code snippet should work fine for you:</p>
<div class="igBar">
<div class="wrap"><span id="lcode-9" style="float:right"><a href="#" onclick="javascript:showCodeTxt('code-9'); return false;">Plain Text</a></span><span class="langName">CODE:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="code-9">
<div class="code">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">RewriteEngine on</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">RewriteRule !\.<span style="color:#006600; font-weight:bold;">&#40;</span>js|ico|gif|jpg|png|css<span style="color:#006600; font-weight:bold;">&#41;</span>$ index.<span style="">php</span> </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p>
If you are on a different server, there are <a href="http://framework.zend.com/manual/en/zend.controller.router.html#zend.controller.router.introduction">other ways</a> to rewrite URLs.</p>
<p>Note that you can still use ZF's MVC components without rewriting URL's. Refer to the documentation for info on how to do this.</p>
<h3>Create Bootstrap</h3>
<p>The bootstrap file is the "single entry point" I've been talking about. It contains the code that launches the Front Controller. In this case, our bootstrap file is index.php.</p>
<p>Here's the code for a simple bootstrap file:</p>
<div class="igBar">
<div class="wrap"><span id="lphp-10" style="float:right"><a href="#" onclick="javascript:showCodeTxt('php-10'); return false;">Plain Text</a></span><span class="langName">PHP:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="php-10">
<div class="php">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#000000; font-weight:bold;">&lt;?php</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#008000; font-style:italic;">#------------------------------</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#008000; font-style:italic;"># Get the paths set</span></div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#008000; font-style:italic;">#------------------------------</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><a href="http://www.php.net/define"><span style="color:#000066;">define</span></a><span style="color:#006600; font-weight:bold;">&#40;</span><span style="color:#FF0000;">'ROOT'</span>, <a href="http://www.php.net/realpath"><span style="color:#000066;">realpath</span></a><span style="color:#006600; font-weight:bold;">&#40;</span><a href="http://www.php.net/dirname"><span style="color:#000066;">dirname</span></a><span style="color:#006600; font-weight:bold;">&#40;</span><span style="color:#000000; font-weight:bold;">__FILE__</span><span style="color:#006600; font-weight:bold;">&#41;</span> . <span style="color:#FF0000;">'/appfiles'</span><span style="color:#006600; font-weight:bold;">&#41;</span><span style="color:#006600; font-weight:bold;">&#41;</span>;</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><a href="http://www.php.net/set_include_path"><span style="color:#000066;">set_include_path</span></a><span style="color:#006600; font-weight:bold;">&#40;</span><span style="color:#FF0000;">'.'</span> . PATH_SEPARATOR . ROOT . PATH_SEPARATOR . ROOT.<span style="color:#FF0000;">'/lib'</span><span style="color:#006600; font-weight:bold;">&#41;</span>;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp;</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#008000; font-style:italic;">#------------------------------</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#008000; font-style:italic;"># Register the Zend autolaoder</span></div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#008000; font-style:italic;">#------------------------------</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#616100;">require_once</span><span style="color:#006600; font-weight:bold;">&#40;</span>ROOT . <span style="color:#FF0000;">'/lib/Zend/Loader.php'</span><span style="color:#006600; font-weight:bold;">&#41;</span>;</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">Zend_Loader::<span style="color:#006600;">registerAutoload</span><span style="color:#006600; font-weight:bold;">&#40;</span><span style="color:#006600; font-weight:bold;">&#41;</span>;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp;</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#008000; font-style:italic;">#------------------------------</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#008000; font-style:italic;"># Dispatch</span></div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#008000; font-style:italic;">#------------------------------</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">Zend_Controller_Front::<span style="color:#006600;">run</span><span style="color:#006600; font-weight:bold;">&#40;</span>ROOT . <span style="color:#FF0000;">'/application/controllers'</span><span style="color:#006600; font-weight:bold;">&#41;</span>; </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p></p>
<p>Line 7 defines the <em>ROOT</em> constant to be the full path to the appfiles/ directory. If you were to move the appfiles/ directory somewhere else, you'd want to edit this line so the path stays correct.</p>
<p>Line 8 sets the PHP include path so that the Zend files are all included without any problems. We need this line because we are distributing ZF with the project, we need to tell PHP where to look for the files when we include them.</p>
<p>Line 15 and 16 include Zend_Loader and register it's autoload functionality. PHP5 introduced the ability to <a href="http://php.net/autoload">autoload</a> classes. Whenever a class is used but has not been defined, PHP will try and find the file and include it for you. This saves you from having to manually write all of the require_once()'s you would normally write under PHP4.</p>
<p>Line 23 fires off the Front Controller which starts up your whole application. As a parameter you need to pass the path to your controller files which in our case is /appfiles/application/controllers.</p>
<p>If you run this now (http://yoursite.com/path/to/project/), you'll see an exception because ZF can't find your controller file to handle the request. So let's write it.</p>
<h2>Controllers and Actions</h2>
<h3>What are Controllers? Actions?</h3>
<p>Lets get this question out of the way for those who are new to this kind of website architecture. A Controller is a class that handles the business logic of a given part of your website. It fetches data from a datasource, interacts with output, and then passes any calculations to the View to be displayed to the user (usually as HTML). Some examples of Controllers might be: LoginController, ArticleController and SearchController. Before you might have had files like login.php, article.php and search.php -- now you have classes that control all of this behavior.</p>
<p>Each Controller has a set of Actions, which is just a method you define within the Controller class. An Action is something specific the Controller needs to do. Using our examples listed before, this might be <em>processing</em> a login, <em>displaying</em> an article or <em>performing</em> a search. Before you might have used a variable in the URL to determine what needed to be done. For example, "article.php?do=display" now becomes the ArticleController with the 'display' Action.</p>
<h3>Naming Conventions</h3>
<p>So you know that controllers are classes, and actions are methods in the controllers. Now the only thing left to cover is how ZF knows which file to load, and which method to call.</p>
<p>You defined the location of the controller files when you called Zend_Controller_Front::run() in the bootstrap. In our example, it is /appfiles/application/controllers.</p>
<p>The Dispatcher (explained above) is responsible for loading the appropriate files, instantiating the correct class, and then calling the correct method. The default Dispatcher that comes with ZF uses a naming convention so you can add controllers and actions easily (instead of say, creating a configuration file that defines it all).</p>
<p>There are two very simple rules:</p>
<ul>
<li>All controllers need to be called SomethingController where "Something" can be whatever you want. The class source code needs to be in a file called "SomethingController.php".</li>
<li>All actions need to be called someAction() where "some" is anything you want.</li>
</ul>
<p>The default Router and Dispatcher will route a URL /something/some to the SomethingController and the someAction() action. (Meaning: Remember that the default URLs are /:controller/:action).</p>
<p>If a controller is not specified, then the 'index' controller (IndexController class) will be assumed. If an action is not specified, then the 'index' action is assumed (indexAction() method).</p>
<p>Just to hammer it into your head, let's have a few examples of how some possible URLs might be loaded using the default Router and Dispatcher:</p>
<ul>
<li>/: IndexController class, indexAction() method</li>
<li>/login: LoginController class, indexAction() method</li>
<li>/login/lostpass: LoginController class, lostpassAction() method</li>
<li>/article/new: ArticleController class, newAction() method</li>
</ul>
<p>You can also use hyphens in your URL's if you use camelCase in the naming of controllers or actions:</p>
<ul>
<li>/download/message-attachment: DownloadController class, messageAttachmentAction() method</li>
<li>/sign-up/confirm-email: SignUpController class, confirmEmailAction() method</li>
</ul>
<h2>Views</h2>
<h3>What are Views?</h3>
<p>A View is the thing that you give back to the user after they request something. Usually this is an HTML page, but it can be other things like XML or RSS feeds,  file downloads etc.</p>
<h3>File Locations</h3>
<p>Controllers will try to render a view script automatically. It will search for view scripts in /views/scripts/ in the directory above the controller directory (for us that means /appfiles/applications/views/scripts/). Each controller is expected to have a directory of its own, and each action is expected to have a .phtml file that is the actual PHP script to render. For example, LoginController's indexAction() will have a view in views/scripts/login/index.phtml.</p>
<h3>View Files</h3>
<p>The default view scripts in ZF are plain old PHP. You can add a different templating system if you'd like (like Smarty), but for simplicity, this article will use the default.</p>
<p>In the controller you can set variables to be available to the view, so you can do all of the usual stuff you'd expect like looping, formatting etc.</p>
<h2>An Example Page</h2>
<p>Time for a really simple example page that demonstrates everything you've just read.</p>
<p>First step is creating a new controller. This controller will be located at: /appfiles/application/controllers/IndexController.php with the following code:</p>
<div class="igBar">
<div class="wrap"><span id="lphp-11" style="float:right"><a href="#" onclick="javascript:showCodeTxt('php-11'); return false;">Plain Text</a></span><span class="langName">PHP:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="php-11">
<div class="php">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#000000; font-weight:bold;">&lt;?php</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#000000; font-weight:bold;">class</span> IndexController extends Zend_Controller_Action <span style="color:#006600; font-weight:bold;">&#123;</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; public <span style="color:#000000; font-weight:bold;">function</span> indexAction<span style="color:#006600; font-weight:bold;">&#40;</span><span style="color:#006600; font-weight:bold;">&#41;</span> <span style="color:#006600; font-weight:bold;">&#123;</span></div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; &nbsp; &nbsp; </div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; &nbsp; &nbsp; <span style="color:#0000FF;">$this</span>-&gt;<span style="color:#006600;">view</span>-&gt;<span style="color:#006600;">name</span> = <span style="color:#FF0000;">"Christopher"</span>;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; &nbsp; &nbsp; </div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color:#006600; font-weight:bold;">&#125;</span></div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#006600; font-weight:bold;">&#125;</span> </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p></p>
<p>Next we need to create a view script to render the HTML page. The view script will be located at: /appfiles/application/views/scripts/index/index.phtml with the following code:</p>
<div class="igBar">
<div class="wrap"><span id="lhtml-12" style="float:right"><a href="#" onclick="javascript:showCodeTxt('html-12'); return false;">Plain Text</a></span><span class="langName">HTML:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="html-12">
<div class="html">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #009900;"><a href="http://december.com/html/4/element/h1.html"><span style="color: #000000; font-weight: bold;">&lt;h1&gt;</span></a></span>Hi, <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;</span></a>?php echo $this-<span style="color: #000000; font-weight: bold;">&gt;</span></a></span>name; ?&gt;<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/h1&gt;</span></span> </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p></p>
<p>Now if you run this in your browser, you'll get a simple page that displays a name. So what is going on here?</p>
<h3>The Controller</h3>
<p>The IndexController is a class the extends Zend_Controller_Action. All of your controllers must extend this base class (or a child of this base class -- you can create your own if you needed to). And on line 4 we have defined the indexAction() method to handle the default index action.</p>
<p>By defining both the index controller with an index action, we now have a default page do display whenever there was no URL supplied (remember that the dispatcher assumes 'index' if no controller or index was supplied).</p>
<p>On line 6 you'll notice we are assigning a name to a variable $this->view->name. This is how you pass values to your view script. You can assign any values. The view script is just PHP remember, so it doesn't matter if you assign arrays, objects, integers or strings.</p>
<h3>The View</h3>
<p>The view in our case is very simple. I just wanted to highlight how we use the variables assigned in the controller. All values assigned in the controller are available as $this->varname.</p>
<h2>Finished</h2>
<p>That's all there is to it. <a href='http://devlog.info/wp-content/uploads/2008/04/devlog-zf-mvc.zip'>Click here</a> to download the sample files used in this article (note that you need to add your own Zend library to the /appfiles/lib directory).</p>
<p>Next article I will go over some more advanced techniques including subclassing the front controller, action controllers, creating plugins and creating helpers.</p>
]]></content:encoded>
			<wfw:commentRss>http://devlog.info/2008/04/08/mvc-with-the-zend-framework/feed/</wfw:commentRss>
		</item>
		<item>
		<title>Basic Regular Expressions</title>
		<link>http://devlog.info/2007/12/27/regular-expressions/</link>
		<comments>http://devlog.info/2007/12/27/regular-expressions/#comments</comments>
		<pubDate>Thu, 27 Dec 2007 18:00:00 +0000</pubDate>
		<dc:creator>Christopher</dc:creator>
		
		<category><![CDATA[General]]></category>

		<category><![CDATA[PHP]]></category>

		<category><![CDATA[regex]]></category>

		<category><![CDATA[regular expressions]]></category>

		<guid isPermaLink="false">http://devlog.info/2007/12/27/regular-expressions/</guid>
		<description><![CDATA[Today I want to talk about regular expressions (usually referred to as regex or regexp). No matter what application you are creating, chances are you will need to parse text in some way. It might be for validating user input or for extracting information from a string of data in some arbitrary format. I have [...]]]></description>
			<content:encoded><![CDATA[<p>Today I want to talk about regular expressions (usually referred to as <em>regex</em> or <em>regexp</em>). No matter what application you are creating, chances are you will need to parse text in some way. It might be for validating user input or for extracting information from a string of data in some arbitrary format. I have yet to work on any project where regex was not required.<span id="more-25"></span></p>
<h2>About Regular Expressions</h2>
<p>Regex is a powerful language used to process text. It allows you to define a <em>pattern</em> that a regex engine uses to examine a string of data. The engine applies your pattern to the supplied string and matches the text that was specified in the pattern. What you do with regular expressions depends on the circumstance:</p>
<ul>
<li>Matching / Counting: Check if a string matches a pattern. For example, check if the user inputted a correctly formatted email address.</li>
<li>Replacement: Replacing parts of a string with another. For example, parsing BB-Code into HTML.</li>
<li>Extraction: Extracting parts of a string. For example, you might want to extract all of the href's in an HTML document.</li>
</ul>
<p>In this post I am only going over the regex language briefly. See the end for some links to further reading. This article is simply a precursor for another post I wanted to write on using regex with PHP.</p>
<h2>The Basics</h2>
<p>A regular expression <em>pattern</em> is made up of several simple parts:</p>
<ul>
<li>Characters: The actual characters you want to match. You can insert literal strings like "chris", or define a list of characters ("only a, e, i, o and u"), or use the wildcard meta-character to match anything. There are also sets of character types you can use like "any digit" or "any whitespace character".</li>
<li>Alteration: Used to define a set of alternatives like "chris or christopher or christoph".</li>
<li>Quantification: Used to explain how many times a character or characters should appear. For example, "only a, e, i, o and u once".
<li>Grouping: Group a part of a pattern into larger chunks, to define scope, and to specify quantity of a larger chunk.</li>
<li>Assertions: An expression that is applied to the left or right (that is, before or after) the current matching position. This makes it possible to do patterns like "chris not followed by 'topher'".</li>
<li>Anchoring: Anchoring a pattern to the start of end of a string lets you define the context; where you want the pattern to match. For example, "match 'chris' at the beginning of the string".</li>
</ul>
<h3>Characters</h3>
<p>There are several ways you can define characters that you want to match.</p>
<p>The first way of course is a literal string:
<div class="igBar">
<div class="wrap"><span id="lcode-31" style="float:right"><a href="#" onclick="javascript:showCodeTxt('code-31'); return false;">Plain Text</a></span><span class="langName">CODE:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="code-31">
<div class="code">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">chris </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p>
This would match the string "chris", "christopher", "thechris" etcetera.</p>
<p>The second way is to define a character class. A character class is a list of characters that can (or can not) be matched:</p>
<div class="igBar">
<div class="wrap"><span id="lcode-32" style="float:right"><a href="#" onclick="javascript:showCodeTxt('code-32'); return false;">Plain Text</a></span><span class="langName">CODE:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="code-32">
<div class="code">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#006600; font-weight:bold;">&#91;</span>aeiou<span style="color:#006600; font-weight:bold;">&#93;</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#006600; font-weight:bold;">&#91;</span>^aeiou<span style="color:#006600; font-weight:bold;">&#93;</span></div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#006600; font-weight:bold;">&#91;</span>a-z0-<span style="color:#800000;color:#800000;">9</span><span style="color:#006600; font-weight:bold;">&#93;</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#006600; font-weight:bold;">&#91;</span>a-z0123456789<span style="color:#006600; font-weight:bold;">&#93;</span></div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#006600; font-weight:bold;">&#91;</span>a-z0-<span style="color:#800000;color:#800000;">9</span>\-<span style="color:#006600; font-weight:bold;">&#93;</span> </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p>
The first will match any vowel. The caret (^) in the second example means "not", so it makes the pattern match anything <em>but</em> a vowel. The third example you see the use of a dash. This creates a range of characters. "a-z" means "any letter from a to z", just like "0-9" means "any number from 0-9". Thus, the two last patterns mean the exact same thing. If you want to insert a literal dash (ie. "match a dash character") you must escape it, as demonstrated in the last example.</p>
<p>The third way is to use the wildcard character, or a pre-defined character type:</p>
<div class="igBar">
<div class="wrap"><span id="lcode-33" style="float:right"><a href="#" onclick="javascript:showCodeTxt('code-33'); return false;">Plain Text</a></span><span class="langName">CODE:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="code-33">
<div class="code">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">.</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">\w</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">\d </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p>
The first pattern (the dot) simply matches any character. The second pattern is the special escape sequence that means "any word character" (a word character is something like letters or numbers). The final patterns is another escape sequence that means "any digit" (that is, any number 0-9).</p>
<p>You can combine these to make up a fairly complex pattern:</p>
<div class="igBar">
<div class="wrap"><span id="lcode-34" style="float:right"><a href="#" onclick="javascript:showCodeTxt('code-34'); return false;">Plain Text</a></span><span class="langName">CODE:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="code-34">
<div class="code">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">\wchris\d </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p>
This would match "tchris9" and "zchris7", but not "chris", "chris98" or "zchris". You might wonder why the latter strings would not match. It is because we have not defined any rules for repetition, so the pattern literally means "a single word character followed by the string 'chris' followed by a single number".</p>
<h3>Alteration</h3>
<p>Alteration is a simpler concept. You simply use the pipe character to separate alternate expressions:</p>
<div class="igBar">
<div class="wrap"><span id="lcode-35" style="float:right"><a href="#" onclick="javascript:showCodeTxt('code-35'); return false;">Plain Text</a></span><span class="langName">CODE:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="code-35">
<div class="code">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">chris|christopher|christoph</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">color|colour </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p>
You will see some more useful examples of alternation soon when we talk about grouping.</p>
<h3>Quantification</h3>
<p>There are three ways you can define the quantity of characters.</p>
<p>First way is by providing no quantification at all. When there is none, it means once:</p>
<div class="igBar">
<div class="wrap"><span id="lcode-36" style="float:right"><a href="#" onclick="javascript:showCodeTxt('code-36'); return false;">Plain Text</a></span><span class="langName">CODE:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="code-36">
<div class="code">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#006600; font-weight:bold;">&#91;</span>a-z<span style="color:#006600; font-weight:bold;">&#93;</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#006600; font-weight:bold;">&#91;</span>a-zA-Z<span style="color:#006600; font-weight:bold;">&#93;</span> </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p>
The first pattern means "one lowercase letter" and the second means "one lower or uppercase letter".</p>
<p>The second way is by using a meta-character. There are three different meta-characters to choose from:</p>
<div class="igBar">
<div class="wrap"><span id="lcode-37" style="float:right"><a href="#" onclick="javascript:showCodeTxt('code-37'); return false;">Plain Text</a></span><span class="langName">CODE:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="code-37">
<div class="code">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#006600; font-weight:bold;">&#91;</span>a-z<span style="color:#006600; font-weight:bold;">&#93;</span>*</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">u?</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">\d+ </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p></p>
<ul>
<li>The asterisk (*) means "zero or more times". The first pattern means "any letter, any number of times".</li>
<li>The question mark (?) means "zero or one". The second pattern means "u is optional".</li>
<li>The plus sign (+) means "one or more". The third pattern means "any digit one or more times".</li>
</ul>
<p>The third way is by explicitly defining the minimum and maximum times the character can be repeated:</p>
<div class="igBar">
<div class="wrap"><span id="lcode-38" style="float:right"><a href="#" onclick="javascript:showCodeTxt('code-38'); return false;">Plain Text</a></span><span class="langName">CODE:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="code-38">
<div class="code">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#006600; font-weight:bold;">&#91;</span>a-z<span style="color:#006600; font-weight:bold;">&#93;</span><span style="color:#006600; font-weight:bold;">&#123;</span><span style="color:#800000;color:#800000;">1</span>,<span style="color:#800000;color:#800000;">5</span><span style="color:#006600; font-weight:bold;">&#125;</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">u<span style="color:#006600; font-weight:bold;">&#123;</span><span style="color:#800000;color:#800000;">1</span><span style="color:#006600; font-weight:bold;">&#125;</span></div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">\d<span style="color:#006600; font-weight:bold;">&#123;</span>,<span style="color:#800000;color:#800000;">5</span><span style="color:#006600; font-weight:bold;">&#125;</span> </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p>
The format is <em>{min,max}</em>. Either of the numbers can be excluded. For example, by not defining the maximum number, you just define the least number of times the character matches. The fist pattern means "any lowercase letter 1 to 5 times". The second pattern means "exactly 1 u". The third pattern means "at most 5 digits" (since there is no minimum, this would also match no digit!).</p>
<h3>Grouping</h3>
<p>Grouping characters is done with parenthesis. There are three situations where you might want to group characters together.</p>
<p>The first is to define the scope for an alteration:</p>
<div class="igBar">
<div class="wrap"><span id="lcode-39" style="float:right"><a href="#" onclick="javascript:showCodeTxt('code-39'); return false;">Plain Text</a></span><span class="langName">CODE:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="code-39">
<div class="code">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">\wchris|christopher\d</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">\w<span style="color:#006600; font-weight:bold;">&#40;</span>chris|christopher<span style="color:#006600; font-weight:bold;">&#41;</span>\d </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p>
Compare these two patterns. The first means "a word character followed by 'chris' OR 'christopher' followed by a digit". The only way to make the "chris" part alternate is by grouping it together. The second pattern means "a word character, followed by 'chris' or 'christopher', followed by a digit".</p>
<p>You can also group entire subpatterns for quantification:</p>
<div class="igBar">
<div class="wrap"><span id="lcode-40" style="float:right"><a href="#" onclick="javascript:showCodeTxt('code-40'); return false;">Plain Text</a></span><span class="langName">CODE:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="code-40">
<div class="code">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#006600; font-weight:bold;">&#40;</span><span style="color:#006600; font-weight:bold;">&#91;</span>a-z<span style="color:#006600; font-weight:bold;">&#93;</span><span style="color:#006600; font-weight:bold;">&#123;</span><span style="color:#800000;color:#800000;">1</span>,<span style="color:#800000;color:#800000;">5</span><span style="color:#006600; font-weight:bold;">&#125;</span>\d+<span style="color:#006600; font-weight:bold;">&#41;</span>+ </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p>
This means "any letter 1-5 times followed by at least one digit, at least once". It would match "a5", "a5b2", "zs49bf9" etcetera.</p>
<p>The final use is for capturing. When you group an expression, the matching characters are saved and can be re-used later in the pattern:</p>
<div class="igBar">
<div class="wrap"><span id="lcode-41" style="float:right"><a href="#" onclick="javascript:showCodeTxt('code-41'); return false;">Plain Text</a></span><span class="langName">CODE:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="code-41">
<div class="code">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&lt;<span style="color:#006600; font-weight:bold;">&#40;</span>b|strong<span style="color:#006600; font-weight:bold;">&#41;</span>&gt;\w*&lt;/\<span style="color:#800000;color:#800000;">1</span>&gt; </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p>
The first group matches either "b" or "strong". Then later in the pattern you see "\1" (an escaped '1') to represent that match. So that pattern will match a properly formatted "b" or "strong" tag. Here's another example you might use to extract a single or double quoted string:</p>
<div class="igBar">
<div class="wrap"><span id="lcode-42" style="float:right"><a href="#" onclick="javascript:showCodeTxt('code-42'); return false;">Plain Text</a></span><span class="langName">CODE:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="code-42">
<div class="code">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#006600; font-weight:bold;">&#40;</span><span style="color:#CC0000;">'|&quot;)<span style="color:#000099; font-weight:bold;">\w</span>*<span style="color:#000099; font-weight:bold;">\1</span> </span></div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p>
This would match things like:</p>
<ol>
<li>"hello"</li>
<li>'world'</li>
</ol>
<p>But <em>not</em>:</p>
<ol>
<li>"hello'</li>
<li>'world"</li>
</ol>
<p>The second set doesn't match because the quote characters are not the same, so the match would fail.</p>
<h3>Assertion (aka Lookahead and Lookbehind)</h3>
<p>Assertions are used to test the preceding or following characters against some expression, without actually consuming the characters. Let me explain that a bit more.</p>
<p>When the regex engine tries to apply a pattern to a string, it "consumes" the string as it goes. It has an internal pointer that moves along the string to keep the current position. Matching "(chris|christopher)" against the string "chris98" would put the internal pointer right after the "s", because thats where the pattern stops. Using an assertion simply checks back or forward, without moving the internal pointer.</p>
<p>For example, let's say I want to match my name "Chris" only when it's part of "Christopher". That is, I don't want to match "christoph" or "christine" or anything else. Here's how I might do it with a so called <em>lookahead</em>:</p>
<div class="igBar">
<div class="wrap"><span id="lcode-43" style="float:right"><a href="#" onclick="javascript:showCodeTxt('code-43'); return false;">Plain Text</a></span><span class="langName">CODE:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="code-43">
<div class="code">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#006600; font-weight:bold;">&#40;</span>?=Christopher<span style="color:#006600; font-weight:bold;">&#41;</span>Chris </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p>
This would match the "Chris" part of "Christopher Nadeau", but would not match "Christine Doe".</p>
<p>The way the regex engine applies this pattern is to look ahead at the starting point to see if all of the characters ahead are "Christopher". The internal pointer is not moved at all. So by the time the lookahead is finished, the engine applies the rest of the pattern "Chris" as normal, starting from the beginning. When the whole pattern is finished being applied to "Christopher Nadeau", the internal pointer is after the "s".</p>
<p>As programmers, we are used to using escape sequences. For example, to insert a double-quote character within a double-quoted string, we escape it like so: "Hello Chris \"Chroder\" Nadeau".</p>
<p>As an example, let's say we are writing some custom parser and need to do the same thing. We want to capture all of the double-quoted strings. This is easy, right?</p>
<div class="igBar">
<div class="wrap"><span id="lcode-44" style="float:right"><a href="#" onclick="javascript:showCodeTxt('code-44'); return false;">Plain Text</a></span><span class="langName">CODE:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="code-44">
<div class="code">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#CC0000;">"(.*)"</span> </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p>
That captures any character (the dot meta-character means "anything" remember), any number of times when it appears within double-quotes. But what if we wanted to allow the user to escape the double-quote so strings like the one above would be read correctly? That pattern would match "Hello Chris\", which isn't what we want.</p>
<p>We can use a lookbehind to make sure the preceding character is not a backslash:</p>
<div class="igBar">
<div class="wrap"><span id="lcode-45" style="float:right"><a href="#" onclick="javascript:showCodeTxt('code-45'); return false;">Plain Text</a></span><span class="langName">CODE:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="code-45">
<div class="code">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#CC0000;">"(.*?)(?&lt;=[^<span style="color:#000099; font-weight:bold;">\\</span>])"</span> </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p></p>
<p>By using the lookbehind, we make it so the regex engine will not match the ending quote when it is preceded by a backslash. </p>
<p>There are four types of assertions, two of which I have already demonstrated:</p>
<ul>
<li>Positive lookahead: (?=<u>expression</u>)<br />
		The pattern is successful if the expression matches the characters to the right of the current position</li>
<li>Negative lookahead: (?!<u>expression</u>)<br />
		The pattern is successful if the expression does not match the characters to the right of the current position</li>
<li>Positive lookbehind: (?&lt;=<u>expression</u>)<br />
		The pattern is successful if the expression matches the characters to the left of the current position</li>
<li>Negative lookbehind: (?&lt;!<u>expression</u>)<br />
		The pattern is successful if the expression does not match the characters to the left of the current position</li>
</ul>
<h3>Anchoring</h3>
<p>The last concept, anchoring, is very simple to understand. Say you wanted to match "chris", but only when it was at the very beginning of the string. You do this by <em>anchoring</em> the regular expression to the beginning of the string. What if you wanted to match only at the end of the string? Yup, you need to anchor to the end of the string. Here are three examples:</p>
<div class="igBar">
<div class="wrap"><span id="lcode-46" style="float:right"><a href="#" onclick="javascript:showCodeTxt('code-46'); return false;">Plain Text</a></span><span class="langName">CODE:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="code-46">
<div class="code">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">^<span style="color:#006600; font-weight:bold;">&#40;</span>chris|christopher<span style="color:#006600; font-weight:bold;">&#41;</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color:#006600; font-weight:bold;">&#40;</span>chris|christopher<span style="color:#006600; font-weight:bold;">&#41;</span>$</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">^<span style="color:#006600; font-weight:bold;">&#40;</span>chris|christopher<span style="color:#006600; font-weight:bold;">&#41;</span>$ </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p></p>
<p>The caret (^), when it is the first thing in the pattern, anchors it to the beginning of the string. The dollar sign ($), when the last thing in the pattern, anchors it to the end of the string.</p>
<p>The first pattern means "chris or christopher at the start". The second patterns means "chris or chirstopher at the end". The third pattern means "chris or christopher at the beginning and end", which just means "the string is exactly chris or exactly christopher".</p>
<p>You might be thinking, "why is anchoring important?". Well, let's say you want to validate a number that is in the form of ####-##-## (ie. year-month-day). You might want write:</p>
<div class="igBar">
<div class="wrap"><span id="lcode-47" style="float:right"><a href="#" onclick="javascript:showCodeTxt('code-47'); return false;">Plain Text</a></span><span class="langName">CODE:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="code-47">
<div class="code">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">\d<span style="color:#006600; font-weight:bold;">&#123;</span><span style="color:#800000;color:#800000;">4</span><span style="color:#006600; font-weight:bold;">&#125;</span>-\d<span style="color:#006600; font-weight:bold;">&#123;</span><span style="color:#800000;color:#800000;">2</span><span style="color:#006600; font-weight:bold;">&#125;</span>-\d<span style="color:#006600; font-weight:bold;">&#123;</span><span style="color:#800000;color:#800000;">2</span><span style="color:#006600; font-weight:bold;">&#125;</span> </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p>
This would work. It matches "1988-12-30". Success? No! It also matches "Blah blah 1988-12-30 blah". The pattern is only telling the regex engine to look for that one expression, it will just skip over all of the non-matching text. So to properly validate the string, you need to anchor it to the beginning and end:</p>
<div class="igBar">
<div class="wrap"><span id="lcode-48" style="float:right"><a href="#" onclick="javascript:showCodeTxt('code-48'); return false;">Plain Text</a></span><span class="langName">CODE:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="code-48">
<div class="code">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">^\d<span style="color:#006600; font-weight:bold;">&#123;</span><span style="color:#800000;color:#800000;">4</span><span style="color:#006600; font-weight:bold;">&#125;</span>-\d<span style="color:#006600; font-weight:bold;">&#123;</span><span style="color:#800000;color:#800000;">2</span><span style="color:#006600; font-weight:bold;">&#125;</span>-\d<span style="color:#006600; font-weight:bold;">&#123;</span><span style="color:#800000;color:#800000;">2</span><span style="color:#006600; font-weight:bold;">&#125;</span>$ </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p>
By anchoring to both the beginning and end, you are essentially saying "the <em>entire</em> string must match this pattern".</p>
<h2>Further Reading</h2>
<p>I think one of the best sites available on the subject of regular expressions is <a href="http://www.regular-expressions.info/">regular-expressions.info</a>. You might find their <a href="http://www.regular-expressions.info/reference.html">reference page</a> particularly useful.</p>
<p>If you're a book person, you should definately pick up a copy of <a href="http://www.amazon.com/Mastering-Regular-Expressions-Jeffrey-Friedl/dp/1565922573/">Mastering Regular Expressions</a> from O'Reilly.</p>
]]></content:encoded>
			<wfw:commentRss>http://devlog.info/2007/12/27/regular-expressions/feed/</wfw:commentRss>
		</item>
		<item>
		<title>Auto-DST Detection</title>
		<link>http://devlog.info/2007/11/01/auto-dst-detection-javascript-php/</link>
		<comments>http://devlog.info/2007/11/01/auto-dst-detection-javascript-php/#comments</comments>
		<pubDate>Thu, 01 Nov 2007 14:40:39 +0000</pubDate>
		<dc:creator>Christopher</dc:creator>
		
		<category><![CDATA[Javascript]]></category>

		<category><![CDATA[PHP]]></category>

		<category><![CDATA[daylight savings]]></category>

		<category><![CDATA[dst]]></category>

		<category><![CDATA[js]]></category>

		<guid isPermaLink="false">http://devlog.info/2007/11/01/auto-dst-detection/</guid>
		<description><![CDATA[Online apps usually have a way to set your timezone so that all times are local to you. One common feature many end-users expect is some mechanism that automatically detects when DST is on/off and changes things accordingly.
The easiest way I've found to do this is with Javascript. It's dreadfully simple code. Here's a sample [...]]]></description>
			<content:encoded><![CDATA[<p>Online apps usually have a way to set your timezone so that all times are local to you. One common feature many end-users expect is some mechanism that automatically detects when DST is on/off and changes things accordingly.<span id="more-24"></span></p>
<p>The easiest way I've found to do this is with Javascript. It's dreadfully simple code. Here's a sample of what I usually put at the footer of my pages that uses Javascript and PHP:</p>
<div class="igBar">
<div class="wrap"><span id="lhtml-50" style="float:right"><a href="#" onclick="javascript:showCodeTxt('html-50'); return false;">Plain Text</a></span><span class="langName">HTML:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="html-50">
<div class="html">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #009900;"><span style="color: #808080; font-style: italic;">&lt;!-- All of your HTML here --&gt;</span></span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;</span></a>?php if<span style="color: #66cc66;">&#40;</span>$do_dst_check<span style="color: #66cc66;">&#41;</span>: ?<span style="color: #000000; font-weight: bold;">&gt;</span></a></span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #009900;"><a href="http://december.com/html/4/element/script.html"><span style="color: #000000; font-weight: bold;">&lt;script</span></a> <span style="color: #000066;">type</span>=<span style="color: #ff0000;">"text/javascript"</span><span style="color: #000000; font-weight: bold;">&gt;</span></a></span></div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; var timezone = <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;</span></a>?php echo $timezone + $dst_offset; ?<span style="color: #000000; font-weight: bold;">&gt;</span></a></span>;</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; var utc = new Date().getTimezoneOffset() / 60;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; if (Math.abs(timezone + utc) == 1) {</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; &nbsp; &nbsp; $.ajax({</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; type: 'GET',</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; url: 'ajax_update_dst.php',</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; success: function() { location.reload(); }</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; &nbsp; &nbsp; });</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; }</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/script&gt;</span></span></div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;</span></a>?php endif; ?<span style="color: #000000; font-weight: bold;">&gt;</span></a></span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/body&gt;</span></span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/html&gt;</span></span> </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p></p>
<h2>How It Works</h2>
<p>First you get the time offset that the user has entered into your application, the one you have on record. You need to get the timezone selection and then the current DST offset. For example, if DST is "on" then that just means you +1 to the users selected timezone.</p>
<p>Javascript has something your server-side scripts might not: it knows about the users locale. So using this fact, we can get the users current timezone offset. This is the "real" offset, the one we know is correct, regardless of what they inputted into your application.</p>
<p>Finally, you simply add the offset your application has on record with the users "real" offset. If the result is exactly -1 or 1 (here I used Math.abs, so -1 becomes 1), that means the information you have on record is incorrect, and the DST status needs to be toggled.</p>
<p>In this example I use a <a href="http://docs.jquery.com/Ajax">jQuery AJAX</a> call to request a page that would toggle the users DST setting.</p>
]]></content:encoded>
			<wfw:commentRss>http://devlog.info/2007/11/01/auto-dst-detection-javascript-php/feed/</wfw:commentRss>
		</item>
		<item>
		<title>Javascript Objects and Member Visibility</title>
		<link>http://devlog.info/2007/10/20/javascript-objects-and-member-visibility/</link>
		<comments>http://devlog.info/2007/10/20/javascript-objects-and-member-visibility/#comments</comments>
		<pubDate>Sat, 20 Oct 2007 21:10:16 +0000</pubDate>
		<dc:creator>Christopher</dc:creator>
		
		<category><![CDATA[Application Design]]></category>

		<category><![CDATA[Javascript]]></category>

		<category><![CDATA[classes]]></category>

		<category><![CDATA[js]]></category>

		<category><![CDATA[objects]]></category>

		<category><![CDATA[oop]]></category>

		<category><![CDATA[visibility]]></category>

		<guid isPermaLink="false">http://devlog.info/2007/10/20/javascript-objects-and-member-visibility/</guid>
		<description><![CDATA[So many web developers know just a little about Javascript. Enough to use a library like jQuery somewhat effectively, but not enough to understand how to create properly structured applications. I'm not going to get into how objects work in Javascript, or how to use them, I'll leave that for another day. I just want [...]]]></description>
			<content:encoded><![CDATA[<p>So many web developers know just a little about Javascript. Enough to use a library like <a href="http://jquery.com/">jQuery</a> somewhat effectively, but not enough to understand how to create properly structured applications. I'm not going to get into how objects work in Javascript, or how to use them, I'll leave that for another day. I just want to touch on the topic of <em>member visibility</em> (that is, private/protected methods and properties).<span id="more-23"></span></p>
<p>There is no formal way to actually define member visibility in Javascript (no "public" and "private" keywords like you might see in Java). Instead we just use the language features in such a way that it creates the same public/private situation as we'd expect in other languages (or nearly the same).</p>
<h2>Public</h2>
<p>A member is public if "the world" can access it. For methods this means anyone can call on it, and for properties this means anyone can use its value or change it. If you are creating object-oriented programs, having nothing but public members breaks a lot of the ideology. In many languages, like PHP before version 5, programmers used conventions to denote members were private and not to be used. Sometimes this works, but true encapsulation is much better. </p>
<p>There are two ways you create public members:</p>
<h3>Constructor</h3>
<div class="igBar">
<div class="wrap"><span id="ljavascript-58" style="float:right"><a href="#" onclick="javascript:showCodeTxt('javascript-58'); return false;">Plain Text</a></span><span class="langName">JAVASCRIPT:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="javascript-58">
<div class="javascript">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #003366; font-weight: bold;">function</span> Person<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#123;</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #000066; font-weight: bold;">this</span>.<span style="color: #000066;">name</span> = <span style="color: #3366CC;">'Christopher'</span>;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #66cc66;">&#125;</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #003366; font-weight: bold;">var</span> me = <span style="color: #003366; font-weight: bold;">new</span> Person<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #000066;">alert</span><span style="color: #66cc66;">&#40;</span>me.<span style="color: #000066;">name</span><span style="color: #66cc66;">&#41;</span>; </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p>
Using 'this' binds the variable to the object, so anyone can use it.</p>
<h3>Prototype</h3>
<div class="igBar">
<div class="wrap"><span id="ljavascript-59" style="float:right"><a href="#" onclick="javascript:showCodeTxt('javascript-59'); return false;">Plain Text</a></span><span class="langName">JAVASCRIPT:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="javascript-59">
<div class="javascript">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #003366; font-weight: bold;">function</span> Person<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#123;</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #66cc66;">&#125;</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">Person.<span style="color: #006600;">prototype</span>.<span style="color: #000066;">name</span> = <span style="color: #3366CC;">'Christopher'</span>;</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #003366; font-weight: bold;">var</span> me = <span style="color: #003366; font-weight: bold;">new</span> Person<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #000066;">alert</span><span style="color: #66cc66;">&#40;</span>me.<span style="color: #000066;">name</span><span style="color: #66cc66;">&#41;</span>; </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p></p>
<p>Adding a method or property to the prototype also makes it public.</p>
<h2>Private</h2>
<p>A member is private if only the object itself can access it.</p>
<p>To create private members, you define them within the constructor:</p>
<div class="igBar">
<div class="wrap"><span id="ljavascript-60" style="float:right"><a href="#" onclick="javascript:showCodeTxt('javascript-60'); return false;">Plain Text</a></span><span class="langName">JAVASCRIPT:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="javascript-60">
<div class="javascript">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #003366; font-weight: bold;">function</span> Person<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#123;</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #003366; font-weight: bold;">var</span> first_name = <span style="color: #3366CC;">'Christopher'</span>;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #003366; font-weight: bold;">var</span> last_name = <span style="color: #3366CC;">'Nadeau'</span>;</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #003366; font-weight: bold;">function</span> fullname<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#123;</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #000066; font-weight: bold;">return</span> first_name + <span style="color: #3366CC;">' '</span> + last_name;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #66cc66;">&#125;</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #66cc66;">&#125;</span></div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp;</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #003366; font-weight: bold;">var</span> me = <span style="color: #003366; font-weight: bold;">new</span> Person<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #000066;">alert</span><span style="color: #66cc66;">&#40;</span>me.<span style="color: #000066;">name</span><span style="color: #66cc66;">&#41;</span>; <span style="color: #009900; font-style: italic;">// can't do it! </span></div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p>
In this example there are two private properties for first and last name, and one private method to return a full name.</p>
<h3>Some Issues...</h3>
<p>There are a couple of issues you have to be aware of when using private members.</p>
<p>Only methods defined in the constructor can use private members. That is to say, we <em>cannot</em> do something like this:</p>
<div class="igBar">
<div class="wrap"><span id="ljavascript-61" style="float:right"><a href="#" onclick="javascript:showCodeTxt('javascript-61'); return false;">Plain Text</a></span><span class="langName">JAVASCRIPT:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="javascript-61">
<div class="javascript">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #003366; font-weight: bold;">function</span> Person<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#123;</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #003366; font-weight: bold;">var</span> first_name = <span style="color: #3366CC;">'Christopher'</span>;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #003366; font-weight: bold;">var</span> last_name = <span style="color: #3366CC;">'Nadeau'</span>;</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #003366; font-weight: bold;">function</span> fullname<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#123;</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #000066; font-weight: bold;">return</span> first_name + <span style="color: #3366CC;">' '</span> + last_name;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #66cc66;">&#125;</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #66cc66;">&#125;</span></div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp;</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">Person.<span style="color: #006600;">prototype</span>.<span style="color: #006600;">alertName</span> = <span style="color: #003366; font-weight: bold;">function</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#123;</span></div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #009900; font-style: italic;">// Can't do this. 'this.first_name' does not actually exist!</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #000066;">alert</span><span style="color: #66cc66;">&#40;</span><span style="color: #000066; font-weight: bold;">this</span>.<span style="color: #006600;">first_name</span><span style="color: #66cc66;">&#41;</span>;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #66cc66;">&#125;</span> </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p></p>
<p>The scope of the private members are in the constructor only. To get around this problem, you must use what is called <em>privileged methods</em>.</p>
<h2>Privileged</h2>
<p>As stated before, only methods defined within the constructor have access to private members. Given that many objects are built around using 'prototype', this is problematic. The solution is to create privileged methods.</p>
<p>A privileged method is a method defined in the constructor but assigned to a public variable. Since it is defined within the scope of any other private members, it has access to them. Here's an example:</p>
<div class="igBar">
<div class="wrap"><span id="ljavascript-62" style="float:right"><a href="#" onclick="javascript:showCodeTxt('javascript-62'); return false;">Plain Text</a></span><span class="langName">JAVASCRIPT:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="javascript-62">
<div class="javascript">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #003366; font-weight: bold;">function</span> Person<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#123;</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #003366; font-weight: bold;">var</span> first_name = <span style="color: #3366CC;">'Christopher'</span>;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #003366; font-weight: bold;">var</span> last_name = <span style="color: #3366CC;">'Nadeau'</span>;</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #003366; font-weight: bold;">function</span> fullname<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#123;</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #000066; font-weight: bold;">return</span> first_name + <span style="color: #3366CC;">' '</span> + last_name;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #66cc66;">&#125;</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #000066; font-weight: bold;">this</span>.<span style="color: #006600;">alertName</span> = <span style="color: #003366; font-weight: bold;">function</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#123;</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #000066;">alert</span><span style="color: #66cc66;">&#40;</span>first_name<span style="color: #66cc66;">&#41;</span>;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #66cc66;">&#125;</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #66cc66;">&#125;</span> </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p></p>
<p>You can guess that you will be able to retrieve the 'alertName' method or reset it. You might think that it would be possible to redefine the method to take control of some other private member. Not so! The method is a closure and retains the scope in which it was defined. Since it was defined in the scope of the other private members, it has access to them. There is no way to recreate this scope, so even reassigning a completely new function will not allow you to expose any private members.</p>
<h3>The 'this' reference</h3>
<p>Another thing to be aware of is that functions defined within the constructor have "this" pointing to themselves, and not the object itself. Thus if you need to call other public methods, you cannot. For example, let's make the fullname() method privileged and modify alertName() to call it:</p>
<div class="igBar">
<div class="wrap"><span id="ljavascript-63" style="float:right"><a href="#" onclick="javascript:showCodeTxt('javascript-63'); return false;">Plain Text</a></span><span class="langName">JAVASCRIPT:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="javascript-63">
<div class="javascript">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #003366; font-weight: bold;">function</span> Person<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#123;</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #003366; font-weight: bold;">var</span> first_name = <span style="color: #3366CC;">'Christopher'</span>;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #003366; font-weight: bold;">var</span> last_name = <span style="color: #3366CC;">'Nadeau'</span>;</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #009900; font-style: italic;">// This is now a privileged method</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #000066; font-weight: bold;">this</span>.<span style="color: #006600;">fullname</span> = <span style="color: #003366; font-weight: bold;">function</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#123;</span></div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #000066; font-weight: bold;">return</span> first_name + <span style="color: #3366CC;">' '</span> + last_name;</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #66cc66;">&#125;</span></div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp;</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #000066; font-weight: bold;">this</span>.<span style="color: #006600;">alertName</span> = <span style="color: #003366; font-weight: bold;">function</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#123;</span></div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #000066;">alert</span><span style="color: #66cc66;">&#40;</span><span style="color: #000066; font-weight: bold;">this</span>.<span style="color: #006600;">fullname</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span><span style="color: #66cc66;">&#41;</span>; <span style="color: #009900; font-style: italic;">// wont work</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #66cc66;">&#125;</span></div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #66cc66;">&#125;</span> </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p></p>
<p>To get around this problem, Javascript programmers assign another private property with the value of 'this' inside the constructor, and use that variable as a reference to the object. The two most common names are 'self' and 'that'; I prefer to use 'self'. Here is the final object, working as expected:</p>
<div class="igBar">
<div class="wrap"><span id="ljavascript-64" style="float:right"><a href="#" onclick="javascript:showCodeTxt('javascript-64'); return false;">Plain Text</a></span><span class="langName">JAVASCRIPT:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="javascript-64">
<div class="javascript">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #003366; font-weight: bold;">function</span> Person<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#123;</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #003366; font-weight: bold;">var</span> first_name = <span style="color: #3366CC;">'Christopher'</span>;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #003366; font-weight: bold;">var</span> last_name = <span style="color: #3366CC;">'Nadeau'</span>;</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #009900; font-style: italic;">// Create a reference to this object so closures</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #009900; font-style: italic;">// can access it.</span></div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #003366; font-weight: bold;">var</span> self = <span style="color: #000066; font-weight: bold;">this</span>;</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #000066; font-weight: bold;">this</span>.<span style="color: #006600;">fullname</span> = <span style="color: #003366; font-weight: bold;">function</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#123;</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #000066; font-weight: bold;">return</span> first_name + <span style="color: #3366CC;">' '</span> + last_name;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #66cc66;">&#125;</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #000066; font-weight: bold;">this</span>.<span style="color: #006600;">alertName</span> = <span style="color: #003366; font-weight: bold;">function</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#123;</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #000066;">alert</span><span style="color: #66cc66;">&#40;</span>self.<span style="color: #006600;">fullname</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span><span style="color: #66cc66;">&#41;</span>; <span style="color: #009900; font-style: italic;">// Using self to reference the object</span></div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">&nbsp; &nbsp; <span style="color: #66cc66;">&#125;</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #66cc66;">&#125;</span> </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p></p>
]]></content:encoded>
			<wfw:commentRss>http://devlog.info/2007/10/20/javascript-objects-and-member-visibility/feed/</wfw:commentRss>
		</item>
		<item>
		<title>Cross-Site Request Forgeries (CSRF)</title>
		<link>http://devlog.info/2007/09/02/cross-site-request-forgeries-csrf/</link>
		<comments>http://devlog.info/2007/09/02/cross-site-request-forgeries-csrf/#comments</comments>
		<pubDate>Mon, 03 Sep 2007 01:08:40 +0000</pubDate>
		<dc:creator>Christopher</dc:creator>
		
		<category><![CDATA[PHP]]></category>

		<category><![CDATA[Security]]></category>

		<category><![CDATA[csrf]]></category>

		<category><![CDATA[xss]]></category>

		<guid isPermaLink="false">http://devlog.info/2007/09/02/cross-site-request-forgeries-csrf/</guid>
		<description><![CDATA[Today I want to cover a kind of security issue that is not addressed very often. Just about any book or article aimed at developers has some warning about XSS and SQL injection. Those two attacks are arguably two of the most harmful, but there are certainly other things to be weary of. In this [...]]]></description>
			<content:encoded><![CDATA[<p>Today I want to cover a kind of security issue that is not addressed very often. Just about any book or article aimed at developers has some warning about XSS and SQL injection. Those two attacks are arguably two of the most harmful, but there are certainly other things to be weary of. In this post I will talk about Cross-Site Request Forgeries or CSRF ("see-surf").<span id="more-22"></span></p>
<h2>CSRF Explained</h2>
<p>CSRF is a type of exploit that allows an attacker to send a request to your application with the authority of another user and without that users consent. Sometimes these requests might mean little (i.e., the user is a guest so they can't do any harm) but other times the requests can be very dangerous and destructive (i.e., the user is an administrator).</p>
<h3>How It's Done</h3>
<p>There are a number of ways that a request can be made against your server without any user interaction. The most basic and probably most often used technique is with a simple HTML image tag:</p>
<div class="igBar">
<div class="wrap"><span id="lhtml-72" style="float:right"><a href="#" onclick="javascript:showCodeTxt('html-72'); return false;">Plain Text</a></span><span class="langName">HTML:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="html-72">
<div class="html">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #009900;"><a href="http://december.com/html/4/element/img.html"><span style="color: #000000; font-weight: bold;">&lt;img</span></a> <span style="color: #000066;">src</span>=<span style="color: #ff0000;">"http://example.org/somescript.php"</span> <span style="color: #000066;">width</span>=<span style="color: #ff0000;">"1"</span> <span style="color: #000066;">height</span>=<span style="color: #ff0000;">"1"</span> /<span style="color: #000000; font-weight: bold;">&gt;</span></a></span> </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p></p>
<p>Even though the script handling the request ("somescript.php") might not be a valid image, it doesn't matter. The request is still being made. And by providing a width/height of 1 pixel, we can be certain the user doesn't even suspect anything is wrong.</p>
<p>Other ways might include using an iframe in the same way, or using automatic redirects.</p>
<h3>How It's Dangerous</h3>
<p>By being able to make requests so easily and without any interaction on the users part leaves services open for attack. As an example say we have an administrators control panel that lets admins delete articles on a website. An attacker might somehow get an admin to visit his website with an image tag on it:</p>
<div class="igBar">
<div class="wrap"><span id="lhtml-73" style="float:right"><a href="#" onclick="javascript:showCodeTxt('html-73'); return false;">Plain Text</a></span><span class="langName">HTML:</span>
</div>
</div>
<div class="syntax_hilite">
<div class="wrap">
<div id="html-73">
<div class="html">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #009900;"><a href="http://december.com/html/4/element/img.html"><span style="color: #000000; font-weight: bold;">&lt;img</span></a> <span style="color: #000066;">src</span>=<span style="color: #ff0000;">"http://example.org/admincp/delete_article.php?id=42"</span> <span style="color: #000066;">width</span>=<span style="color: #ff0000;">"1"</span> <span style="color: #000066;">height</span>=<span style="color: #ff0000;">"1"</span> /<span style="color: #000000; font-weight: bold;">&gt;</span></a></span> </div>
</li>
</ol>
</div>
</div>
</div>
</div>
<p></p>
<p>The danger comes when the admin happens to have an active session. If the session is controlled by cookies or IP address etc. then this request will be made with all of the authority of the admin. It would be as if the admin made the request purposefully.</p>
<p>You might be thinking that it would be a simple matter to prevent such an attack by using POST data instead of GET data. If you used POST data then the ID in the URL would not be accepted. While it does create another barrier for a potential attacker (which is always good), it doesn't solve the problem. Consider this code fragment:</p>
<div class="igBar">
<div class="wrap"><span id="lhtml-74" style="float:right"><a href="#" onclick="javascript:showCodeTxt('html-74'); return false;">Plain Text</a></span><span class="langName">HTML:<