Récupérer et afficher une valeur websocket sur une page html

**mykerinos1** · 11/06/2022, 18h12

Je souhaite insérer des valeurs d'un capteur de vent en direct sur une page Html. J'opte pour cela par Node red et le node websocket. J'ai fait le test de réception en utilisant l'extension Chrome "simple websocket client" et je reçois bien mes données. Hélas je ne maîtrise pas trop javascript pour faire ressortir ces valeurs sur ma page web. Je voudrais afficher uniquement les données "wind_speed_last". comment faire ? Merci

voici mon 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
let socket = new WebSocket("ws://192.168.86.84:1880/endpoint/test");
//socket.onopen = function(e) {
    // alert("[open] Connection etablie");
    //alert("Sending to server");
//};
socket.onmessage = function (event) {
    console.log (event.data);
};
socket.onclose = function(event) {
    if (event.wasClean) {
        alert(`[close] Connection closed cleanly, code=${event.code} reason=${event.reason}`);
    } else {
        // par exemple : processus serveur arrêté ou réseau en panne
        // event.code est généralement 1006 dans ce cas
        alert('[close] Connection died');
    }
};
socket.onerror = function(error) {
    alert(`[error] ${error.message}`);
};

voici un extrait de ce qui ressort sur le log

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
index.php:36 {
    "data": {
        "did": "001D0A71121E",
        "ts": 1654941133,
        "conditions": [
            {
                "lsid": 340707,
                "data_structure_type": 1,
                "txid": 1,
                "temp": 74.5,
                "hum": 61.9,
                "dew_point": 60.6,
                "wet_bulb": 64.2,
                "heat_index": 74.9,
                "wind_chill": 74.5,
                "thw_index": 74.9,
                "thsw_index": null,
                "wind_speed_last": 3,
                "wind_dir_last": 314,
                "wind_speed_avg_last_1_min": 2.93,
                "wind_dir_scalar_avg_last_1_min": 60,
                "wind_speed_avg_last_2_min": 2.93,
                "wind_dir_scalar_avg_last_2_min": 62,
                "wind_speed_hi_last_2_min": 5,
                "wind_dir_at_hi_speed_last_2_min": 51,
                "wind_speed_avg_last_10_min": 3.37,
                "wind_dir_scalar_avg_last_10_min": null,
                "wind_speed_hi_last_10_min": 8,
                "wind_dir_at_hi_speed_last_10_min": 92,
                "rain_size": 2,
                "rain_rate_last": 0,
                "rain_rate_hi": 0,
                "rainfall_last_15_min": 0,
                "rain_rate_hi_last_15_min": 0,
                "rainfall_last_60_min": 0,
                "rainfall_last_24_hr": 0,
                "rain_storm": 0,
                "rain_storm_start_at": null,
                "solar_rad": null,
                "uv_index": null,
                "rx_state": 0,
                "trans_battery_flag": 0,
                "rainfall_daily": 0,
                "rainfall_monthly": 308,
                "rainfall_year": 943,
                "rain_storm_last": 45,
                "rain_storm_last_start_at": 1654667821,
                "rain_storm_last_end_at": 1654790460
            },
            {
                "lsid": 340706,
                "data_structure_type": 4,
                "temp_in": 79.1,
                "hum_in": 45.9,
                "dew_point_in": 56.5,
                "heat_index_in": 78.7
            },
            {
                "lsid": 340705,
                "data_structure_type": 3,
                "bar_sea_level": 30.24,
                "bar_trend": 0.003,
                "bar_absolute": 29.069
            }
        ]
    },
    "error": null
}