Update static/index.html
Browse files- static/index.html +10 -39
static/index.html
CHANGED
@@ -65,74 +65,45 @@
|
|
65 |
const statusDiv = document.getElementById('status');
|
66 |
const logsList = document.getElementById('logs');
|
67 |
let ws;
|
68 |
-
|
69 |
function addLog(message) {
|
70 |
const li = document.createElement('li');
|
71 |
li.textContent = `[${new Date().toLocaleTimeString()}] ${message}`;
|
72 |
logsList.appendChild(li);
|
73 |
logsList.scrollTop = logsList.scrollHeight; // Auto-scroll
|
74 |
}
|
75 |
-
|
76 |
function connect() {
|
|
|
77 |
const protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:';
|
78 |
const wsUrl = `${protocol}//${window.location.host}/ws`;
|
79 |
ws = new WebSocket(wsUrl);
|
80 |
-
|
81 |
ws.onopen = function() {
|
82 |
statusDiv.textContent = 'Connecté';
|
83 |
statusDiv.className = 'connected';
|
84 |
addLog('Connexion WebSocket établie.');
|
85 |
};
|
86 |
-
|
87 |
ws.onmessage = function(event) {
|
88 |
-
|
89 |
-
|
90 |
-
|
91 |
-
|
92 |
-
|
93 |
-
|
94 |
-
|
95 |
-
switch (message.action) {
|
96 |
-
case "get_sentence":
|
97 |
-
responsePayload = "Ceci est la phrase de réponse du client JavaScript.";
|
98 |
-
break;
|
99 |
-
case "reverse_string":
|
100 |
-
responsePayload = (message.data || "").split('').reverse().join('');
|
101 |
-
break;
|
102 |
-
default:
|
103 |
-
responsePayload = "Action inconnue.";
|
104 |
-
break;
|
105 |
-
}
|
106 |
-
|
107 |
-
// Construit la réponse JSON incluant l'ID de la requête
|
108 |
-
const response = {
|
109 |
-
request_id: message.request_id,
|
110 |
-
response: responsePayload
|
111 |
-
};
|
112 |
-
|
113 |
-
addLog(`Envoi de la réponse : "${response.response}"`);
|
114 |
-
ws.send(JSON.stringify(response));
|
115 |
-
|
116 |
-
} catch (error) {
|
117 |
-
addLog("Erreur: Impossible de traiter le message du serveur.");
|
118 |
-
console.error("Erreur de parsing JSON:", error);
|
119 |
-
}
|
120 |
};
|
121 |
-
|
122 |
ws.onclose = function() {
|
123 |
statusDiv.textContent = 'Déconnecté';
|
124 |
statusDiv.className = 'disconnected';
|
125 |
addLog('Connexion WebSocket fermée. Tentative de reconnexion dans 3 secondes...');
|
|
|
126 |
setTimeout(connect, 3000);
|
127 |
};
|
128 |
-
|
129 |
ws.onerror = function(error) {
|
130 |
addLog('Erreur WebSocket.');
|
131 |
console.error('WebSocket Error:', error);
|
132 |
ws.close();
|
133 |
};
|
134 |
}
|
135 |
-
|
136 |
connect();
|
137 |
</script>
|
138 |
|
|
|
65 |
const statusDiv = document.getElementById('status');
|
66 |
const logsList = document.getElementById('logs');
|
67 |
let ws;
|
|
|
68 |
function addLog(message) {
|
69 |
const li = document.createElement('li');
|
70 |
li.textContent = `[${new Date().toLocaleTimeString()}] ${message}`;
|
71 |
logsList.appendChild(li);
|
72 |
logsList.scrollTop = logsList.scrollHeight; // Auto-scroll
|
73 |
}
|
|
|
74 |
function connect() {
|
75 |
+
// Adapte le protocole (ws ou wss pour le sécurisé)
|
76 |
const protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:';
|
77 |
const wsUrl = `${protocol}//${window.location.host}/ws`;
|
78 |
ws = new WebSocket(wsUrl);
|
|
|
79 |
ws.onopen = function() {
|
80 |
statusDiv.textContent = 'Connecté';
|
81 |
statusDiv.className = 'connected';
|
82 |
addLog('Connexion WebSocket établie.');
|
83 |
};
|
|
|
84 |
ws.onmessage = function(event) {
|
85 |
+
const messageFromServer = event.data;
|
86 |
+
addLog(`Message reçu du serveur : "${messageFromServer}"`);
|
87 |
+
|
88 |
+
// C'est ici que le client répond automatiquement
|
89 |
+
const responsePhrase = "Ceci est la phrase de réponse du client JavaScript.";
|
90 |
+
addLog(`Envoi de la réponse automatique : "${responsePhrase}"`);
|
91 |
+
ws.send(responsePhrase);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
92 |
};
|
|
|
93 |
ws.onclose = function() {
|
94 |
statusDiv.textContent = 'Déconnecté';
|
95 |
statusDiv.className = 'disconnected';
|
96 |
addLog('Connexion WebSocket fermée. Tentative de reconnexion dans 3 secondes...');
|
97 |
+
// Tente de se reconnecter après 3 secondes
|
98 |
setTimeout(connect, 3000);
|
99 |
};
|
|
|
100 |
ws.onerror = function(error) {
|
101 |
addLog('Erreur WebSocket.');
|
102 |
console.error('WebSocket Error:', error);
|
103 |
ws.close();
|
104 |
};
|
105 |
}
|
106 |
+
// Lance la connexion au chargement de la page
|
107 |
connect();
|
108 |
</script>
|
109 |
|