Reset intempestif de l'ESP32 à la connexion Client.

**mormic** · 08/03/2025, 11h25

Bonjour à tous
Je reviens vers vous au sujet de ma domotique basée sur un ESP32 que je fais évoluer au fil des utilisations.
Depuis quelques temps, après de nombreuses modifications, lorsque le système est démarré, tout fonctionne comme prévu en local; je veux dire sur la base du système.
Mais, si un client se connecte via la box par la WIFI, assez souvent, l'ESP32 se réinitialise et la connexion est impossible bien sûr.
Cela semble apparaître si la demande de connexion se fait peu de temps après le lancement de Chrome ou de Edge.
Apparemment, c'est au chargement du script que cela se produit. J'ai testé par Codepen le code: il ne trouve pas d'erreurs, à priori.
Le code est assez lourd et est peut-être mal foutu. J'attends vos critiques....constructives. Merci
le script:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
const DELAI_LECTURE_CAPTEURS = 120000; //3mn
const DELAI_LECTURE_BASE = 60000;    //2 mn
const DELAI_LECTURE_TEMPO = 1000;
const demandeEtatCarteBaseID= setInterval(demandeEtatCarteBase,DELAI_LECTURE_BASE);
const MAJ="Mise a jour ";
let ackno = document.getElementById("accuse");
let libelo = document.getElementById("libel");
let alConnex = document.querySelector("#connex");
let alControlH = document.querySelector("#controlH");
let alControlC = document.querySelector("#controlC");
let alControlI = document.querySelector("#controlI");
let majCapt = document.querySelector("#majenv");
let btC = document.querySelector("#boutonC");
let etatVol = [0,0,0,0,0,0,0,0,0];
let etatRelB =new Array(5);
let kb = new Array(9);          //kb[] stockage saisie clavier
let modeRelB = new Array(5);    //1 dim mode de fonctionnement relais base I/E
let modeRelD = new Array(10);   //2 dim modRelD[][] pour relais distants  dim 0-> carte 1-9  dim1-> relais 1-8
let colorRelD= new Array(10);   //2 dim couleur de fond des relais distants en fonction de leur mode
let etatRelD= new Array(10);    //2 dim conserver l'état des relais distants
let relEnTempo= new Array(10);  //2 dim relais tempo
for(let i=0;i<10;i++){
    modeRelD[i] = new Array(10);
    colorRelD[i]= new Array(10);
    etatRelD[i]= new Array(10);
    relEnTempo[i]=new Array(10);
    kb[i] = '';                 //saisie clavier écran 
    for(let j=1;j<10;j++){
        etatRelD[i][j]=false;
    }   
}
let fermeture=false;
let lectureCapteurOn=false;
let validEnvoi = false;
let finSaisie = false; 
let enSaisie = false;
let message="";
let relais, mouv;
let etape = 0;
let libel = "";
let taux = 0;
let carte = "";
let nCarte = 0;
let carteEnv = 0;
let module = "";
let nModule = 0; 
let duree = 0;
 
