setInterval qui s'emballe...

1 réponse
Avatar
Une Bévue
qqc qui je ne pige pas à propos de clearInterval / setInterval.

j'utilise ça pour me reconnecter à un WebSocket qui, lorsque j'édite le
code du server, ferme la connection.

basiquement je fais un :

window.timerID=window.setInterval(startWebSocket, 5000);

quand j'ai l'événement close du socket.

à l'évenement 'open' du socket je "clear" l'interval :

window.clearInterval(window.timerID);


quand le server ferme la connection, j'ai donc un événement 'close' qui
actionne donc mon setInterval.

déjà, là, ça ne marche pas correcetement, car l'intervale de 5 s n'est
pas respecté :
09:50:38.283 disconnected
09:50:43.318 disconnected
09:50:48.319 disconnected
09:50:48.371 disconnected
09:50:53.323 disconnected
09:50:53.373 disconnected
09:50:53.420 disconnected
09:50:53.467 disconnected
09:50:58.323 disconnected
09:50:58.392 disconnected
09:50:58.421 disconnected
09:50:58.490 disconnected
09:50:58.549 disconnected
09:50:58.605 disconnected
09:50:58.632 disconnected
(09:50:58.632 => heure 09 minutes 50 secondes 58 et 632 milliseconds)

pourtant dans mon code j'ai ajouté des "event.stopPropagation()".


MAIS, c'est PIRE quand je reconnecte mon serveur :
09:50:58.668 connected, timerSet = true
09:50:58.668 timerID: 19 cleared
09:51:03.315 connected, timerSet = false
09:51:03.395 connected, timerSet = false
09:51:03.462 connected, timerSet = false
09:51:03.498 connected, timerSet = false
09:51:03.592 connected, timerSet = false
09:51:03.629 connected, timerSet = false
09:51:03.659 connected, timerSet = false
09:51:03.685 connected, timerSet = false
09:51:03.707 connected, timerSet = false
09:51:03.729 connected, timerSet = false
09:51:03.806 connected, timerSet = false
09:51:03.876 connected, timerSet = false
09:51:03.925 connected, timerSet = false
09:51:03.999 connected, timerSet = false
09:51:08.307 connected, timerSet = false
09:51:08.404 connected, timerSet = false
09:51:08.437 connected, timerSet = false
09:51:08.529 connected, timerSet = false
09:51:08.615 connected, timerSet = false
09:51:08.645 connected, timerSet = false
09:51:08.735 connected, timerSet = false
09:51:08.767 connected, timerSet = false
09:51:08.877 connected, timerSet = false
09:51:08.911 connected, timerSet = false
09:51:09.028 connected, timerSet = false


le code complet:
<html>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<head>
<title>Timer TEST</title>
</head>
<script>
var timerID;
var timerSet;
var disconnected=true;
(function(){
var socket;
var demo;
var msg;
var error;
window.addEventListener('load',
function(event){
demo=document.getElementById('demo');
msg=document.getElementById('msg');
stop=document.getElementById("stop");
stop.addEventListener('click',stopWebSocket,false);
start=document.getElementById("start");
start.addEventListener('click',startWebSocket,false);
send=document.getElementById("send");
send.addEventListener('click',function(event){
var o={database: 'landp-test', collection: 'categories',
mode: 'FIND'};
var json=JSON.stringify(o);
msg.innerHTML+=timeStamp()+" Sending:
"+JSON.stringify(o)+"<br />";
socket.send(json);
},false);

startWebSocket();

}
, false);
window.addEventListener('unload',
function(event){
stopWebSocket();
}
, false);
function startWebSocket(){
if(disconnected){
socket=new WebSocket("wss://localhost:54321", 'ssl');
socket.addEventListener("open", function(event){
demo.innerHTML+=timeStamp()+" connected, disconnected =
"+disconnected+"<br />";
if(disconnected){
if(timerSet){
demo.innerHTML+=timeStamp()+" timerID: "+timerID+"
cleared<br />";
window.clearInterval(window.timerID);
timerSet=false;
}
disconnected=false;
}
event.stopPropagation();
});
socket.addEventListener("message", function(event){
var o=JSON.parse(event.data);
msg.innerHTML+=timeStamp()+" Receiving:
"+JSON.stringify(o)+"<br />";
});
socket.addEventListener("error", function(event){
console.Log(timeStamp()+" Error");
event.stopPropagation();
});
socket.addEventListener("close", function(event){
demo.innerHTML+=timeStamp()+" disconnected<br />";
disconnected=true;
timerSet=true;
event.stopPropagation();
window.timerID=window.setInterval(startWebSocket, 5000);
});
}
}
function stopWebSocket(){
demo.innerHTML+=timeStamp()+" closing<br />";
socket.close();
}
function timeStamp(){
var t='';
var d=new Date();
var h=d.getHours();
t+=(h<10)? "0"+h:h;
var m=d.getMinutes();
t+=(m<10)? ":0"+m:":"+m;
var s=d.getSeconds();
t+=(s<10)? ":0"+s:":"+s;
var ms=d.getMilliseconds();
t+=(ms<10)? ".00"+ms : ((ms<100)? ".0"+ms:"."+ms);
return t;
}
}());
</script>
<body>
<p id="demo">Demo:<br /></p>
<p id="msg">Message:<br /></p>
<button id="stop">Stop</button>
<button id="start">Start</button>
<button id="send">Send</button>
</body>
</html>

1 réponse

Avatar
Une Bévue
Le 15/12/2013 10:12, Une Bévue a écrit :
qqc qui je ne pige pas à propos de clearInterval / setInterval.

