Redirect only if user is online

Question

I am currently having an Issue with a Clients Intranet. We used to have a start-site where some js checks, wether the user is online or not, and if so that he is redirected to the home-page of our Intranet. Now I am testing the compatibility with the new Microsoft EDGE and found out that the automatic redirect isn´t working anymore. Do you have any ideas of how to check if the user has a valid internet connection and then redirect?

Current solution is:

var myImg = new Image();
    myImg.src = "https://URL_of_our_intranet/images/blank.gif";
    myImg.onload = myImgOnLoadHandler;

    function myImgOnLoadHandler(e) {
        window.location =  "redirect-URL";
    }

The whole Code is on each Users Local System and there is no JQuery-Solution possible as there is no JQ-Library available. I would love to hear an easy and on EDGE working solution.

If there is an easy way to do so, please let me know - I am not a pro in Javascript..

Thanks! Sam

If you don't use Opera: https://developer.mozilla.org/en-US/docs/Web/API/NavigatorOnLine/onLine — Emil S. Jørgensen, Feb 28 '17 at 15:09
Making an AJAX request seems more useful than requesting an asset which a browser might decide to heavily cache… — deceze, Feb 28 '17 at 15:11
@deceze What would an AJAX request look like in combination with a redirect? — Code_Sam, Feb 28 '17 at 15:13
+1 to the AJAX request, you could have an action on your server that when hit returns a [204](https://httpstatuses.com/204) @Code_Sam have a look at some [tutorials on AJAX](https://www.w3schools.com/xml/ajax_intro.asp) — George, Feb 28 '17 at 15:21
@EmilS.Jørgensen that solution worked perfect! Really slim and easy! And as we only use Internet Explorer (and sometimes Firefox) that works for me. Thanks! — Code_Sam, Feb 28 '17 at 15:29

score 0 · Answer 1 · answered Feb 28 '17 at 15:30

The above comments are worth considering. This is a kludge, and is always going to be fragile. As mentioned in the comments, a major pitfall here is caching. That can be circumvented by appending a cache-busting string to the URL. I don't think this is the case, but it's also possible that some browsers won't load an image that isn't a member of a DOM, so it might be necessary to insert it into the DOM. The below snippet demonstrates both:

function myImgOnLoadHandler(e) {
  console.log('Connected! redirecting...');
}

function maybeRedirect() {
  var myImg = new Image();
  myImg.onload = myImgOnLoadHandler;
  myImg.src = '//i.imgur.com/Jz49oEp.gif?' + new Date().getTime();
  myImg.style.display = 'none';
  document.body.appendChild(myImg);
}

document.querySelector('button').addEventListener('click', maybeRedirect);

<button type="button">Click me</button>

score 0 · Accepted Answer · answered Feb 28 '17 at 15:51

The solution that perfectly worked for me, as we only use Internet Explorer (at least some use firefox, but Opera is not available on any client):

if (navigator.onLine) {
    window.location.replace("https://www.google.de");
    }

Thanks for your quick help!

Redirect only if user is online

2 Answers2