How to know the number of browser tabs that are open currently

do you want all tabs or just the tabs that are pointed at your website?

• You cannot get all tabs..... Would be a lot of fun if any website could check which tabs I have open, especially if they can also check the URLs of those tabs :p
• The ones pointed at your website: possible, but not 100% foolproof and not possible* with only PHP.

For the ones pointed at your website, the best way I can think of is using websockets. In the html, you connect a websocket, and as soon as it's open, you send your sessionID, the server can now keep a list of open sockets, and their session IDs.

Count the open sockets of a single session ID, and you have the amount of open tabs / windows (of the same browser) of this user.

  * = For websockets you'll need an extra service like nodeJS on your server, in theory it's possible in PHP ( https://reactphp.org ) but I would not go that way.

Thanks a lot of the response @lostdreamer_nl and I think it's a good start to know the tabs on which my app is open. I will check out the resource you just shared.

If you do get to know how I can see what other tabs are open please let me know, I will research as well and will let you know if I get an answer.

Thanks again!

@lostdreamer_nl The tabs would all be sharing the same session id though, wouldn't they? I mean if I'm logged into the site and open another tab, I'm automatically logged in on that tab as well since the session cookie is being sent on each request. The session is tied to the browser, not the individual tabs.

@cronix that's correct, that's why this would work: "Count the open sockets of a single session ID"

Eventually this gives a list in nodeJS like:

tabs = [
    {session: 123..., socket:  ...},  // <--- User 1, tab 1
    {session: 123..., socket:  ...},  // <--- User 1, tab 2
    {session: 234..., socket:  ...},  // <--- User 2, tab 1
    {session: 123..., socket:  ...},  // <--- User 1, tab 3
    {session: 234..., socket:  ...},  // <--- User 2, tab 2
    {session: 123..., socket:  ...},  // <--- User 1, tab 4
]

if the nodeserver receives a disconnect, it looks for that socket in the tabs list, removes that object (as the connection was just closed) so you can always count the amount of objects that have the same session ID to see how many tabs (of the same browser) that user has opened.

If you use a private navigation tab, it would not be counted, same goes for another browser.

A lot of websites where I have push notifications I have some form of this, where all sockets are kept in a list based on the logged in user's ID, or the browser's session_id.

This way, when you notify a user, I can send it to all sockets that the user has in use (any tab / browser window).

@madhukar

"If you do get to know how I can see what other tabs are open please let me know"

If I find out, I can tell you now that I will sell it for a lot of money to all advertising companies I know of ;) They'll pay gold to know which tabs people have open, that's why browsers dont give out that info.

Every website only gets to know about what people are doing on their website (or those that have explicitaly given access to this info)

Why do you need to know the number of open tabs in their browser?

@dalma My guess is it's just a practise program being written....

@madhukar If it is just for a practise, or just for yourself..... There is a way ;) (There always is)

You could make a browser extension from your Vue App: https://medium.com/javascript-in-plain-english/i-built-a-browser-extension-with-vue-76779d0a6238

A Browser Extension has more permissions than normal javascript run from some website : https://developer.mozilla.org/nl/docs/Mozilla/Add-ons/WebExtensions

This way you'd be able to use: https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/windows/getAll

function logTabsForWindows(windowInfoArray) {
  for (windowInfo of windowInfoArray) {
    console.log(`Window: ${windowInfo.id}`);
    console.log(windowInfo.tabs.map((tab) => {return tab.url}));
  }
}

var gettingAll = browser.windows.getAll({populate: true})
gettingAll.then(logTabsForWindows);

So you can get all tabs, of all open windows..... but you'd need to package your Vue App as a browser extension and install it..... that's the only 100% foolproof way.

The next best thing ofcourse would be that nodeJS way. It works in just about every browser these days that has javascript turned on.

@dalma @lostdreamer_nl Yes it's just a fun program.

Thanks again @lostdreamer_nl @dalma, I will check out these resources as well....

@CRONIX - Thanks for chiming in....