Développement Web – Johnstyle

Chapitre 1, Présentation

1 – Introduction

L’URL Rewriting signifie « réécriture d’URL », c’est une technique qui permet de renommer dynamiquement les URL des pages web. Le but étant de rendre plus lisible les URL de votre site pour les internautes mais surtout pour les moteurs de recherches car l’URL Rewriting fait parti des techniques d’optimisation de référencement d’un site web.

Par défaut sous PHP les URL peuvent être de ce type :
http://mon-site.com/index.php?marque=renault&id=clio
Avec la réécriture nous pourrons obtenir ceci :
http://mon-site.com/renault/clio/
Réellement les dossiers « renault » et « clio » n’existent pas mais virtuellement si.

Chapitre 2, Le serveur Web

1 – Introduction

L’URL Rewriting est propre au serveur Apache qui possède un module de réécriture nommé «  RewriteEngine ». Heureusement Apache est le serveur le plus utilisé au monde, vous n’aurez donc pas de mal à trouver un hébergement avec cette technologie.

2 – Présentation d’Apache

Apache (Apache HTTP Server) est un logiciel de serveur web, entièrement développé en open sources c’est un serveur dit HTTP. Il s’installe aussi bien sous les systèmes Unix (Linux, etc..) que sous Window.

Il permet d’exécuter des pages web HTML, il faudra cependant le compléter avec d’autres logiciels pour étendre ses capacités. (PHP, MySql, etc…)

Pour le développement il existe des « pack » logiciels qui permettent d’installer très facilement un serveur web contenant tous les éléments nécessaires.

WAMP Server (Window Apache Mysql Php)
LAMP Server (Linux Apache Mysql Php)

Vous aurez ainsi un serveur local installé très rapidement.

Il est cependant déconseillé d’utiliser ces pack pré-fait pour une utilisation de production. Il faudra dans ce cas la installer sois même les éléments nécessaires un par un.

3 – Pré-requis du serveur

Pour utiliser pleinement les capacité de l’URL Rewriting en local il faudra apporter quelques réglages à votre serveur.

Notamment la création d’hôtes virtuels (virtual host). Pour cela sous Window et avec le logiciel WAMP Server  (installé à la racine de c:),  il faut suivre la manipulation suivante pour créer l’hôte virtuel  « www.server.dev » :

Rendez-vous ici :

C:WINDOWSsystem32driversetchosts

Ouvrez le fichier et rajoutez à la fin :

127.0.0.1       www.server.dev

Ensuite rendez-vous ici :

C:wampbinapacheapache2.2.8confextrahttpd-vhosts.conf

Ouvrez le fichier et rajoutez à la fin :

<VirtualHost *:80>
    ServerAdmin webmaster@dummy-host2.localhost
    DocumentRoot « Le chemin complet de votre dossier local ex:C:/wamp/www/ »
    ServerName www.server.dev
    ErrorLog « logs/dummy-host2.localhost-error.log »
    CustomLog « logs/dummy-host2.localhost-access.log » common
</VirtualHost>

Et pour finir, vérifiez que les virtuals host sont activé :

Dans :

C:wampbinapacheapache2.2.8confhttpd.conf

Décommentez la seconde ligne :

# Virtual hosts
Include conf/extra/httpd-vhosts.conf

Redémarrer votre serveur et tapez « www.server.dev » dans votre navigateur, vous venez de créer un « nom de domaine » virtuel.

www.server.dev est un exemple, vous pouvez l’appeler comme vous le souhaité (www.google.fr, toto, etc…) et en créer autant que nécessaire.

4 – Changer le dossier www

Dans :

C:wampbinapacheapache2.2.8confhttpd.conf

Recherchez et modifiez ces deux lignes en spécifiant le chemin de votre nouveau répertoire :

1 – DocumentRoot « c:/wamp/www/ »
2 – <Directory « c:/wamp/www/ »>

Chapitre 3, Le fichier .htaccess

1 – Présentation

Votre serveur Apache possède des fichiers de configuration général mais il permet aussi de créer des fichiers de configuration personnalisés, actif pour un dossier ou un groupe de dossier : ce sont les fichiers .htaccess

Pour la production, la première chose à faire est de vérifier si votre serveur permet l’utilisation ce fichier : chez Free par exemple il est autorisé mais limité dans son utilisation.

2 – L’Utilisation

L’utilisation d’un fichier .htaccess est très simple, il faut cependant respecter une syntaxe particulière mais ce n’est pas un langage proprement parlé mais plus une liste de commandes.

