Custom hook that tracks whether the browser is online.
navigator.onLine is a hint in both directions, not an answer. Safari
reports false during network transitions (interface handoffs, VPNs,
sleep/wake) while the network is perfectly usable, and fires
online/offline in rapid alternating bursts while it does. So an offline
claim is only believed once it has held for OFFLINE_CONFIRM_MSand a
same-origin request has failed to confirm it; anything the probe reaches is
reported as online.
The two directions are deliberately asymmetric, including on first render:
a false offline interrupts the page to say changes won't be saved, while a
false online only costs a missing warning. So recovery just waits out
ONLINE_SETTLE_MS, and a page that loads offline waits for the probe
rather than flashing a banner it might have to take back.
Returns boolean
Whether the browser is online.
Example
constisOnline = useOnline();
if (!isOnline) { return <Paragraph>You're offline</Paragraph>; }
Custom hook that tracks whether the browser is online.
navigator.onLineis a hint in both directions, not an answer. Safari reportsfalseduring network transitions (interface handoffs, VPNs, sleep/wake) while the network is perfectly usable, and firesonline/offlinein rapid alternating bursts while it does. So an offline claim is only believed once it has held forOFFLINE_CONFIRM_MSand a same-origin request has failed to confirm it; anything the probe reaches is reported as online.The two directions are deliberately asymmetric, including on first render: a false offline interrupts the page to say changes won't be saved, while a false online only costs a missing warning. So recovery just waits out
ONLINE_SETTLE_MS, and a page that loads offline waits for the probe rather than flashing a banner it might have to take back.