j'utilise ça pour me reconnecter à un WebSocket qui, lorsque j'édite le
code du server, ferme la connection.

basiquement je fais un :

window.timerID=window.setInterval(startWebSocket, 5000);

quand j'ai l'événement close du socket.

à l'évenement 'open' du socket je "clear" l'interval :

window.clearInterval(window.timerID);


quand le server ferme la connection, j'ai donc un événement 'close' qui
actionne donc mon setInterval.

déjà, là, ça ne marche pas correcetement, car l'intervale de 5 s n'est
pas respecté :
09:50:38.283 disconnected
09:50:43.318 disconnected
09:50:48.319 disconnected
09:50:48.371 disconnected
09:50:53.323 disconnected
09:50:53.373 disconnected
09:50:53.420 disconnected
09:50:53.467 disconnected
09:50:58.323 disconnected
09:50:58.392 disconnected
09:50:58.421 disconnected
09:50:58.490 disconnected
09:50:58.549 disconnected
09:50:58.605 disconnected
09:50:58.632 disconnected
(09:50:58.632 => heure 09 minutes 50 secondes 58 et 632 milliseconds)

pourtant dans mon code j'ai ajouté des "event.stopPropagation()".


MAIS, c'est PIRE quand je reconnecte mon serveur :
09:50:58.668 connected, timerSet = true
09:50:58.668 timerID: 19 cleared
09:51:03.315 connected, timerSet = false
09:51:03.395 connected, timerSet = false
09:51:03.462 connected, timerSet = false
09:51:03.498 connected, timerSet = false
09:51:03.592 connected, timerSet = false
09:51:03.629 connected, timerSet = false
09:51:03.659 connected, timerSet = false
09:51:03.685 connected, timerSet = false
09:51:03.707 connected, timerSet = false
09:51:03.729 connected, timerSet = false
09:51:03.806 connected, timerSet = false
09:51:03.876 connected, timerSet = false
09:51:03.925 connected, timerSet = false
09:51:03.999 connected, timerSet = false
09:51:08.307 connected, timerSet = false
09:51:08.404 connected, timerSet = false
09:51:08.437 connected, timerSet = false
09:51:08.529 connected, timerSet = false
09:51:08.615 connected, timerSet = false
09:51:08.645 connected, timerSet = false
09:51:08.735 connected, timerSet = false
09:51:08.767 connected, timerSet = false
09:51:08.877 connected, timerSet = false
09:51:08.911 connected, timerSet = false
09:51:09.028 connected, timerSet = false


le code complet:
<html>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<head>
<title>Timer TEST</title>
</head>
<script>
var timerID;
var timerSet;
var disconnected=true;
(function(){
var socket;
var demo;
var msg;
var error;
window.addEventListener('load',
function(event){
demo=document.getElementById('demo');
msg=document.getElementById('msg');
stop=document.getElementById("stop");
stop.addEventListener('click',stopWebSocket,false);
start=document.getElementById("start");
start.addEventListener('click',startWebSocket,false);
send=document.getElementById("send");
send.addEventListener('click',function(event){
var o={database: 'landp-test', collection: 'categories',
mode: 'FIND'};
var json=JSON.stringify(o);
msg.innerHTML+=timeStamp()+" Sending:
"+JSON.stringify(o)+"<br />";
socket.send(json);
},false);

startWebSocket();

}
, false);
window.addEventListener('unload',
function(event){
stopWebSocket();
}
, false);
function startWebSocket(){
if(disconnected){
socket=new WebSocket("wss://localhost:54321", 'ssl');
socket.addEventListener("open", function(event){
demo.innerHTML+=timeStamp()+" connected, disconnected > "+disconnected+"<br />";
if(disconnected){
if(timerSet){
demo.innerHTML+=timeStamp()+" timerID: "+timerID+"
cleared<br />";
window.clearInterval(window.timerID);
timerSetúlse;
}
disconnectedúlse;
}
event.stopPropagation();
});
socket.addEventListener("message", function(event){
var o=JSON.parse(event.data);
msg.innerHTML+=timeStamp()+" Receiving:
"+JSON.stringify(o)+"<br />";
});
socket.addEventListener("error", function(event){
console.Log(timeStamp()+" Error");
event.stopPropagation();
});
socket.addEventListener("close", function(event){
demo.innerHTML+=timeStamp()+" disconnected<br />";
disconnected=true;
timerSet=true;
event.stopPropagation();
window.timerID=window.setInterval(startWebSocket, 5000);
});
}
}
function stopWebSocket(){
demo.innerHTML+=timeStamp()+" closing<br />";
socket.close();
}
function timeStamp(){
var t='';
var d=new Date();
var h=d.getHours();
t+=(h<10)? "0"+h:h;
var m=d.getMinutes();
t+=(m<10)? ":0"+m:":"+m;
var s=d.getSeconds();
t+=(s<10)? ":0"+s:":"+s;
var ms=d.getMilliseconds();
t+=(ms<10)? ".00"+ms : ((ms<100)? ".0"+ms:"."+ms);
return t;
}
}());
</script>
<body>
<p id="demo">Demo:<br /></p>
<p id="msg">Message:<br /></p>
<button id="stop">Stop</button>
<button id="start">Start</button>
<button id="send">Send</button>
</body>
</html>





Le problème provenait du fait que le <ebsocket envoyait plusieurs event
close.
donc mon script créait plusieurs setInterval, et quand j'étais connecté,
je ne faisais un clearInterval que sur le dernier.

j'ai changé ça, maintenant, avant de lancer un nouveau setInterval je
fais un clear sur le précédent...