How to Keep track of tab opened from the main page?

Question

I'm new to web development and I'm finding my way through it.

I have the following situation:

User Logs into the web-app. He/She will be presented with four different module links on his console.

When userA clicks on one of the links , a new TAB will be opened and allows userA to make changes/work/ in that module. When userA is working on that particular module, it will be checked-out to UserA, and all other users will see that UserA is accessing the module on their consoles and inaccessible to all others.

Now, when user closes/logs-out of the module(tab), the status of the module in all the user consoles should be changed to "accessible".

I choose MEAN stack to implement this application.

Question:

How to handle the situation:

When user closes/logs-out of the module(tab), the status of the module in all the user consoles should be changed to "accessible".

How to keep track of the tab opened?

Answer 1

I feel like the most appropriate solution for something like this would be using sockets. (You can try Socket.IO , but there are others libraries for websockets as well)

The main reason for this, is that we want to keep track of a disconnection event. This requires some kind of polling from the server/client. How much you want to do with the sockets is of course up to you; it's possible to keep the state of accessible modules stored in a map, and update them when you get a GET to an accessible module. Likewise, you can also use the socket with the 'connect' event, giving you the possibility of realtime updates.

When the user then closes the module, a disconnection event is sent such that you can change it to accessible.