Transfer data from nodejs to html using socket.io

Question

I am trying to transfert data from nodejs to html using socket.io. First I tried to transfert text from nodejs to html and it works :

nodejs code :

app.post('/timer', function(req, res){                  
    res.sendFile(__dirname + '/public/status.html');
    io.emit('messageFromServer', "text");
});

html code :

<ul id="messagesList">
                    
</ul>
            <script src="/socket.io/socket.io.js"></script>
            <script>
            var socket = io();
            var list = document.getElementById("messagesList");
            socket.on('messageFromServer', function (data) {
            var item = document.createElement('li');        
            item.innerHTML = data;
            list.appendChild(item);
            });
            </script>

Text appears between ul id="messagesList" AND /ul .

Now I want to transfer variable from nodejs to html. The variable is emit from python and it works. But I can't write this variable into the html page and I don't know why.

Nodejs code : info is the variable from python.

app.post('/timer', function(req, res){                  
    res.sendFile(__dirname + '/public/status.html');
    var info = req.body;
    io.emit('messageFromServer', info);
    console.log(info)
});

When I launch the python code, the console.log(info) write : { time: '10' }

html code (the same):

            <ul id="messagesList">
            
            </ul>
            <script src="/socket.io/socket.io.js"></script>
            <script>
                var socket = io();
                var list = document.getElementById("messagesList");
                
                socket.on('messageFromServer', function (data) {
                var item = document.createElement('li');        
                item.innerHTML = data;
                list.appendChild(item);

                });
            </script>

When I launch the python code, the html write : [objet, Object], but I want : " time 10 ". How can I adapt my code ? Thanks.

===============================

Now it works with these codes : Nodejs :

app.post('/timer', function(req, res){                  
    res.sendFile(__dirname + '/public/status.html');
    var info = req.body;
    io.emit('messageFromServer', info);
    console.log(info)
});

and html :

            <ul id="messagesList">
            
            </ul>
            <script src="/socket.io/socket.io.js"></script>
            <script>
                var socket = io();
                var list = document.getElementById("messagesList");
                socket.on('messageFromServer', function (data) {
                var item = document.createElement('li'); 
                item.innerHTML = data.time;
                list.appendChild(item);
                });
            </script>

Thanks for helping me.

change `item.innerHTML = data` to `item.innerHTML = "time " + data.time`. You are assigning an object to the DOM where you need to assign a string. — shadow-lad, Apr 07 '21 at 08:45
Does this answer your question? [Converting an object to a string](https://stackoverflow.com/questions/5612787/converting-an-object-to-a-string) — derpirscher, Apr 07 '21 at 08:45

score 0 · Accepted Answer · answered Apr 07 '21 at 08:55

0

This maybe solve your problem.

item.innerHTML = data.time

answered Apr 07 '21 at 08:55

Nibia

314
1
7

Hello, Thanks for the answer. I tested with data.time, my html page writes " undefined"... – wanwan Apr 07 '21 at 10:02

Transfer data from nodejs to html using socket.io

1 Answers1