How Can I Refresh A Page For All Logged In Users (collaborative Editing) Using Javascript, Jquery And Html?

I want the action to be automatically reflected for all the logged in users.

Solution 1:

You may want to use XMLHttpRequest to poll the server every few seconds or so. Then the server can respond with instructions to the browsers of all users visiting your site (or a selected few) in near real-time.

You may also want to consider long polling instead of the above, to reduce the latency without increasing the frequency of the polls.

Quoting Comet Daily: The Long-Polling Technique:

The long-polling Comet technique is a technique that optimizes traditional polling to reduce latency.

Traditional polling sends an XMLHttpRequest to the server in fixed intervals. For example, open a new XMLHttpRequest every 15 seconds, receive an immediate response, and close the connection.

Long-polling sends a request to the server, but a response is not returned to the client until one is available. As soon as the connection is closed, either due to a response being received by the client or if a request times out, a new connection is initiated. The result is a significant reduction in latency because the server usually has a connection established when it is ready to return information to return to the client.

In addition to the above, I also suggest that you check out the accepted answer to the following Stack Overflow post for a detailed description of the long polling technique:

• How does facebook, gmail send the real time notification?