How to display message if internet is disconnected?

Hi,

I happened to click on https://metro.co.uk/ when my wifi went down. Instead of a message from my browser saying no connection, a webpage was loaded saying that the connection was down. If I turn off my wifi and try and load sitepoint I get the usual browser message saying the site couldnt be found.

How is metro.co.uk returning a page when there is no connection? I am assuming there must be some form of cache on my machine for it to do this.

If anyone knows and can either explain how I can do it or point me to a tutorial that would be great as I think this would be a really useful feature for my website.

thanks

1 Like

Well it would kind of depend on where the connection break occurs as to what you were seeing.

For example;

If your site goes down, but you’re behind a system like Cloudflare, then Cloudflare will serve a page to the visitor saying your site is down, but that they managed to reach the Cloudflare service.

If your wifi is down because your ISP has internal problems, the ISP could serve a page to you in a similar sense.

Basically, the last node in the chain that still works can, if they decide to, service the request with an appropriate message, rather than just letting the browser handle it.

Now we come back all the way to the device, and the ability of a cache-failsafe.
I assume, based on the idea of the Metro site, that they are dynamically serving their page on each pageload. However, what may be in your cache could be the loader. That loader could have a “no connection” default screen, which gets hidden/replaced once you make a connection to the site source and download the content it wants you to display.

Think of it like a “loading” screen - except instead of loading, it says you have no connection. When you pull the page up, it uses Javascript to go send a request out for content. If none comes back, you’re left with the screen that says it couldnt get the content.

It must be the last option as there was no internet connection at all as my wifi had died. Sounds like it might be a bit of a drawback for me if I had to rely on javascript so perhaps not a viable thing for what I want to do.
I’ll have to do a bit of testing and see.

thanks

I do not understand how that could happen. If there is no WiFi then how did your browser get a page?

Well, perhaps there was something in the cache. Perhaps the browser got the page from the cache without trying to get it over the internet and then some JavaScript or WebAssembly code tried to do something but could not. If so then you might have gotten a more realistic error if you used F5 or Ctrl-F5 when you got the error.

About twenty years ago I saw a long discussion from a question like this. It is not as easy to define internet is disconnected as you might think.

To clarify I have been to that site previously (not that day but in the past). I don’t believe it could return anything otherwise as obviously there is no way for a transfer of information to take place. It must be on my computer already from a previous visit.

My internet connection was completely down. If I tried other websites I go to regularly and the ones I had open at the time they would not load.

It should be easy enough to replicate. Just go to https://metro.co.uk/ and after it loads turn off your wifi and refresh and you should hopefully see the same message I got, instead of a no connection message from the browser.

Why must it be WiFi? Do you expect an Ethernet connection to be different? I have been seeing people say to tap my screen. Well tapping my screen does nothing. Are you assuming that everyone uses smartphones? My guess is that for these forums at least most members use desktop computers with Ethernet connections.

I doubt that I have been to that website before. I unplugged my Ethernet and tried to browse to it and got:

Then I re-connected my network and got (this is of course not the entire page):

Then I disconnected my network again and refreshed the page and got:
metrocouk3

umm…are you having a bad day? I was merely trying to clarify and say what I did to create the situation. Would be a bit odd if I said to replicate the problem by doing something different to what I’d done.

I don’t believe I said that it ‘must’ be wifi and I didn’t mention smartphones at all. What ‘people’ are telling you to tap your screen? I said nothing at all about tapping anything. Especially since I use wifi on my laptop (you’ll find a significant amount of modern laptops don’t have an rj45 port so a large amount of people working from home on a laptop likely connect via wifi), although to be fair it does have a touchscreen so technically I could tap it to do things but I don’t as it’s weird on a laptop.

I will admit that I didn’t also mention ethernet (or mobile broadband either) specifically as an option in my post but seeing how I noticed the issue when my wifi failed I kind of had that in my mind. I guess I did assume people would understand that wifi meant the ‘internet connection’ from my machine. If I just said my ‘internet connection’ failed, as m_hutley pointed out, that has numerous different meanings also.

As for the actual problem the 3rd image is what I was interested in, and as i believe you have shown and as I tried to explain, loads an offline page somehow. Thank you for testing and confirming you could replicate the issue and showing the outcomes. At least hopefully we are now all clear on the original question.

Time a nice cup of tea and a biscuit…if you like tea and/or biscuits. :upside_down_face:

3 Likes

Yes. People that don’t think about what they say and say things they do not mean can be frustrating.

You said wifi, not network. WiFi is not wired. I assume you meant either wireless or wired connections. For technical discussions especially, use of the incorrect term can cause problems.

We are getting into off-topic details but my smartphone can connect using Ethernet with the USB port.

I was not sure. There might have been a reason why you said wifi instead of network.

Did you attempt to recreate the problem by deleting the cache?

What’s worse is when someone says you said something you didn’t, or makes it seem like you said something you didn’t!

It’s pretty simple, if you don’t understand something I am saying just ask for clarification. If you don’t want to ask, you don’t have to reply but please don’t say I’ve said things I haven’t or bring your random unrelated complaints/frustrations into it as though they have anything to do with me.

I don’t really understand why this has taken a turn for the worst but I’ll leave it at that before I say something I regret.

Amazing! People get upset about corrections about words but when the same corrections are made about technical issues it is accepted as normal behavior.

You can do this with a webworker. It’s a bit of Javascript that loads when someone visits your site and it can then direct where any additional request go. That is, for every HTTP request to your site, the browser will ask the webworker what to do. It can then decide to fetch the actual URL, or return a cached version, etc. It’s got to complete freedom to do whatever.

So in case you are not connected to the internet the webworker is still asked by the browser what to do and it can server up an offline page. You could also serve a minimal page that still does something. Options are endless.

6 Likes

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.