Optimiser AJAX actualisé toute les 1500ms et bug sous IE

Répondre


Cette question est un moyen d’empêcher des soumissions automatisées de formulaires par des robots.
Smileys
:D :) :( :o :shock: :? 8-) :lol: :x :P :oops: :cry: :evil: :twisted: :roll: :wink: :!: :?: :idea: :arrow: :| :mrgreen: =D> #-o =P~ :^o :non: :priere: 8-|
Voir plus de smileys
  Revue du sujet
 

  Étendre la vue Revue du sujet : Optimiser AJAX actualisé toute les 1500ms et bug sous IE

par chrislabricole » 19 août 2008, 15:33

Oh Yeah ! :D
Merci steph29, un gros problème déjà résolu :D

Je connaissais cette méthode pour les images en cache mais je n'y avais pas pensé une seconde à faire ça pour AJAX !
Alala mais quelle idée de garder la requête AJAX en cache :roll: n'importe quoi :roll:

En fait, tu m'a juste donné l'idée ^^
J'ai jute modifié :

Code : Tout sélectionner

var date = new Date(); var timestamp = date.getTime(); var fichier = '../gtamain.php?lang=' + lang + '&tm=' + timestamp;
Et ça marche nickel :D

Bon alors maintenant, je voudrais savoir si il n'y à pas moyen d'optimiser AJAX pour qu'il s'initialise qu'une seule fois et pas à chaque fois... il me semblé que s'était possible ^o)

Merci :)

par steph29 » 19 août 2008, 15:10

tu utilise la methode GET et IE est assez idiot pour mettre les resultats en cache ...
il faut donc lui passe un parametre qui bouge.. ou passer en post :twisted:
pour le parametre qui bouge un datetime est tres approprié ;)

sinon pour la premiere question, voici ce que je t'utilise de mon coté:

Code : Tout sélectionner

<script type="text/javascript"> function send_ajax(type,fichier,data){ var xhr_object = null; if (window.XMLHttpRequest) xhr_object = new XMLHttpRequest(); else if (window.ActiveXObject) xhr_object = new ActiveXObject("Microsoft.XMLHTTP"); else { alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); return; } xhr_object.open(type, fichier, true); xhr_object.onreadystatechange = function anonymous() { if (xhr_object.readyState == 4) eval(xhr_object.responseText);}; xhr_object.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); xhr_object.send(data); } setInterval("send_ajax('post','ton_script.php')",1500); </script> <div id="result"></div>
et mon script php ecrit du js ...
en regle generale:
print 'document.getElementById("result").innerHTML="'.preg_replace(array("/\\n/","/\\r/"),"",addslashes($texte)).'";';

par chrislabricole » 18 août 2008, 12:46

