mercredi 15 décembre 2010
Rediriger l'utilisateur vers une autre page est une action courante dans le développement web. Pour les newbies, je vous ai préparé un petit résumé de quelques techniques possibles.
Redirection HTTP (par PHP)
La plus simple, à condition d'avoir accès à un langage de programmation dynamique (sinon, voir les possibilités avec .htaccess sur Apache).
# PermanenteLa redirection est immédiate et permet autant la redirection permanente que temporaire. Par contre, cette technique ne permet pas la redirection différée.
header('Location: http://code18.blogspot.com/', true, 301);
exit;
# Temporaire
header('Location: http://code18.blogspot.com/', true, 302);
exit;
Par JavaScript
Ici, l'instuction clé est l'utilisation de window.location = url; pour une redirection immédiate. Combiné à un timer et la fonction setInterval qui rappelle continuellement la fonction à intervalles réguliers (1000 millisecondes), on pourra rediriger à une autre page ou un autre domaine après avoir attendu un nombre x de secondes (redirection différée).
var seconds = 5;Si JavaScript n'est pas activé dans le navigateur, vous êtes foutu.
var redirect = 'http://code18.blogspot.com/';
var timer;
$j = jQuery.noConflict();
$j(document).ready(function(){
timer = setInterval("countdown()", 1000);
});
function countdown(){
seconds--;
if(seconds == 0){
clearInterval(timer);
window.location = redirect;
}
}
Meta tag refresh
Celle-là, on y pense moins souvent mais elle fonctionne même si JavaScript n'est pas activé. Il permet de rafraîchir la page à intervalle régulier et permet de placer un URL qui peut être différent de celui de la page courante. À placer en entête de page, à l'intérieur de la balise <head>.
<meta http-equiv="refresh" content="5;url=http://code18.blogspot.com/">Si le nombre de secondes indiqué est 0, la redirection sera immédiate.
J'ai récemment utilisé cette technique pour montrer sur un splash page un message expliquant au visiteur que le site sera déménagé vers un nouveau domaine dans les semaines à venir. Après avoir attendu quelques secondes, le visiteur était redirigé vers le nouveau site.
Le défaut de cette technique est qu'elle ne pourra jamais être aussi efficace qu'une redirection HTTP car contrairement à cette dernière, c'est impossible de spécifier s'il s'agit d'une redirection permanente pour les engins de recherche.
Pour la fonction Javascript, pour éviter de faire de la récursivité tu peux plutôt faire :
$j(document).ready(function(){
timer = setInterval("countdown()", 1000);
});
function countdown(){
seconds--;
if(seconds == 0){
clearInterval(timer);
window.location = redirect;
}
}
Tu as raison, la dernière ligne n'était pas nécessaire. Merci d'avoir précisé.
Il faut surtout que tu remplaces le setTimeout par setInterval et clearTimeout par clearInterval ;)
Quelle bourde! En plus c'est ce que j'écrivais dans la description. Mais où avais-je la tête ?!
Question de performance, c'est plus rapide de le faire avec htaccess (ou directement dans la vHost)
Example:
Options +FollowSymLinks
RewriteEngine on
RewriteCond %{HTTP_HOST} .
RewriteCond %{HTTP_HOST} !^example\.com
RewriteRule (.*) http://example.com/$1 [R=301,L]
Bonjour,
un peu grâce à vous j'ai trouvé un truc pour rafraîchir un seul message ou page dans Blogger. Cette page est reprise à travers un iframe sur un autre blog (http://pronote-lpo-stmartin.blogspot.com/2011/01/serveur-up.html) et sert de témoin de fonctionnement de notre serveur Pronote (dont je suis le Superviseur). Voici le code (la page avec l'image de la led est rafraîchie toutes les 30 secondes)
Je ne peux pas afficher le texte ici car certaines balises ne sont pas acceptées. Voir ici:http://st-martin-basic.blogspot.com/2011/01/classapple-style-span-stylecolor-222222.html
Vous pourrez voir la "chose" en action ici (en haut à droite):
http://pronote-lpo-stmartin.blogspot.com/2011/01/serveur-up.html
Un dernier point niveau optimisation, dans un setInterval ou setTimeout, il vaut mieux passer directement une référence à la fonction plutot que le nom de la fonction sous forme de string, celà evite au javascript de devoir convertir.
c'est à dire : mieux vaut setInterval(countdown, 1000); plutot que setInterval("countdown()", 1000);
Bonjour,
Voici une redirection immédiate qui pourrait vous aider :
http://forum.forumactif.com/t327784-redirection-immediate
Bien cordialement,
Alicia