//****charge au load de la page
window.onload = function(){
    setTimeout(validConnexionActive,100);
};
function validConnexionActive(){
    etape = 1;
    appServeur("/API?Cmd=E&volet=A&valeur=0",ack);  //etat volets
}
//****Chargement volets
function majVolets(){
    for(let j=0; j<message.length/2;j++){
        if(message.substring(j*2,j*2+2)=="OT") etatVol[j]= 100;
        else etatVol[j]= parseInt(message.substring(j*2,j*2+2));
    }
}
function chargeEtatVolet(){
    let mescanvas = '';
    for(let i = 1; i < 10; i++) {
        mescanvas += `<div class="divParent"><span>V${i}</span><div class="position" id="v${i}"></div><span>${etatVol[i-1]}%</span></div>`;
    }
    document.getElementById('container').innerHTML = mescanvas;
    for (const taux of document.getElementsByClassName('position')) {
        let pourcent = taux.parentElement.lastChild.innerText;
        taux.style.backgroundImage = `linear-gradient(to top, yellow ${pourcent}, gray 0%)`;       
    }   //#a8eb12
}
//****Chargement inters
function chargeInterBase(valI){ //valeurs de I1 et I2
    const i1=document.getElementById("inter1");
    const i2=document.getElementById("inter2");
    const ctxI1=i1.getContext("2d");
    const ctxI2=i2.getContext("2d");
    ctxI1.font = "12px Arial";
    ctxI2.font = "12px Arial";
    if(valI.charAt(0)=="0"){
        ctxI1.fillStyle="red";
        ctxI1.fillRect(5,5,25,25);
        ctxI1.clearRect(5,30,25,25);
        ctxI1.fillStyle="black";
        ctxI1.fillText("ON",8,20);
    }
    else if(valI.charAt(0)=="3"){
        ctxI1.fillStyle="green";
        ctxI1.fillRect(5,30,25,25);
        ctxI1.clearRect(5,5,25,25);
        ctxI1.fillStyle="black";
        ctxI1.fillText("OF",10,47);
    }
    if(valI.charAt(1)=="0"){
        ctxI2.fillStyle="red";
        ctxI2.fillRect(5,5,25,25);
        ctxI2.clearRect(5,30,25,25);
        ctxI2.fillStyle="black";
        ctxI2.fillText("ON",10,20);
    }
    else if(valI.charAt(1)=="3"){
        ctxI2.fillStyle="green";
        ctxI2.fillRect(5,30,25,25);
        ctxI2.clearRect(5,5,25,25);
        ctxI2.fillStyle="black";
        ctxI2.fillText("OF",10,47);
    }   
}
//****Click sur voyant relais local
let listeRelais = document.querySelectorAll(".relais");
listeRelais.forEach(function(k){
    k.addEventListener("click", function(r){
        relais = r.target.innerHTML;
        etape = 6;
        appServeur("/API?Cmd=C&commande=B&relais=" + relais + "&mouv=G", ack);
    });                               //B=Base
});
//****Click sur relais distants
let listeDistant = document.querySelectorAll(".distant");
listeDistant.forEach(function(q){
    q.addEventListener("click",function(p){
        module = p.target.innerHTML;
        nModule=parseInt(module);
        carte = document.getElementById("carte").value; 
        if(isNaN(carte)){
            carte=prompt("Entrez le numéro de carte","de 1 - 9");
            if(isNaN(carte) || carte<1 || carte>9) return;
            document.getElementById("carte").value = carte;
            nCarte=parseInt(carte);
        }       
        if(modeRelD[nCarte][nModule]=='D'){     //r tempo
            let lUnite = prompt("Unite de la tempo:", "secondes s ou minutes m?");
            let leDelai = prompt("Quel est la temporisation?",'de 01 a 99 x unite');
            if(parseInt(leDelai) < 1 || parseInt(leDelai)>99 ){
                ackno.textContent="Erreur de saisie! Recommencez";
                return;
            }
            if(!(lUnite=='m' || lUnite=='M' || lUnite=='s' || lUnite=='S')){
                ackno.textContent="Erreur de saisie! Recommencez";
                return;
            }
            let strDelai = leDelai.padStart(2,"0");    
            libelo.textContent = "relais " + module + " carte " + carte + " ON pour " + strDelai + lUnite;
            let codeUnite= (lUnite=='s' || lUnite=='S')? 'D':'E';
            etape = 8;
            appServeur("/API?Cmd=C&commande=D&carte=" + carte + "&module=" + module + "&codeU=" + codeUnite + "&delai=" + strDelai, ack);
        }
        else{
            libelo.textContent = (modeRelD[parseInt(carte)][parseInt(module)]=='E')?    //Est-ce un poussoir?
                "Relais Poussoir " + module + " actionne" : "Relais Inter " + module + " actionne";
            mouv = (etatRelD[nCarte][nModule])? 'F':'O';
            ackno.textContent = "Action en cours " + mouv;
            etape = 7;
            appServeur("/API?Cmd=C&commande=D&carte=" + carte + "&module=" + module + "&mouv=" + mouv, ack);
        }
    });
});
//****Saisies recues du clavier en HTML
let listeBouton = document.querySelectorAll(".bb");     //tous les boutons du clavier
let kbSaisie=1;
let lUrl="";
listeBouton.forEach(function(k){
    k.addEventListener("click", function(f){
        let touche = f.target.innerHTML;
        enSaisie=true;      //debut de la saisie
        if(validEnvoi && touche=="C"){
            kb[kbSaisie] ='Z';
            finSaisie=true;
            enSaisie=false;
            btC.style.backgroundColor="cyan";
            btC.textContent='C';
         }
        else{
            kb[kbSaisie] = touche;
            document.getElementById("kb" + kbSaisie).textContent = touche;
            kbSaisie++;
            if(kbSaisie>3){
                validEnvoi=true;    //valide l'envoi par touche C
                btC.style.backgroundColor="red";
                btC.textContent="Va";
            }
        }
        if(finSaisie){
            lUrl = "/API?Cmd=";           
            switch(kb[1]){
                case '0':                       //ouverture volet
                    kb[1]='O'; 
                    etape = 2;
                    libel="Ouverture totale volet " + kb[2];
                    if(kb[3]=='0' && kb[4]=='0'){
                        libel += " de 100%";
                        taux = 100;                       
                    } 
                    else{
                        taux = parseInt(kb[3]) * 10 + parseInt(kb[4]);
                        libel += " de " + taux + "%";
                    }
                    lUrl += kb[1] + "&volet=" + kb[2] + "&valeur=" + taux.toString();
                break;
                case 'F':                        //fermeture volet 
                    etape = 3;
                    libel = "Fermeture totale volet " + kb[2];
                    taux = 0;
                    lUrl += kb[1] + "&volet=" + kb[2];
                break;
                case 'E':                       //****etat des equipements****
                    if(kb[2]=='A' && kb[3]=='0'){       //tous les volets
                        etape = 1;
                        lUrl += "E&volet=A&valeur=0";        
                    }
                    else if(kb[2]=='A' && kb[3]!='0'){  //un seul volet
                        libelo.textContent = "Etat du volet " + kb[3];
                        etape = 10;
                        lUrl += "E&volet=A&valeur=" + kb[3];
                    }
                    else if(kb[2]=='B' && kb[3]=='0'){  //tous les relais de la Base  //EB0
                        etape = 5;
                        lUrl += "E&relais=B&valeur=0";
                    }
                    else if(kb[2]=='D' &&  parseInt(kb[3])>0 && parseInt(kb[3])<=9){   //relais distants
                        libel="Etat relais carte " + kb[3];
                        etape = 9;
                        lUrl += "E&relais=D&valeur=" + kb[3];
                    }
                    else if(kb[2]=='E' && parseInt(kb[3])>=0 && parseInt(kb[3])<=9){   //capteurs d'environnement
                        libel="Etat du capteur " + kb[3];
                        etape = 11;
                        lUrl += "E&capteur=E&carte=" + kb[3];
                    }
                break;
                case 'C':   //****commande des equipements****
                    if(kb[2]=='B' && kb[3]>='1' && kb[3]<='4'){  //relais locaux kb[3]
                        let leDelai=1000;
                        etape = 6; relais=kb[3];
                        lUrl += "C&commande=B&relais=" + kb[3];
                        if(kb[4]=='0' || kb[4]=='F'){
                            libel= "Relais local " + relais + " actionne";
                            lUrl += "&mouv=G";
                        }
                        else if(kb[4]=='D' || kb[4]=='E'){
                            let t;
                            if(kb[6]=='Z') t='0' + kb[5];
                            else if(isNaN(kb[5])){
                                alert("Erreur de saisie");
                                return;
                            }
                            else t = kb[5] + kb[6];
                            let lUnite;
                            if(kb[4]=='D'){
                                lUnite='s';
                                leDelai=parseInt(t)*1000+1000;
                            }
                            else{
                                lUnite='mn';
                                leDelai=parseInt(t)*60000+1000;
                            }
                            libel= "Relais local " + relais + " actionne pendant " + t + lUnite;
                            lUrl += "&mouv=" + kb[4] + "&valeur=" + t;                          
                        }
                        else if(kb[4]=='A' || kb[4]=='B'){
                            let x = (kb[4]=='A')? 'Inter':'Telerupteur';
                            libel = "Relais " + relais + x;
                            lUrl += kb[4];
                        }
                        setTimeout(demandeEtatRelaisLocaux,leDelai);
                    }
                    else if(kb[2]=='D' && kb[6] == 'Z'){    //relais distants non temporisés
                        lUrl += "C&commande=D&carte=" + kb[3] + "&module=" + kb[4] + "&mouv=" + kb[5];
                        libel = "commutation relais " + kb[4] + " carte " + kb[3];
                        etape = 7;
                    }
                    else if(kb[2]=='D' && kb[5] != 'Z'){    //relais distants temporisés
                        if(kb[7]=='Z'){         //tempo sur 1 chiffre
                            kb[7]=kb[6]; kb[6]= '0'; duree = parseInt(kb[7]);
                            kb[8]='Z';
                        }
                        else duree = parseInt(kb[6])*10 + parseInt(kb[7]);
                        lUrl += "C&commande=D&carte=" + kb[3] + "&module=" + kb[4] +  "&mouv=" + kb[5] + "&duree=" + duree;
                        etape = 8;
                    }
                break;
                case '2':
                    if(kb[2]=='A'){           //programmation page vierge
                        libel="Programmation demandee";                                               
                        if(kb[3]=='A'){
                            document.getElementById("afficProg").click();
                            validEnvoi=false;
                        }   
                        else if(kb[3]=='B'){
                            document.getElementById("afficCapt").click();
                            validEnvoi=false;
                        }
                        else alert(kb[3] + " est incorrect");
                    }
                break;
                case '4':
                    if(kb[2]=='1'){         //****Timeout de la connexion
                        etape = 12;                        
                        lUrl +="4&param=1&valeur=" + kb[3];
                        libel = (kb[3]=='A')? "Timeout ":"Timeout " + parseInt(kb[3]) + " mn";
                    }
                    else if(kb[2]=='0' && kb[3]=='0'){    //contrôle horaire On/Of
                        etape = 13;
                        lUrl += "4&param=0";
                        libel= "Controle horaire";
                    }
                    else if(kb[2]=='4' && kb[3]=='0'){    //contrôle capteur On/Of
                        etape = 14;
                        lUrl += "4&param=4&valeur=" + kb[3];
                        libel= "Controle capteurs";
                    }
                    else if(kb[2]=='5' && kb[3]=='0'){
                        etape = 15;
                        lUrl += "4&param=5&valeur=" + kb[3];
                        libel= "Controle inters base";
                    }
                    else alert("Erreur de commande");
                break;
                default: libel="Erreur"; 
            }
            libelo.textContent = libel;
            if(validEnvoi) appServeur(lUrl, ack);
            else raz();
        }
    });  
});
//****affic texte tempo
function analyseTempo(leModule){
    libelo.textContent="relais " + leModule.toString() + " Off";
    let leBouton = document.querySelector("#rd" + leModule.toString());
    leBouton.style.backgroundColor=colorRelD[nCarte][leModule];
    etatRelD[nCarte][leModule] = false;
    ackno.textContent="Relais " + leModule.toString() + " Ok->OF";
    setTimeout(raz,2000);
}
//****MAJ équip. distants et locaux
function demandeEtatCarteBase(){
    let nCarte=document.getElementById("carte"); 
    if(!isNaN(nCarte.value)) demandeEtatRelaisDistants();
    setTimeout(demandeEtatRelaisLocaux,1000);
}
//****RAZ
function raz(){
    for(let i=1;i<9;i++){
        kb[i] = '';
        document.getElementById("kb"+i).textContent = '';
    }
    libel=""; validEnvoi=false; finSaisie=false;
    enSaisie=false;
    btC.style.backgroundColor="cyan";
    btC.textContent='C';
    libelo.textContent = '';    
    ackno.textContent = "Commande clavier active";
    kbSaisie=1;
    if(fermeture) close();
}
//****Click sur RAZ
document.getElementById("raz").addEventListener("click",function(){
    raz();
});
//****Click /touche etat relais locaux
document.getElementById("etatRel").addEventListener("click",function(){
    demandeEtatRelaisLocaux();
});
function demandeEtatRelaisLocaux(){
    etape = 5;
    appServeur("/API?Cmd=E&relais=B&valeur=0",ack); 
}
//****Click /touche etat relais distants
document.getElementById("etatRelD").addEventListener("click",function(){
    nCarte = document.getElementById("carte").value; 
    if(isNaN(nCarte)){
        nCarte = prompt("Entrez le numero de carte","de 1 à 9");
        if(isNaN(nCarte) || parseInt(nCarte)<0 || parseInt(nCarte)>9) return;
    }
    document.getElementById("carte").value = nCarte;
    demandeEtatRelaisDistants();
});
function demandeEtatRelaisDistants(){
    etape = 9;
    appServeur("/API?Cmd=E&relais=D&valeur=" + nCarte,ack);
}
//****Click /touche etat volets
document.getElementById("etatVol").addEventListener("click",function(){
    etape = 1;
    appServeur("/API?Cmd=E&volet=A&valeur=0",ack);
});
//****Click /etat des capteurs
document.getElementById("btcap").addEventListener("click",function(){
    carteEnv = document.getElementById("capteur").value;
    if(isNaN(carteEnv)){
        carteEnv = prompt("Numéro de carte?","de 0 à 9");
        if(isNaN(carteEnv) || parseInt(carteEnv)<0 || parseInt(carteEnv)>9){
            ackno.textContent="Pas de carte demandée";
            document.getElementById("capteur").value="";
            document.getElementById("tempe").textContent="";
            document.getElementById("humide").textContent="";
            document.getElementById("presse").textContent="";
            document.getElementById("lumiere").textContent="";
            return;
        }
        document.getElementById("capteur").setAttribute("value",carteEnv);
    }
    libelo.textContent = (carteEnv==0)? MAJ + "capteur base":MAJ + "capteur carte " + carteEnv;
    demandeEtatEnviron();
});
function demandeEtatEnviron(){
    if(!enSaisie){
        document.getElementById("btcap").style.backgroundColor = 'red';
        etape = 11;
        appServeur("/API?Cmd=E&capteur=E&carte=" + carteEnv,ack);
    }
}
//****MAJ auto capteurs
majCapt.addEventListener("change",function(){
    carteEnv = document.getElementById("capteur").value;
    if(majCapt.checked && isNaN(carteEnv)){
        alert("Entrez le N° de carte");
        majCapt.checked = false;
        return;
    }      
    else if(majCapt.checked){
        const idDemandeEtatEnviron = setInterval(demandeEtatEnviron, DELAI_LECTURE_CAPTEURS);
        ackno.textContent = MAJ + "capteurs auto";
    }
    else clearTimeout(demandeEtatEnviron);
});
//****envoi commande
function appServeur(url,fonction){
    let xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function(){       //attente d'une reception
        if(this.readyState==4 && this.status==200){
            message="";
            fonction(this);
        }
        else if(this.readyState && this.status==408){
            libelo.textContent = "Le serveur a rompu la liaison";
            fermeture=true;
            return; 
        }
    };
    //envoi GET Commande API dans URL -> retour ack 
    xhttp.open("GET", url, true);
    xhttp.send();
}
//****execution a l'accuse reception
function ack(xhttp){
    message=xhttp.responseText;
    if(message.substring(0,2) == "Ok"){
        message=message.substring(2);
        //libelo.textContent = message;
        switch(etape){
            case 1:         //****MAJ état de tous les volets
                ackno.textContent = MAJ  + "etat des volets";
                majVolets();
                chargeEtatVolet();
            break;
            case 2:         //****Demande d'ouverture d'un volet              
                if(message.substring(0,1)== kb[2] && message.substring(1,2)== 'O'){
                    etatVol[parseInt(kb[2])-1] = taux;     //si volet 3 -> etatVol[2] = taux 
                    chargeEtatVolet(); 
                }               
            break;
            case 3:         //****demande de fermeture d'un volet
                if(message.substring(0,1)== kb[2] && message.substring(1,2)== 'F'){
                    etatVol[parseInt(kb[2])-1] = taux;     //si volet 3 -> etatVol[2] = taux 
                    chargeEtatVolet(); 
                }
            break;
            case 4:
                if(message.substring(3)=="00"){  
                    ackno.textContent = "Volet " + message.substring(2,3) + " en Fermeture totale";
                    etatVol[kb[3]-1]=0;
                    chargeEtatVolet();
                }
                else{
                    ackno.textContent = "Volet " + message.substring(2,3) + " en ouverture de " + message.substring(3) + "%";   
                    etatVol[parseInt(kb[3])-1] = message.substring(3);
                    chargeEtatVolet();
                }   
            break;
            case 5:     //retour commande EB: MAJ relais locaux
                ackno.textContent= MAJ +"des équipements locaux ";
                let bgc="";
                for(let j=1; j<5;j++){
                    let w=message.charAt(j-1);
                    if(w=='E'){
                        modeRelB[j]='E';
                        etatRelB[j]= false;
                        bgc='orange';
                    }
                    else if(w=='O' || w=='P'){
                        modeRelB[j]= (w=='O')? 'I':'E';
                        etatRelB[j]=true;
                        bgc = 'red';
                    }
                    else if(w=='F'){
                        modeRelB[j]='I';
                        etatRelB[j]=false;
                        bgc = 'cornflowerblue';
                    }
                    document.querySelector('#r'+ j).style.backgroundColor = bgc;
                }
                let indexI=message.indexOf("I");
                chargeInterBase(message.substring(indexI+1));                 
            break;
            case 6:     //retour commande relais locaux  1 a 4 - etatRelB[1 a 4] 
                let x =""; let z="r" + relais;
                if(message.substring(0,1)== relais){
                    mouv=message.substring(1);
                    if(mouv=='O'){
                        x = "ON";
                        etatRelB[parseInt(relais)] = true;
                        document.getElementById(z).style.backgroundColor = 'red';                       
                    }
                    else if(mouv=='F'){
                        x="OFF"; 
                        etatRelB[parseInt(relais)] = false;
                        document.getElementById(z).style.backgroundColor = (modeRelB[relais]=='E')? 'orange': 'cornflowerblue';   
                    }
                    else if(mouv=='B'){
                        x = "Telerupteur";
                        modeRelB[relais] = 'E';
                        document.getElementById(z).style.backgroundColor = 'orange';
                    }
                    else if(mouv=='A'){
                        x = "Inter";
                        modeRelB[relais]='I';
                        document.getElementById(z).style.backgroundColor = 'cornflowerblue';
                    }
                }
                ackno.textContent = "Relais " + relais + ": " + x;
            break;
            case 7:     //Cmd relais distants KcrO/F
                carte  = message.substring(1,2);
                module = message.substring(2,3);
                nCarte = parseInt(carte);
                nModule = parseInt(module);
                let etat="";
                if(message.substring(3,4)=='O'){
                    etatRelD[nCarte][nModule] = true;
                    document.getElementById("rd"+module).style.backgroundColor ='red';
                    etat = "ON";
                }
                else{
                    etatRelD[nCarte][nModule] = false;
                    document.getElementById("rd" + module).style.backgroundColor = colorRelD[nCarte][nModule];
                    etat = "OFF";
                }
                document.getElementById("carte").setAttribute('value', carte);
                ackno.textContent = "Action en cours";                            
                libelo.textContent = "Relais " + module + " carte " + carte + ": " + etat;
            break;
            case 8:     //Cmd relais distants delayed
                carte  = message.substring(1,2);
                module = message.substring(2,3);
                nCarte = parseInt(carte);
                nModule = parseInt(module);
                let unite = (message.substring(3,4)=="D")? "s":"mn";
                let del = message.substring(4);
                duree = (unite=="s")? parseInt(message.substring(4))*1000:parseInt(message.substring(4))*60000;
                document.getElementById("carte").setAttribute('value', carte);
                document.querySelector("#rd"+ module).style.backgroundColor = 'red';
                etatRelD[nCarte][nModule] = true;
                relEnTempo[nCarte][nModule]=duree;                
                ackno.textContent = "Action en cours";                            
                libelo.textContent = "relais " + module  + " carte " + carte + " On pour " + del + unite;
                setTimeout(analyseTempo,duree,nModule);
            break;
            case 9:     //Etat des relais distants
                document.getElementById("carte").setAttribute('value', message.substring(0,1));
                nCarte = parseInt(message.charAt(0));
                ackno.textContent = "MAJ relais distants carte " + nCarte;               
                for(i=9;i<17;i++){
                    modeRelD[nCarte][i-8] = message.charAt(i);
                    etatRelD[nCarte][i-8] = (message.charAt(i-8)=='F')? false:true;
                    if(message.charAt(i)=='D') colorRelD[nCarte][i-8]= 'grey';
                    else colorRelD[nCarte][i-8] = (message.charAt(i)=='E')? 'orange' : 'aquamarine';
                }
                for(i=1;i<9;i++){ 
                    document.getElementById("rd" + String(i)).style.backgroundColor = (message.substring(i,i+1)=="O")? 'red':colorRelD[nCarte][i];            
                }
            break;
            case 10:
                let position='';
                let equip = message.substring(0,1);
                let state = message.substring(1);
                if(state=="00") position="Fermeture totale";
                else if(state=="OT") position="Ouverture totale";
                else position= "Ouverture a " + state + "%";
                libelo.textContent = "Etat du volet " + equip;
                ackno.textContent = position;
            break;
            case 11:
                let tempe = message.substring(10,message.indexOf('H')) + " °C";
                let humide= message.substring(message.indexOf('H')+1, message.indexOf('P')) + " %";
                let presse= message.substring(message.indexOf('P')+1,message.indexOf('L')) + " hPa";
                let lum= message.substring(message.indexOf('L')+1) + " lux";
                let cap = message.substring(6,7);
                document.getElementById("capteur").value=cap;
                document.getElementById("tempe").textContent=tempe;
                document.getElementById("humide").textContent=humide;
                document.getElementById("presse").textContent=presse;
                document.getElementById("lumiere").textContent=lum;
                document.getElementById("btcap").style.backgroundColor = 'grey';
                ackno.textContent= MAJ + "capteurs " + cap;
            break;
            case 12:
                libelo.textContent = libel;
                ackno.textContent = message;
                if(message=="On"){
                    alConnex.textContent="TimeOut dans 5 mn";
                    alConnex.style.backgroundColor="transparent";
                }
                else if(message=="Off"){
                    alConnex.textContent = "Connexion permanente";
                    alConnex.style.backgroundColor="palegoldenrod";
                }
                else{
                    alConnex.textContent="Timeout " + message;
                    alConnex.style.backgroundColor="palegoldenrod";
                }
            break;
            case 13:
                let a= "Controle horaire ";
                if(message=="ON"){
                    alControlH.textContent= a + "On";
                    alControlH.style.backgroundColor="palegreen";
                }
                 else{
                    alControlH.textContent= a + "Off";
                    alControlH.style.backgroundColor="transparent";
                }
            break;
            case 14:
                let b = "Controle capteur ";
                if(message=="ON"){
                    alControlC.textContent = b + "On";
                    alControlC.style.backgroundColor="palegoldenrod";
                }
                else{
                    alControlC.textContent = b + "Off";
                    alControlC.style.backgroundColor="transparent";
                }
 
            break;
            case 15:
                let c= "Controle inters base ";
                if(message=="ON"){
                    alControlI.textContent= c + "On";
                    alControlI.style.backgroundColor="palegreen";
                }
                else{
                    alControlI.textContent= c + "Off";
                    alControlI.style.backgroundColor="transparent";
                }
            break;        
         }
    }
    else if(message.substring(0,3) == "NOk"){ 
        if(etape==11){
            document.getElementById("tempe").textContent="";
            document.getElementById("humide").textContent="";
            document.getElementById("presse").textContent="";
        }
        ackno.textContent = "Erreur - Recommencer";
        libelo.textContent = message.substring(3);
    }
    else{
        ackno.textContent = "Erreur inconnuer";
        libelo.textContent = message;
    }
    setTimeout(raz,3000); 
}