Les Headers ? bah... normal je pense :P
Response Headers
Date Mon, 18 Aug 2008 10:42:54 GMT
Server Apache
X-Powered-By PHP/5.2.6
Content-Length 1521
Keep-Alive timeout=15, max=96
Connection Keep-Alive
Content-Type text/html
Request Headers
Host .......
User-Agent Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.16) Gecko/20080702 Firefox/2.0.0.16
Accept application/x-shockwave-flash,text/xml,application/xml,application/xhtml+xml,text/html;q=0.9,text/plain;q=0.8,image/png,*/*;q=0.5
Accept-Language fr,fr-fr;q=0.8,en-us;q=0.5,en;q=0.3
Accept-Encoding gzip,deflate
Accept-Charset ISO-8859-1,utf-8;q=0.7,*;q=0.7
Keep-Alive 300
Connection keep-alive
Referer ......
:x

Merci de votre aide :)

par Berzemus » 18 août 2008, 10:21

Alors, un peu de lumière. J'ai pas tout lu, mais j'espère en avoir saisi l'essence.

SetInterval() et SetTimeout sont profondément différents.

SetInterval s'utilise pour évaluer une fonction ou expression toutes les X millisecondes (à intervalles)
SetTimeout permet de retarder l'exécution d'une fonction d'une expression ou d'une fonction.

Du coup, ce qui est défini par SetInterval() va s'évaluer sans arrêt, jusqu'a appeler ClearInterval(). (il me semble avoir lu aussi que en interne, si JS est occupé au moment ou l'évaluation a lieu, son évaluation est reportée à la prochaine occurrence. Mais je ne trouve plus la source).

SetInterval à souffert de bugs à une époque, et je ne sais plus si c'est toujours d'actualité, mais son implémentation par microsoft différait des autres.

Voilà. Et sinon, comment sont les headers de la réponse du serveur ? S'il n'y est pas spécifié que le contenu à changé, ou qu'il ne faut surtout pas mettre la réponse en cache, c'est normal que ça foire.

par chrislabricole » 18 août 2008, 01:14

Arggg je l'avais pas vu celle là =D> :D

Alors bah en fait, c'est pareil...
Mozilla Firefox => Nickel
IE => rafraichi la fonction (confirmé grâce au alert(), et puis quand je sélectionne le texte, il me le déssélectionne ^^ ) mais il ne recharge pas réellement le contenu :@ Il garde le contenu renvoyé en cache de la première requête :evil:

Merci de votre aide parce-que là je sais plus quoi faire :roll:

par Invité » 17 août 2008, 22:07

Alors, pour ce qui est de setTimeout() (et non pas setinterval), c'est une fonction de décompte, qui ne se lance qu'une fois, sauf si on la rappelle bien sûr, et on la préfère à setinterval, parce qu'elle est plus compatible...
Je sais pas trop quel est le problème, essaye de chercher encore qu'est-ce qui fait planter... quel est exactement le message d'erreur... etc

par chrislabricole » 17 août 2008, 19:40

Ben je pense que c'est à cause que le setInterval soit DANS la fonction qui fait ça...
car un setInterval ne s'utilise pas dans la même fonction pour s'auto-recharger je crois...

Je pense que c'est ça qui fais planter le tout puisque le 1500 dois se diviser à chaque fois, pour arriver à une fréquence trop élevée jusqu'à que le navigateur ne gère plus (normal ^^).
On peut confirmer ma théorie ?

Sinon, pour IE, j'ai placer un alert à la fin de ma fonction, et toute les seconde j'ai bien cet alert, donc ça veut bien dire que IE recharge bien la fonction toute les 1500ms...
Mais il doit garder la page appelée par AJAX en cache :?
Comment faire pour pas qu'il la garde en cache ? :s
Je poursuis les recherches sur ça et je vous tiens au courant bien sûr ;)

par jojolapine » 17 août 2008, 18:59

A priori je voit pas, mais il faudrait mettre des alert() de debug un peu partout pour voir...
Essaye de déterminer à partir de quand ça plante?

par chrislabricole » 17 août 2008, 14:03

Voilà voilà

Code : Tout sélectionner

var temps=null; function refresh_div(lang){ var fichier = '../main.php?lang=' + lang; var xhr_object = null; try { xhr_object = new XMLHttpRequest(); } catch (microsoft){ try { xhr_object = new ActiveXObject('Msxml2.XMLHTTP'); } catch(autremicrosoft){ try { xhr_object = new ActiveXObject('Microsoft.XMLHTTP'); } catch(echec){ xhr_object = null; } } } if(xhr_object == null){ alert('Your browser cannot create XMLHttpRequest object.\nPlease Update It !'); } xhr_object.open('GET', fichier, true); xhr_object.onreadystatechange = function(){ if (xhr_object.readyState == 4 && xhr_object.status == 200) { document.getElementById('refresh_zone').innerHTML = xhr_object.responseText; } } xhr_object.send(null); temps=setTimeout('refresh_div(\''+lang+'\')',1500); }
et mon onload

Code : Tout sélectionner

onload="refresh_div('fr');"
Je me suis gouré quelque pars ? :P

par jojolapine » 17 août 2008, 13:57

Hum hum...
Comment se fesse? je l'ai déjà utilisé, ça fonctionne bien, tu doit avoir un problème quelque part :?
Montre nous le code concerné...

par chrislabricole » 17 août 2008, 13:35

COMET ? :shock:
Tu m'a appris un truc là ^^

J'ai cherché sur Google mais je trouve que des trucs HS et quand je cherche "tuto comet" bah... y'a pas de tuto vraiment tuto en fait :P
j'ai juste trouvé ça, mais y'a du flash, ça me fais un peu peur :?

Voilà :)
Mon application c'est un site qui est dédié au mon serveur GTAsa (MTA) et ce site se connecte au serveur avec PHP pour récupérer les pseudos des joueurs en ligne, le ping etc...

Merci :)

PS: je vais essayer ta solution jojolapine :)
EDIT: Eum... ta solution commence à faire ramer le navigateur puis le fait planter :?

par Berzemus » 17 août 2008, 11:07

Coucou,

J'aimerais bien avoir une appli qui a besoin d'être réactualisé sans arrêt. Mais pourquoi en fait ? Tu dois récuperer des infos ? Parce qu'alors, a ta place, j'essayerais de mettre en place du COMET, dont je parle ici:
http://www.phpfrance.com/forums/voir_su ... -comet.php

Mais je cherche toujours à en faire une application réelle (pas d'opportunités pour le moment..)
Tu pourrais tenter le coup ? :wink:

par jojolapine » 17 août 2008, 10:43

Bonjour,
moi quand j'avais à faire ce genre de choses, je faisait toujorus appel à setTimeout() de cette manière:

Code : Tout sélectionner

var temps=null; function quirafraichit(){ //code ... temps=setTimeout('quirafraichit()',1500); }
dans le onload, tu as juste à appelé quirafraichit() sans se poser de question, et pour arrêté le rafraichissement:

Code : Tout sélectionner

clearTimeout(temps);
Voilà je croit que c'est ce qu'il y a de plus compatible avec tout les navigateurs!

Optimiser AJAX actualisé toute les 1500ms et bug sous IE

par chrislabricole » 17 août 2008, 00:41

Bonsoir !

Alors, je vais vous parler du premier problème (peut-être pas, c'est surtout une question :) )
J'ai une petite application qui demande à être actualisée toute les 1500ms et à chaque fois que j'appelle la fonction, il reconstruit l'objet AJAX, il me semble avoir entendu que l'on ai pas obligé de le reconstruire à chaque fois... histoire de gagner de la légèreté chez le client :)
Voilà le code :

Code : Tout sélectionner

function refresh_div(lang){ var fichier = '../main.php?lang=' + lang; var xhr_object = null; try { xhr_object = new XMLHttpRequest(); } catch (microsoft){ try { xhr_object = new ActiveXObject('Msxml2.XMLHTTP'); } catch(autremicrosoft){ try { xhr_object = new ActiveXObject('Microsoft.XMLHTTP'); } catch(echec){ xhr_object = null; } } } if(xhr_object == null){ alert('Your browser cannot create XMLHttpRequest object.\nPlease Update It !'); } xhr_object.open('GET', fichier, true); xhr_object.onreadystatechange = function(){ if (xhr_object.readyState == 4 && xhr_object.status == 200) { document.getElementById('refresh_zone').innerHTML = xhr_object.responseText; } } xhr_object.send(null); }
Et dans mon onload HTML j'ai :

Code : Tout sélectionner

onload="refresh_div('fr');setInterval('refresh_div(\'fr'\')',1500);"
Voilà, je vois pas trop comment procédé pour faire cette petite optimisation si c'est possible :)

Après, le deuxième problème est avec IE (bah oui, évidement :/ )
C'est que ce navigateur charge une fois l'objet AJAX, en fait, il ignore le setInterval()...
Je sais pas si ça a un rapport avec ma première question mais bon...
Et aussi, le pire, c'est quand on recharge la page, il garde quand même les résultats de la requête d'avant... obligé de vider le cache pour qu'il refasse la requête :roll:
Savez-vous d'où cela peut venir ? :P

Merci d'avance de vos indications :)