Si vous faite une erreur syntaxe, vous le saurez très rapidement car cela générera une erreur 500 sur le serveur !

Pour information, il existe des commentaires comme en PHP :

# ceci est un commentaire

3 – Bien commencer

Créez un fichier et nommer le .htaccess (utiliser l’interface de gestion des fichiers de Dreaweaver car il est impossible de créer un fichier qui commence pas un point sous Window)

Dans un premier temps, on active le moteur de réécriture :

RewriteEngine on

Ensuite on autorise au serveur à suivre les liens symbolique du répertoire. Par défaut cette option est activé mais si vous rencontrez des problème il faut bien mettre cette ligne.

Options +FollowSymlinks

Et pour finir, nous allons définir une règle de réécriture :

Avant toutes choses, il faut préciser que ces règles de réécriture utilisent les RegExp – Régular expressions (expressions régulières)

RewriteRule ^formulaire-de-contact.html  contact.html [L]

RewriteRule permet de déclarer une nouvelle règle.
^ signifie « commence par »
formulaire-de-contact.html est ma page « virtuelle » avec un avant les points
contact.html est ma page réel « de destination »
[L] est un « flag » qui signifie « last », il faut l’utiliser lorsque vous réécrivez des pages « statiques » (cf: suite de l’exemple)

Pour résumer voici votre fichier en entier :

RewriteEngine on
Options +FollowSymlinks
RewriteRule ^formulaire-de-contact.html  contact.html [L]

Il faut ensuite placer ce fichier à la Racine de votre site.
Si vous créez un fichier contact.php (toujours à la racine de votre site)
Et que vous vous rendez sur www.server.dev/formulaire-de-contact.html vous verrez bien le contenu de la page contact.php

Chapitre 4, Les expressions régulières

1 – Présentation

Très importantes, les expressions régulières sur la base de la réécriture d’URL. Cela vous permet de «reconnaître» une chaine de caractères.

Par exemple, je souhaite récupérer toutes les URL qui sont composées qu’avec de chiffres :

1452587.html
6587413951448456784654987.html
5.html

L’expression régulière adéquate serait :

^([0-9]+).html

Ce qui reviendrait à dire :

Je recherche tous les caractères qui commencent ^ par des chiffres [0-9], tout en sachant que j’en veux au minimum un +, et qui contient .html après cette série de chiffres. Je souhaite ensuite mémoriser le résultat en mettant des parenthèses () sur les chiffres.

Ensuite pour récupérer le résultat il suffit de faire $1, si nous aurions mémorisé plusieurs résultats cela aurai donné : $1, $2, $3, etc…

2 – Les paramètres

Dans les expression régulières, certains caractères sont des « paramètres » de l’expression par exemple :
Le . (point) signifie 1 caractère
Le ? signifie zéro ou un
Le + signifie un ou plus
etc …

Si votre url contient ce genre de caractère, il faut bien penser à rajouter un anti-slashes devant :

toto+momo?.html

deviendra :

toto+momo?.html

Voici une petite liste des fonction que vous aurez besoin pour la réécriture d’URL.

. #Un caractère

? #Zéro ou un caractère

+ #Un ou plus de un caractères

( ) #Mémoriser le résultat

[ ] #Permet de rassembler plusieurs « paramètres »

[0-9] #Un caractère de 0  à 9

[a-z] #Un caractère de a à z

[a-zA-Z] #Un caractère de a à z, minuscule et majuscule

[a-zA-Z0-9] #Un caractère de a à z, minuscule et majuscule et 0 à 9

[t4-@] #Un caractère parmi les caractère t, 4, -, @

* #Tous les caractères (peut être null)

^ #Début de la chaine

$ #Fin de la chaine

[^ ] #Tout sauf

| #Signifie « ou »

Chapitre 5, Aller plus loin

1 – Les Flags

Comme nous l’avons vu précédemment, il existe des Flags(drapeaux) pour spécifier le type de règle de réécriture.

L #Last, règle unique

redirect|R[=code] #Force la redirection

forbidden|F #Force l’URL à apparaître comme interdite : forbidden

gone|G #Force l’URL à apparaître come une redirection définitive : gone

proxy|P #Force la redirection sur proxy

last|L #Arrête le traitement de réécriture

next|N #Re-exécute le traitement de réécriture

chain|C #Chaine la règle courante à la règle suivante

