Node.js calling a function from script to update UI

Question

Here is my webserver:

var net = require('net');

var server = net.createServer(function(socket) {
    socket.write('hello\n');
    socket.write('world\n');

    //RECEIVE PACKET ON SOCKET
    socket.on('data', function(data) {
        //socket.write(data);
        //console.log(data);
        testSocketData(data)
    });
    
});

server.listen(8000);

And the method testSocketData(data) is located in file update_ui.js and does the following:

function testSocketData(test) {
    $('#p1').text(test)
}

Where #p1 refers to the id of a paragraph element in my main.html. I know that my socket is working, however I get:

ReferenceError: testSocketData is not defined.

How can I simply pass off the data received from my node.js server to the rest of my web application?

Answer 1

You must move that method(with socket.on('data') as well) from the server to the client side. When you receive a message via socket, the p1 element will update its text too.

On the server you will still need to have a socket.on('data') to receive the messages from the client.

Edit: Here is some code, a little bit changed from my comment below. On server:

function computeSomeResults(data) {
// your logic here
}
socket.on('servermsg', function(data) {
  var result = computeSomeResults(data);
  socket.emit('clientmsg', result);
});

On client:

function testSocketData(test) {
    $('#p1').text(test);
}
socket.on('clientmsg', function(data) {
  testSocketData(data);
  // emit something maybe?
}

Eventually, you may want to send something to the server:

$('#p1').on('click', function(){
  socket.emit('servermsg', $(this).text());
});