le HTML:

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

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
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
<!DOCTYPE html>
<html lang="fr">
    <head><meta charset="utf-8">
    <title>Gestion domotique Mormic</title>
    <link rel="icon" href="data:,">
    <link href="style.css" rel="stylesheet" type="text/css"><script src="code.js" async></script>
</head><body><h2>Domotique Mormic</h2>
    <div class="boutons">
        <p>
            <button class="bb">1</button>
            <button class="bb">2</button>
            <button class="bb">3</button>
            <button class="bb">F</button>
        </p>
        <p>
            <button class="bb">4</button>
            <button class="bb">5</button>
            <button class="bb">6</button>
            <button class="bb">E</button>
        </p>
        <p>
            <button class="bb">7</button>
            <button class="bb">8</button>
            <button class="bb">9</button>
            <button class="bb">D</button>
        </p>
        <p>
            <button class="bb">A</button>
            <button class="bb">0</button>
            <button class="bb">B</button>
            <button class="bb" id="boutonC">C</button>
        </p>
    </div>
    <div id="divControl">
        <p class="control" id="connex">Timeout dans 5mn</p>
        <p class="control" id="controlH">Contrôle horaire Off</p>
        <p class="control" id="controlC">Contrôle capteur Off</p>
        <p class="control" id="controlI">Contrôle inters base Off</p>
    </div>
 
    <br>
    <div>
        <p class="resul" id="kb1"></p>
        <p class="resul" id="kb2"></p>
        <p class="resul" id="kb3"></p>
        <p class="resul" id="kb4"></p>
        <p class="resul" id="kb5"></p>
        <p class="resul" id="kb6"></p>
        <p class="resul" id="kb7"></p>
        <p class="resul" id="kb8"></p>
    </div>
    <div>
        <button id="raz">Remise a zero</button>
    </div>
    <p id="libel"></p>
    <br>
    <p id="accuse">Commande clavier active</p>
    <br>
    <button id="etatVol">Etat des volets</button>
    <br>
    <div id="container"></div>
    <br>
    <button id="etatRel">Etat des relais locaux</button>
    <div>
        <button class="relais" id="r1">1</button>
        <button class="relais" id="r2">2</button>
        <button class="relais" id="r3">3</button>
        <button class="relais" id="r4">4</button>
    </div>
    <br>
    <div>
        <button id="etatRelD">Etat des relais distants</button>
        <span>carte?</span>
        <input type="text" id="carte" maxlength="1" value="?">
    </div>
    <div>
        <button class="distant" id="rd1">1</button>
        <button class="distant" id="rd2">2</button>
        <button class="distant" id="rd3">3</button>
        <button class="distant" id="rd4">4</button>
        <button class="distant" id="rd5">5</button>
        <button class="distant" id="rd6">6</button>
        <button class="distant" id="rd7">7</button>
        <button class="distant" id="rd8">8</button>
    </div>
    <div class="cap">
        <input type="checkbox" id="majenv">
        <label for="majenv">maj auto</label>
        <button id="btcap">Etat des capteurs</button>
        <input type="text" id="capteur" maxlength="1" value="?">
        <p>Temp:</p>
        <p class="datacap" id="tempe"></p>
        <p>Humid:</p><p class="datacap" id="humide"></p>
        <p>Pression:</p><p class="datacap" id="presse"></p>
        <p>Lumiere:</p><p class="datacap" id="lumiere"></p>
    </div>
    <canvas id="inter1" width="35px" height="60px"></canvas>
    <canvas id="inter2" width="35px" height="60px"></canvas>
    <a href="/comProg" target="_blank" id="afficProg"></a>
    <a href="/comCapt" target="_blank" id="afficCapt"></a>
    </body>