type|T=type-mime #Force le type MIME Force le type MIME du fichier cible à la valeur spécifiée par mime-type

nosubreq|NS #Utilisé uniquement si la requête n’est pas une sous requête interne

qsappend|QSA #Force l’ajout d’une chaîne argument de requête dans l’URL substituée à l’argument existant

passthrough|PT #Force le moteur de réécriture à renseigner le champ uri de la structure interne

skip|S=num #Saute la ou les prochaine(s) règle(s)

env|E=VAR:VAL #Force la définition d’une variable d’environnement VAR à la valeur VAL

2 – Réécrire en masse avec les expressions régulières

Nous allons maintenant voir comment réécrire des URL « en masse » car  la première technique présenté est valable pour un site possédant quelques pages mais pas pour un site ayant des pages dynamiques, sinon ce serai ingérable !

Dans notre fichier .htaccess, nous allons déclarer une nouvelle règle :

RewriteRule ^([^/]+)/page-([^/]+).html  index.php?id=$2&cat=$1 [QSA,L]

Avec cette expression nous récupérons toutes les url du type :

voitures/page-14587.html index?php?id=14587&cat=voitures
hifi/page-14.html index?php?id=14&cat=hifi
immobilier/page-784.html index?php?id=784&cat=immobilier

3 – Gérer les erreurs 404

Avec votre fichier .htaccess, vous pouvez gérer facilement les erreur 404 (page introuvable) de votre site, vous pourrez ainsi personnaliser cette page d’erreur.
Pour cela vous devez créer un fichier, que vous pouvez nommer par exemple 404.php, à la racine de votre site.
Ensuite il faut rajouter la ligne suivante dans tout en haut de votre fichier .htaccess :

ErrorDocument 404 404.php

4 – Activer PHP 5

Beaucoup d’hébergeur proposent des hébergement supportant PHP 5 mais c’est n’est pas forcément activé par défaut.
Vous pouvez activer PHP 5 en rajoutant cette ligne en haut de votre fichier .htaccess, cependant je n’ai pu  tester cette technique que chez OVH.

SetEnv PHP_VER 5

5 – Les variables d’environnement

Votre serveur peut vous retourner des informations relative au visiteur ou au referer, ce sont les variables d’environnement. Vous pouvez ainsi savoir d’où provient le visiteur et le rediriger sur une page spécifique si vous le souhaitez.

Ces variables doivent être entouré de {}, voici une petite liste :

HTTP_USER_AGENT
HTTP_REFERER
HTTP_COOKIE
HTTP_FORWARDED
HTTP_HOST
HTTP_PROXY_CONNECTION
HTTP_ACCEPT
REMOTE_ADDR
REMOTE_HOST
REMOTE_PORT
REMOTE_USER
REMOTE_IDENT
REQUEST_METHOD
SCRIPT_FILENAME
PATH_INFO
QUERY_STRING
AUTH_TYPE
DOCUMENT_ROOT
SERVER_ADMIN
SERVER_NAME
SERVER_ADDR
SERVER_PORT
SERVER_PROTOCOL
SERVER_SOFTWARE
TIME_YEAR
TIME_MON
TIME_DAY
TIME_HOUR
TIME_MIN
TIME_SEC
TIME_WDAY
TIME
API_VERSION
THE_REQUEST
REQUEST_URI
REQUEST_FILENAME
IS_SUBREQ
HTTPS

Exemple concret :

forcer le www sur un nom de domaine, le visiteur provenant de nomdomaine.fr sera redirigé vers www.nomdomaine.fr :

RewriteCond %{HTTP_HOST} !^www.mondomaine.fr [NC]
RewriteRule (.*) http://www.mondomaine.fr/$1 [QSA,R=301,L]

{HTTP_HOST} nous retourne l’hôte de l’URL par exemple :

www.nomdomaine.fr ou nomdomaine.fr

On test donc la valeur de l’hôte {HTTP_HOST},  si il est différent ! de www.nomdomaine.fr on redirige le visiteur vers http://www.nomdomaine.fr en prenant soin de rajouter la page et ses paramètre de provenance (.*) => $1

Ressources :

http://www.urlrewriting.fr
http://www.vulgarisation-informatique.com/url-rewriting.php
http://www.siteduzero.com/tutoriel-3-35836-l-url-rewriting.html

Cet article a été écrit dans le cadre d’un exposé que je devais réaliser cette année au sein de mon école (ARIES)