Introduction

Comme tout webmaster, lorsque vous créez votre premier site, vous installez sans doute un logiciel comme WAMP ou EasyPhp. Vous mettez alors votre site dans le répertoire /www/ et celui ci est alors accessible via l'url http://localhost/

Problématique

Mais que se passe-t-il lorsqu'avec un peu d'expérience vous vous mettez à développer plusieurs site simultanément ?

Présentation

Vous vous retrouvez avec une multitude de sous dossiers, et des urls à rallonge comme, par exemple :

http://localhost/mon_dossier1/.../mon_dossierX/monprojet/index.html

qui sert d'url racine du site en phase de développement.

Si comme moi ça vous casse les pieds (problèmes d'urls relative et absolues qui ne fonctionnent plus lorsque vous hébergez votre site en production, urls trop longues à taper pour accéder au site, etc...) alors ce tutoriel pourra vous être utile.

Sommaire

1. L'objectif du tutoriel

Nous allons abandonner définitivement les urls à rallonge et leur préférer de jolies et courtes adresses comme par exemple : http://monprojet.dev/

2. Prérequis

Ce tutoriel a été écrit pour des personnes travaillant sous environnement windows, et j'utilise ici un serveur Wamp. Vous n'aurez sans doute pas de difficultés à le transposer sous un autre logiciel.

• Je considère que vous avez installé WAMP sous C:\wamp\.
• Je considère que vous avez placé votre projet en cours sous C:\wamp\www\monprojet\.
• Vous avez besoin d'un éditeur texte, le bloc note windows peut faire l'affaire.

3. Configurer l'hôte pour windows

Ouvrez le fichier :
C:\Windows\System32\drivers\etc\hosts

Vous devriez lire vers la ligne 20 quelque chose comme ceci :

127.0.0.1       localhost
::1             localhost

Rajoutez la ligne :

127.0.0.1       monprojet.dev

Et enregistrez le fichier.

Remarque :
Si vous ne pouvez pas éditer le fichier, vérifiez que celui-ci n'est pas en lecture seule.
Sous Vista, vous risquez de rencontrer encore plus de problèmes avec l'UAC. Faites une copie du fichier sur votre bureau, mettez les droits d'écriture, faites la modification, remettez le fichier en lecture seule, et écrasez le fichier original.

4. Configuration de Apache

Sous wamp, lorsque celui-ci est lancé, cliquez sur l'icone dans la barre des tâches, cliquez sur "Apache" et vous devriez voir dans les entrées du menu déroulant un fichier httpd.conf. Ouvrez ce fichier et nous allons faire les modifications nécessaires.
Vous pouvez retrouver ce fichier sous C:\wamp\bin\apache\apacheX.X.X\conf\httpd.conf.

A la fin du fichier, rajoutez ceci :

1)

#####
## localhost
## DOMAINE principal
#####
NameVirtualHost localhost 

<VirtualHost localhost> 
    DocumentRoot C:/wamp/www/
    ServerName localhost
</VirtualHost>

2) et également

#####
## monprojet.dev
## DOMAINE de monprojet
#####
NameVirtualHost monprojet.dev 

<VirtualHost monprojet.dev> 
    DocumentRoot C:/wamp/www/monprojet/
    ServerName monprojet.dev
</VirtualHost>

Remarque :
Il est indispensable de bien mettre les 2 définitions d'hôtes. Si vous ne mettez que la partie 2) alors l'url http://localhost/ vous amènera aussi au dossier contenant votre projet. Ce qui n'est bien sûr pas souhaité, car vous avez besoin d'accéder au répertoire /www/.

Enregistrez le fichier. Redémarrez votre serveur apache.

5. Et voilà !

Si tout s'est bien passé :

• en accédant à http://localhost/ vous retrouvez l'affichage "normal" du répertoire /www/
• en accédant à http://monprojet.dev/ vous devriez tomber directement sur votre projet, autrefois accessible à l'adresse http://localhost/monprojet/ (qui reste bien entendu accessible).

Vous savez maintenant comment faire pour rajouter autant d'hôtes virtuels que vous avez de projets en cours !

6. Compléments

Pour en savoir plus sur les hôtes virtuels sous Apache :
http://httpd.apache.org/docs/1.3/vhosts/