[AJAX] Intervalle de reload dans une page
Bonjour,
Je suis en train de coder une application qui doit afficher des informations toutes les 10s dans une page html.
J'ai donc utilisé XMLHttpRequest pour faire appel à une page php qui va chercher les informations et les renvoi sous forme d'un XML qui sera traité puis les valeurs écrits dans le html.
Le problème est que dès lors que la fonction ajax est appelée, l'intervalle de 10s n'est pas respecté. Du coup les zones sont re-loadées sans arrêt jusqu'à saturation du navigateur car au bout d'un moment, les réponses sont plus lentes que les appels.
Voici mon code. Dans le fichier html, j'appelle ma fonction comme ça:
Code:
1
2
3
4
| <script type="text/javascript" src="templates/{$TPL}/js/stats.js" /></script>
<script type="text/javascript">
setInterval("getStats()", 10000);
</script> |
Dans mon stats.js:
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
| function getStats()
{
var xhr=null;
if (window.XMLHttpRequest) {//on creer l'object ajax pour firefox
xhr = new XMLHttpRequest();
}
else if (window.ActiveXObject) //pour IE
{
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
//fonction qui va recuperer le resultat le l'appel php
xhr.onreadystatechange = function() {
if(xhr.readyState == 4 )
{
UpdateTextBox(xhr);
}
};
//on fait l'appel php
xhr.open("GET", "stats.php", true);
xhr.send(null);
}
function UpdateTextBox(xhr)
{
var docXML= xhr.responseXML;
//on declare l'objet obj et items pour le reutiliser ensuite;
var obj;
var items;
items = docXML.getElementsByTagName("nbSearch");
obj = document.getElementById("nbSearch");
obj.value = items.item(0).firstChild.data;
items = docXML.getElementsByTagName("nbInfos");
obj = document.getElementById("nbInfos");
obj.value = items.item(0).firstChild.data;
items = docXML.getElementsByTagName("nbRatios");
obj = document.getElementById("nbRatios");
obj.value = items.item(0).firstChild.data;
items = docXML.getElementsByTagName("nbXML");
obj = document.getElementById("nbXML");
obj.value = items.item(0).firstChild.data;
items = docXML.getElementsByTagName("nbGen");
obj = document.getElementById("nbGen");
obj.value = items.item(0).firstChild.data;
items = docXML.getElementsByTagName("nbTemp");
obj = document.getElementById('nbTemp');
obj.value = items.item(0).firstChild.data;
} |
Voilà. J'espère que vous pourrez me donner une astuce pour régler mon problème.
