Home » Php » javascript – How does websockets deal with for two tabs of the same browser

javascript – How does websockets deal with for two tabs of the same browser

Posted by: admin July 12, 2020 Leave a comment

Questions:

I have

  • 1 PHP server (serving http request) and
  • 1 node.js publishing updated data messages (with websockets to each connection).

The php server setup its cookie. In one browser, this cookie is available across all tabs.

When a browser has 2 tabs opened to the domain, there is only one cookie identifying the browser, but 1 message of updated data must be sent to each tabs.

  1. What is the traditional way to distinguish between tabs ?
  2. Should I use another cookie (managed by node.js) to distinguish between each browser tabs ?
How to&Answers:

Turning my comment into an answer…

There’s a separate websocket for each tab. That’s how you distinguish different tabs from each other. If you’re keeping separate state per tab in your server and you want to allow multiple connections by the same user, then you have to keep the state per websocket connection (you can use the websocket id), not per user.

You don’t need to create a separate cookie per tab because the websocket itself already serves as the unique id for each tab.

You haven’t said if your app wants identical state in all tabs or if each tab has different state and you would handle things a bit differently on the server side based on the desire. If you want all tabs to receive the same data, then whenever you want to send data to a client, you have to find all websockets that are associated with a given user and send the same data to them.

If you want each tab to behave independently, then you just keep server-side state per websocket and send a response only to the websocket that the response belongs to, not all websockets associated with that user.

As with nearly all questions here on SO, it’s a lot easier to answer more specifically if you tell us more about what you’re actually doing rather than having a theoretical conversation. For example, if we knew how your app was supposed to work with different tabs, then we’d know which behavior path to follow.