In JavaScript (on Chrome) I am trying to perform some task whenever a user switches from one WiFi network to another (assuming that both networks are exactly the same in terms of performance).

I started with looking at the online / offline events of the Window interface and navigator.onLine but it seems like that they are not triggered when we switch networks (disconnect from one network and connect to the other) because

In Chrome and Safari, if the browser is not able to connect to a local area network (LAN) or a router, it is offline; all other conditions return true.

you cannot assume that a true value necessarily means that the browser can access the internet. You could be getting false positives, such as in cases where the puter is running a virtualization software that has virtual ethernet adapters that are always "connected."

Ref1:

Ref2: why navigator.onLine() return true even if my internet connection is not working?

Also, the navigator.connection object not necessarily updates to trigger navigator.connection.onchange event in case of switching networks.

I tried using WebRTC with STUN to capture public IP address to differentiate between the two connections but there is no event listener that would reliably tell that a network change has happened.

I understand that JavaScript can not directly access network info through the browser due to security reasons but is there an alternative that can be reliably used to trigger an event whenever the network is switched or there is no actual internet connectivity even though the puter is connected to the LAN/WiFi?

In JavaScript (on Chrome) I am trying to perform some task whenever a user switches from one WiFi network to another (assuming that both networks are exactly the same in terms of performance).

I started with looking at the online / offline events of the Window interface and navigator.onLine but it seems like that they are not triggered when we switch networks (disconnect from one network and connect to the other) because

In Chrome and Safari, if the browser is not able to connect to a local area network (LAN) or a router, it is offline; all other conditions return true.

you cannot assume that a true value necessarily means that the browser can access the internet. You could be getting false positives, such as in cases where the puter is running a virtualization software that has virtual ethernet adapters that are always "connected."

Ref1: https://developer.mozilla/en-US/docs/Web/API/Navigator/onLine

Ref2: why navigator.onLine() return true even if my internet connection is not working?

Also, the navigator.connection object not necessarily updates to trigger navigator.connection.onchange event in case of switching networks.

I tried using WebRTC with STUN to capture public IP address to differentiate between the two connections but there is no event listener that would reliably tell that a network change has happened.

I understand that JavaScript can not directly access network info through the browser due to security reasons but is there an alternative that can be reliably used to trigger an event whenever the network is switched or there is no actual internet connectivity even though the puter is connected to the LAN/WiFi?

• javascript
• google-chrome
• webrtc
• navigator
• stun

• Very curious what the use-case is, if you mind sharing. – Slava Knyazev Commented Jul 18, 2022 at 18:16
• 2 You could keep an websocket connection to your server that just responds to periodic ping or echo messages. If the websocket connection dies (and calls your error or close callback), then you have a strong hint that the network conditions changed. Likewise, failures to connect back to the server and/or success after previously failing are other hints. – selbie Commented Jul 19, 2022 at 7:14
• 1 I hope there will never be a solution to this question, because when it appears, it’s going to be a privacy nightmare. – dumbass Commented Jul 24, 2022 at 17:34
• Not a plete solution, but might be helpful. If there is a connection between two peers, that means they have selected a pair of ICE candidates (local and remote). When on one of the peers' side network is changed then that peer has to gather new candidates for new network interface. I'm not sure that this continuous gathering policy can be enabled from JS, but if in your case your WebRTC session is not interrupted during network switch, then it's likely this policy is on. So, the peers will select new pair, look at event "selectedcandidatepairchange" - thus you might catch network change. – Artem Suprunov Commented Jul 26, 2022 at 21:57
• @selbie has pointed you in the right direction. Have implemented something similar previously. You won't necessarily know that the network has changed, just that the connection dropped. – FishSaidNo Commented Jul 29, 2022 at 1:34

2 Answers 2

What you are looking for does not have wide browser support, but does exist in Chromium-based browsers: https://developer.mozilla/en-US/docs/Web/API/NetworkInformation/change_event

This is known as "walk out of the door" problem. These slides from a 2015 IETF meeting explain it well: https://www.ietf/proceedings/94/slides/slides-94-ice-6.pdf

In a nutshell what you need to do in the browser is to wait for the old connection to get disconnected and initiate an ICE restart to reestablish the connection.