Smikkelbakje/J1B3-Sensor-boxes
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add WebSocket connection error handling and JSON in to array

Browse Source
This commit is contained in:
Dano van den Bosch
2024-03-05 13:38:09 +01:00
parent 902031cfd5
commit d127a6001d
2 changed files with 36 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
web/index.html
View File

@@ -7,7 +7,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="styles.css"> <link rel="stylesheet" href="styles.css">
<title>Node dev page</title> <title>Node dev page</title>
<link rel="icon" type="image/x-icon" href="favicon.ico"> <!-- <link rel="icon" type="image/x-icon" href="favicon.ico"> -->
</head> </head>

59
web/main.js
View File

@@ -10,6 +10,7 @@ let valueArray = [1, 2, 3, 4, 5];
let newValueArray = [4, 5, 6]; let newValueArray = [4, 5, 6];
let myValue = 1; let myValue = 1;
let intervalDelay = 50; let intervalDelay = 50;
const sendorData = [];
// const socket = new WebSocket("ws://127.0.0.1:8001"); // const socket = new WebSocket("ws://127.0.0.1:8001");
@@ -53,7 +54,14 @@ function openConnection() {
// Message handling // Message handling
socket.addEventListener("message", (event) => { socket.addEventListener("message", (event) => {
console.log('Message from server:', event.data); try {
const jsonData = JSON.parse(event.data);
// Use the parsed JSON data as needed
handleIncomingData(jsonData);
} catch (error) {
console.error("Error parsing JSON:", error);
}
}); });
// Close handling // Close handling
@@ -62,6 +70,7 @@ function openConnection() {
// Attempt to reconnect // Attempt to reconnect
setTimeout(openConnection, 1000); // Retry after 1 second setTimeout(openConnection, 1000); // Retry after 1 second
}); });
console.log("Connected to the WebSocket server!!!!!!!!");
} }
// Open the connection // Open the connection
@@ -69,34 +78,29 @@ openConnection();
function handleIncomingData(data) {
temperature = data.Temp;
humidity = data.Humi;
CO2 = data.eCO2;
TVOC = data.TVOC;
// socket.onopen = function(e) { // console.log("Temperature: ", temperature);
// alert("[open] Connection established"); // console.log("Humidity: ", humidity);
// alert("Sending to server"); // console.log("CO2: ", CO2);
// socket.send("My name is John"); // console.log("TVOC: ", TVOC);
// };
// socket.onmessage = function(event) { sendorData.push({
// // alert(`[message] Data received from server: ${event.data}`); 'temp': temperature,
// console.log("Data received from server: ", event.data); 'humi': humidity,
// }; 'CO2': CO2,
'TVOC': TVOC,
// socket.addEventListener("message", (event) => { });
// console.log(event.data); console.log(sendorData);
// });
// function openPort() {
// socket.addEventListener('open', function (event) {
// console.log('Connected to the WebSocket server');
// });
// console.log("Connected to the WebSocket server");
// }
// socket.addEventListener('message', function (event) {
// console.log('Message from server:', event.data);
// // Here you can handle the received message and update your UI accordingly
// });
if (sendorData.length >= 10) {
sendorData.shift();
}
}
function pushArray(array) { function pushArray(array) {
for (let i = 0; i < 10; i++) { for (let i = 0; i < 10; i++) {
@@ -250,3 +254,6 @@ createNodeData(1);
createNodeData(2); createNodeData(2);
createNodeData(3); createNodeData(3);
createNodeData(4); createNodeData(4);
// openConnection();