Tag Archives: web server

Secure Forms with Zend Framework

micro tutorial, PHP, zend framework, , , , , , , , , , ,

Maybe the correct title is not “with Zend Framework”, but “with PHP”, because the general approach I used is purely PHP and no Zend Framework dependency is used. However let me mention that ZF allows you to build forms with Zend_Form, which gives you an abstraction over the HTML forms with many goodies like validation, filtering and protection.

Zend_Form and Zend_Form_Element_Hash

Although the technique I’m using is doing the same thing, note that in ZF there’s a Zend_Form_Element_Hash which generates and validates the form, thus protecting you from CSRF attacks. The thing is that I didn’t use it because the form I’m protecting is not generated with Zend_Form, and I cannot benefit from everything ZF is giving to me. However you can easily reproduce the basic strategy with every form and every framework till it’s written in PHP.

What’s the solution?

It’s pretty simple and it’s described many many times around the web, simply generate a random hash, a possible solution is to use uniqid in combination with mt_rand and md5, thus you’d get quite strong hash.

Step two is to pass this generated hash, also stored in the session in a hidden value of the form. Of course now the most asked question is: but that’s visible to the source and thus everybody will have a valid hash.

There’s the trick. OK everybody will have a valid hash, but on submit the hash is validated against the SESSION variable, and as you know the session is specified between the browser (client) and the web server. Although the attacker may have a valid hash he must execute the attacking script from the same domain, possibly with the same browser, which makes the task rather difficult.

An Example

Let me show a breve example, it may help make things clearer.

1. First step – start the session

<?php
session_start();
?>

2. Second step – validate the form against the $_SESSION and generate a valid token

<?php
if (isset($_POST['name']) && $_POST['token'] == $_SESSION['token'])
    echo $_POST['name'];
else
    echo 'dont hack';
 
$_SESSION['token'] = md5(uniqid('test', true));
?>

3. Third step – make a form

<form method="POST" action="">
<input type="hidden" value="<?php echo $_SESSION['token'] ?>" name="token" />
<input type="text" name="name" value="stoimen" />
<input type="submit" name="submit" />
</form>

Demo here.

For more to test this you may try to make the same form somewhere else on the web and to point the action to http://www.stoimen.com/projects/php.secure.forms/! Without the session validation it’s absolutely sure you can post on the attacked server.

P.S. Now I’ve to admit that this have nothing to do with Zend Framework, however it’s good practice and thus may be used with every framework.

CSS sprites. Go beyond the limits with base64!

css, micro tutorial, , , , , , , , , , , , , , , , ,

Why should I optimize CSS?

In fact how and why should I optimize CSS is the right question. Actually CSS is simply one ore more files loaded from the server to the client, usually a browser, with CSS specific rules that must be applied by the browser to the web page you’re seeing. That’s in general. Of course there are exceptions when CSS can be inline or added directly to the HTML tags, which is bad practice because thus the HTML markup becomes larger and even worse the browser cannot cache it and than load it quickly. In fact that’s why usually the CSS of a web page is put in one single file. Primary because that makes only one request to the server and in second hand because it can be cached by the browser.

Just because the nature of the CSS is that firstly it’s loaded and than executed one of the primary techniques of optimizing it is to make it smaller and therefore load faster. There are several methods of doing so. Enabling GZIP support of the web server and minifying the file are the most common ones. But one of the tricks you cannot optimizing just for second is using the so called CSS sprites.

CSS sprites

What are these? To answer this question I’ll simply try to give you an example. Let’s assume there are three CSS classes each one with its own background image. This makes four requests to the server. One for the CSS file and one per every background image. But what we’d like to achieve is to make less requests as we can. Than one of the things we can do is to make one single image and to change only the background-position CSS property to position it on the right place and to make it appear correctly.

Be careful! When you join all of the images into one single CSS sprite you may add one class with that background-image and every other class with only background-position property. Than every DOM element with that background must have both class names. Only than you can be sure the server will make two requests. One for the CSS file and one for the sprite.

base64 to encode images

In other hand most of the web projects are pretty big, and unfortunately it’s too difficult to make only one single sprite just because it’s too difficult to manage it after the project has become very large. That’s why mostly in the practice there are several sprites for the main components. But the problem is that again there are more HTTP requests.

Is there any way to make only one request?

Yes there is. Simply by converting your CSS sprite into a base64 encoded image. In breve base64 is an encoding where you can practically make any data into a string. Thus the image can be represented by a string containing the same information as the image. Hopefully most of the browser, except of course MSIE, does read the so called data urls, or:

<img src="data:image/png;base64,..... " />

and that’s enough to get started with base64 and the single request. The sprite has become a string!

CSS and base64

The natural question is now how to merge all this? You now have one CSS file with one or more sprites. Than you can convert them into a base64 encoded strings and put them all into the CSS.

There is a problem, of course, what happens with MSIE. As I said before MSIE doesn’t read base64 encoded images. Hopefully there is a solution described very well by Stoyan Stefanov in his blog post here.

Finally …

now there is only one request and everything works pretty fine. This technique can be really helpful to someone who’s trying to optimize the CSS performance to the limits.

Faster HTML! Why not?

web development, , , , , , , , , , , ,

Although I’ve read so many articles about web page optimization there’s not so much about optimizing HTML.

Why?

Maybe because nobody things that the HTML source of a page can be optimized or the optimization of it cannot bring some benefit to the page load experience. I don’t thing so. If something can be optimized, even if this does not give you so much, why you shouldn’t do it?

How to optimize such thing as HTML?

Well there are few things you should do and other that can speed up a little bit but you should not.

1. Enable gzip

What is gzip? Well in breve everything the server generates is sent back to the client in text format. You’ve to possibilities to send it. Either compressed or uncompressed. As you may guess the compressed format is a lot faster than uncompressed. In fact to make it work that way you’d need to enable gzip which is supported by the web server. In the case of Apache web server this can be done by enabling mod_deflate. Take a look of mod_deflated and mod_inflate. This two modules gives you the possibility to make your site a lot faster and the good news is that this is done without a single line change. The bad news, as always there’s a bad news, is that sometimes this cannot help a visitor, simply because his browser doesn’t support such corresponding with the server. According to a research I’ve read recently almost 15% of the web browsers doesn’t support gzip. Sometimes the reason is old browser versions, sometimes because the state policy doesn’t allow it. However this is the first thing you should do to speed up your HTML even it is not related directly to HTML scripts. By the way this will speed up everything which is sent back to the client, especially CSS and JavaScript files and in the case of JavaScript this can improve dramatically the user experience. Continue reading Faster HTML! Why not? →

php.ini for two web servers

web development, , , ,

Two Apaches one php.ini

Yes in our case this was the fact. There were two web servers, Apache 2 in our case, and one PHP. The php.ini file was in /etc/ as usual. Everything seemed to be perfect. But however some directives in php.ini does not worked for one of the server.

Why the second server does not read php.ini?

Well actually when you load the php.ini for the first server it loads correctly with everthing declared in it. However when you start the second server, of course on a different port than the first one, you get all the php.ini values as if they are default.

Why?

That’s some feature of PHP we didn’t know. I still don’t have an explanation about it. But of cource there’s a …

Workaround

You can put everything for the second server in the .htaccess file, so this will act as second php.ini for the second web server