You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
69 lines
2.5 KiB
69 lines
2.5 KiB
// Correct led start state. Changed all new led bits to prefix new...
|
|
void handleRoot(AsyncWebServerRequest *request) {
|
|
|
|
request->send(200, "text/html", R"HTML(
|
|
<!DOCTYPE html>
|
|
<html>
|
|
<head><meta name='viewport' content='width=device-width, initial-scale=1.0'>
|
|
</head>
|
|
<body>
|
|
<h1>ESP32 Websocket Example - Client to Server</h1>
|
|
<h2>With LED status update.</h2>
|
|
<button onclick='toggleLED()'>Toggle LED</button>
|
|
<p>LED Status: <span id='ledStatus'></span></p>
|
|
<button onclick='toggleLED2()'>Toggle LED2</button>
|
|
<p>LED Status: <span id='ledStatus2'></span></p>
|
|
<p>Count:<span id="countData">0:00</span></p>
|
|
<p>Count:<span id="countData1">0:00</span></p>
|
|
<p><span id='message'></span></p>
|
|
<br clear="all">
|
|
|
|
<script>
|
|
var webSocket;
|
|
connectWebSocket();
|
|
function connectWebSocket() {
|
|
webSocket = new WebSocket('ws://' + window.location.hostname + '/ws');
|
|
|
|
webSocket.onopen = function(event) {//реакция на подключение вебсекета
|
|
console.log('WebSocket connected');
|
|
};
|
|
|
|
webSocket.onmessage = function(event) {//реакция на данные
|
|
var data = JSON.parse(event.data);//
|
|
if (data.label === 'ledStatus') {
|
|
document.getElementById('ledStatus').innerHTML = data.value;
|
|
}
|
|
if (data.label2 === 'ledStatus2') {
|
|
document.getElementById('ledStatus2').innerHTML = data.value;
|
|
}
|
|
if (data.label3 === 'count1') {
|
|
document.getElementById("countData1").innerHTML = data.value;
|
|
};
|
|
if (data.label3 === 'count') {
|
|
document.getElementById("countData").innerHTML = data.value;
|
|
};
|
|
|
|
}
|
|
webSocket.onclose = function(event) {//реакция на отключение вебсекета
|
|
console.log('WebSocket disconnected');
|
|
var messageElement = document.getElementById('message');
|
|
messageElement.innerHTML ='WebSocket disconnected. Reconnecting...';
|
|
setTimeout(connectWebSocket, 2000);
|
|
setTimeout(function() { messageElement.innerHTML = ''; }, 5000);
|
|
};
|
|
webSocket.onerror = function(event) {
|
|
console.error('WebSocket error:', event);
|
|
};
|
|
}
|
|
function toggleLED() {
|
|
webSocket.send('toggle');
|
|
}
|
|
function toggleLED2() {//функция на нажатие кнопки
|
|
webSocket.send('toggle2');
|
|
}
|
|
|
|
</script>
|
|
</body>
|
|
</html>
|
|
)HTML");
|
|
} // END OF void handleRoot(AsyncWebServerRequest *request)
|
|
|