</html>

Le CSS:

Code CSS :

Sélectionner tout - Visualiser dans une fenêtre à part

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
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
html{
  font-family: Arial, Helvetica, sans-serif;
  display: inline-block;
  text-align: center;
}
.boutons{
  width: 300px;
  border: 2px solid blue;
  padding: 3px;
  margin: auto;
  margin-bottom: 3px;
}
#boutonC{
  background-color: cyan;
}
.bb{
  font-size: 15px;
  padding: 10px 20px;
  margin:auto;
}
#divControl{
  position: absolute;
  border: 1px solid red;
  top: 200px;
  left: 60px;
}
.resul{
  display: inline-block;
  width: 30px;
  height: 20px;
  padding: 5px;
  border: 1px solid blue;
  margin: 2px;
}
#raz{
  position:relative;
  bottom: 60px;
  left: 280px;  
}
#libel{
  display: inline-block;
  width: 600px;
  height: 20px;
  padding: 5px;
  border: 1px solid blue;
  margin: 2px;  
}
#accuse{
display: inline-block;
padding: 5px;
border: 1px solid red;
}
.control{
  display: block;
  margin: 3px;
  border: 1px solid rgb(41, 21, 13);
  font-size: small;
  font-style: italic;
}
#inter1{
  position: absolute;
  border: 1px solid blue;
  top: 200px;
  left: 700px;
}
#inter2{
  position: absolute;
  border: 1px solid blue;
  top: 200px;
  left: 740px;
}
.titre{
  margin-bottom: 4px;
}
.divParent {
  display: inline-block;
  margin: 10px 10px;
}
.divParent div {
  width: 50px;
  height: 100px;
  border: 1px solid #000000;
  background: gray;
  text-align: center;
  vertical-align: bottom;
  display: table-cell;
}
.divParent span {
  display: inline-block;
  width: 50px;
  text-align: center;
}
.relais, .distant{
  height: 40px;
  width: 40px;
  border-radius: 20px;
  background-color:cornflowerblue;
  margin-right: 20px;
  margin-top: 5px;
  text-align: center;
}
.distant{
  background-color: aquamarine;
}
#carte{
  width: 10px;
}
span{
  font-size: 12px;
}
#capteur{
  width: 10px;
}
.cap p{
  margin-top: 20px;
  display:inline-block;
}
.datacap{
  vertical-align: middle;
  padding-top: 10px;
  width: 80px;
  height: 25px;
  border: 1px solid green;
}
#presse{
  width: 100px;
}
#majenv label{
  font-size: 6px;
}

Si la connexion Client s'établie, tout fonctionne correctement.

**mormic** · 08/03/2025, 11h55

Lorsque cela fonctionne:
Nom : AccueilDomotique.jpg
Affichages : 91
Taille : 125,9 Ko

**mormic** · 10/03/2025, 18h43

Bonjour après des heures de recherche sur le Web, j'ai enfin trouvé une solution:
En lisant sur Github:

Important recommendations for build options
Most of the crashes are caused by improper use or configuration of the AsyncTCP library used for the project. Here are some recommendations to avoid them and build-time flags you can change.

J'ai sélectionné:

CONFIG_ASYNC_TCP_RUNNING_CORE - CPU core thread affinity that runs the queue events handling and executes server callbacks. Default is ANY core, so it means that for dualcore SoCs both cores could handle server activities. If your server's code is too heavy and unoptimized or you see that sometimes server might affect other network activities, you might consider to bind it to the same core that runs Arduino code (1) to minimize affect on radio part. Otherwise you can leave the default to let RTOS decide where to run the thread based on priority

Dans le plateform.ini j'ai ajouté:

build_flags = -D CONFIG_ASYNC_TCP_RUNNING_CORE=1

Et plus de plantage.