Si vous avez deux versions de votre site, une desktop et une autre mobile, vous voudrez probablement qu'un
utilisateur sur mobile soit automatiquement redirigé vers la version adaptée.
Cette configuration peut être définie au niveau de vos virtualhost.
Cas basique
Imaginons que vous ayez deux virtualhost basiques, un pour chaque version.
Site desktop
<VirtualHost *:80>
DocumentRoot /var/www/site_desktop
ServerName www.mon-site.com
<Directory /var/www/site_desktop>
Options FollowSymLinks
Order allow,deny
allow from all
</Directory>
</VirtualHost>
Site mobile
<VirtualHost *:80>
DocumentRoot /var/www/site_mobile
ServerName m.mon-site.com
<Directory /var/www/site_mobile>
Options FollowSymLinks
Order allow,deny
allow from all
</Directory>
</VirtualHost>
Si vous voulez rediriger un utilisateur qui accède au site desktop via son mobile, vers le site mobile,
le premier virtualhost deviendra :
<VirtualHost *:80>
DocumentRoot /var/www/site_desktop
ServerName www.mon-site.com
<IfModule mod_rewrite.c>
RewriteEngine on
# Si le client est un navigateur mobile
RewriteCond %{HTTP_USER_AGENT} mobi [NC]
# Redirection vers le site mobile
RewriteRule ^(.*)$ http://m.mon-site.com [R=301,L]
</IfModule>
<Directory /var/www/site_desktop>
Options FollowSymLinks
Order allow,deny
allow from all
</Directory>
</VirtualHost>
Explications :
- Si le module de réécriture d'Apache est présent, on l'active
- Si le nom du navigateur (
HTTP_USER_AGENT
) contient la chaîne mobi
, on applique la règle de redirection,
vers le site mobile
Remarque :
Vous pouvez bien sûr faire l'inverse (mobile vers desktop), en ajoutant un !
:
<VirtualHost *:80>
DocumentRoot /var/www/site_mobile
ServerName m.mon-site.com
<IfModule mod_rewrite.c>
RewriteEngine on
# Si le client n'est pas un navigateur mobile
RewriteCond %{HTTP_USER_AGENT} !mobi [NC]
# Redirection vers le site desktop
RewriteRule ^(.*)$ http://www.mon-site.com [R=301,L]
</IfModule>
<Directory /var/www/site_mobile>
Options FollowSymLinks
Order allow,deny
allow from all
</Directory>
</VirtualHost>
Règles supplémentaires
Selon votre architecture ou vos besoins, vous serez sans doute amené à ajouter d'autres conditions (RewriteCond
) avant
la règle de réécriture (RewriteRule
) :
# 1. Si le client n'est pas sur iPad
RewriteCond %{HTTP_USER_AGENT} !ipad [NC]
# 2. Si le nom de domaine appelé ne commence pas par "m."
RewriteCond %{HTTP_HOST} !^m\..*
# 3. Si l'URL demandée ne commence pas par "/api/mobile/"
RewriteCond %{REQUEST_URI} !(/api/mobile/)
Explications :
- Les iPad ayant une résolution importante, il peut être préférable de conserver la version desktop pour leurs utilisateurs.
Vous pouvez également ajouter d'autres tablettes :
!ipad|tablet [NC]
.
Plus d'informations sur le site Mozilla.
- Si vous avez un serveur apache en frontal, qui gère les deux noms de domaine (mon-site.com et m.mon-site.com) dans un
seul virtualhost, vous aurez besoin de cette ligne pour éviter une boucle de redirection infinie.
- Si votre site desktop fournit des webservices à votre site mobile qui les consomme en AJAX,
il ne faut pas que les requêtes en question soient redirigées.
Laisser le choix à l'utilisateur
En général, un site mobile ne propose pas toutes les fonctionnalités du site desktop.
De plus, en fonction de la taille de l'appareil de l'utilisateur, ce dernier peut préférer utiliser le site desktop.
L'idéal est de proposer un lien vers la version desktop sur le site mobile (éventuellement l'inverse).
Le problème, c'est qu'avec les règles de redirection définies précédemment, l'utilisateur sera automatiquement
redirigé en cliquant sur le lien.
Une solution est d'ajouter un paramètre à l'url, et de stocker l'information en cookie.
Le lien depuis le site mobile vers le site desktop aura par exemple pour URL http://www.mon-site?mobile=0
.
Pour cela, la règle concernant la redirection doit être améliorée :
<IfModule mod_rewrite.c>
RewriteEngine on
# Si l'URL contient le paramètre 'mobile', égal à 1
RewriteCond %{QUERY_STRING} (^|&)mobile=1(&|$)
# On ajoute un cookie
RewriteRule ^ - [CO=mobile:1:%{HTTP_HOST}]
# Si l'URL contient le paramètre 'mobile', égale à 0
RewriteCond %{QUERY_STRING} (^|&)mobile=0(&|$)
# On ajoute un cookie
RewriteRule ^ - [CO=mobile:0:%{HTTP_HOST}]
# Si l'URL contient le paramètre 'mobile', égale à 1
RewriteCond %{QUERY_STRING} (^|&)mobile=0(&|$)
# On saute la prochaine RewriteRule
RewriteRule ^ - [S=1]
# Si le client est un navigateur mobile
RewriteCond %{HTTP_USER_AGENT} mobi [NC]
# Si le cookie n'est pas égal à 0
RewriteCond %{HTTP:Cookie} !\mobile=0(;|$)
# Redirection vers le site desktop
RewriteRule ^(.*)$ http://m.mon-site.com [R=301,L]
</IfModule>