Can Node JS prompt an HTML page to change?


I'm fairly new to Node JS but have been experimenting with some AJAX using it and also trying out reading and writing files. What I'd like to know now is whether a Node JS server can tell an HTML page to change or if there must be some request from the page in order to receive information from the server about how to change.

To (hopefully) clarify: suppose I have a button with the id ajax-retrieve which when clicked asks for some information from my Node JS server:

$('#ajax-retrieve').click(function () {
        url: 'http://localhost:8124/',
        data: 'fn=open',
        dataType: "jsonp",
        cache: false,
        timeout: 5000,
        success: function(data) {
        error: function(jqXHR, textStatus, errorThrown) {
            alert('error ' + textStatus + " " + errorThrown);

On successfully receiving some data back from the server, the callback then (as you can see) logs the data in the console and puts part of it inside an element with the id input-ready. But if the request fails or times out then an alert box appears giving details of the error.

This is roughly what the server-side code looks like:

http.createServer(function (req, res) {
    "use strict";
    var queryObj = url.parse(req.url, true).query;
    queryObj.fn = queryObj.fn || '';
    queryObj.callback = queryObj.callback || '';

    if (queryObj.callback) {
        if (queryObj.fn === 'open') {
            fs.readFile('jsonp-storage-2.txt', function (err, data) {
                if (err) {
                    throw err;
                } else {
           = data;
                    res.writeHead(200, {'Content-Type': 'application/javascript'});
                    res.write(queryObj.callback + '({ fn: "' + queryObj.fn + '", save: ' + + ' })');
        } else {
            console.log('Function (fn property) not recognised.');

But what if the server needs to do something more complicated with the data before it passes it to my HTML page and what if my server's code may take some time doing that thing? Is there a way for it to chunk the returned data up and return relevant parts when it's ready or would that require separate requests from my HTML page?

Ideally, I don't want my HTML page to have to keep requesting the server for information it has already requested to see if it's ready yet. What I would like is some kind of callback so that when the server is done the HTML page receives the data it needs and changes the display accordingly? This may be a basic question but is what I've described possible?

Problem courtesy of: guypursey


You seem to be describing long polling, a technique where http connections are held open for a long time with data sent back in chunks as it is available. More generally, I think that you are really interested in server push - servers sending back data without an explicit request by the client, which long polling approximates. My favorite solution for node.js is, a library that provides a clean wrapper around server push and automatically uses a number of technologies (including long polling) based on what is available in the client browser.

Solution courtesy of: George P


Since you want to go bidirectional look into and SockJS.

Discussion courtesy of: Juho Vepsäläinen

This recipe can be found in it's original form on Stack Over Flow.