Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

What's the best way to check if a website is up or not via JavaScript

Tags:

javascript

What is the best way to check if a site is up and running or down with JavaScript?

like image 661
Te Riu Warren Avatar asked Jan 27 '11 09:01

Te Riu Warren


People also ask

How can I tell if a website is using JavaScript?

Go to the outer edge of a site (e.g. far left), then right-click and click on “View Page Source” (or the option that's similarly named). That will bring up all the HTML code, along with links to CSS files, Javascript, images, etc. You can now read through it and see what that page is created with.

How do you check if a website is up or not?

Method 1 — Checking with Website Planet Visit Website Planet. Enter the URL of your website address on the field and press the Check button. Website Planet will show whether your website is online or not.

Can you use JavaScript for websites?

About JavaScriptJavaScript is a programming language mostly used client-side to make webpages interactive. You can create amazing webpages without JavaScript, but JavaScript opens up a whole new level of possibilities. Note: In this article we're going over the HTML code you need to make JavaScript take effect.


2 Answers

No AJAX required, just plant an image from the remote site hidden into your site and monitor the load HTTP response status of this image. This might need some tweaks for true crossbrowser compatibility.

<script type="text/javascript">
function set_test(name,status){
    var el=document.getElementById(name+'_test');
    el.innerHTML=status?'Yes, you are logged in':'No, you\'re not logged in';
    el.style.color=status?'#0a0':'#a00';
    el.style.fontWeight='bold';
}
(function(){
    var gmail_test=document.getElementById('gmail_test');
    gmail_test.innerHTML='Checking...';
    var img=document.createElement('img');
    img.src='//mail.google.com/mail/photos/static/AD34hIhNx1pdsCxEpo6LavSR8dYSmSi0KTM1pGxAjRio47pofmE9RH7bxPwelO8tlvpX3sbYkNfXT7HDAZJM_uf5qU2cvDJzlAWxu7-jaBPbDXAjVL8YGpI?rand='+Math.random();
    img.onload=function(){set_test('gmail',1)};
    img.onerror=function(){set_test('gmail',0)};
    img.style.display='none';
    document.body.appendChild(img);
})();
</script>
like image 111
Spliffster Avatar answered Sep 19 '22 23:09

Spliffster


Based on Spliffster's comment:

This code will based on the browser timeout try to reach a specific IP until it is available asynchronously. You may want to add code to prevent it from trying to long.

<head>
<script>
function check_available(ip){
    var el=document.getElementById("check_pic");
    el.src="https://"+ip+"/images/powered_by.gif?now="+Math.random();    
}

function check_success(url){
  alert("redirect now :) - url:"+url);
}
</script>
</head>

<body>
    <img style="visibility:hidden" id='check_pic' src="/images/powered_by.gif" onabort="alert('interrupted')" onload="check_success('http://10.0.0.1/redirect/me/here')" onerror="check_available('10.17.71.150')"/>

</body>

[Edit]

Sidenote: xmlhttprequest will not work as the browser will throw a cross origin exception. This mozilla.dev link gives more background infos and shows examples using access control header response statements. Be aware that the access control header field is serverside (the site that is being probed) and you might not be able to control that field (not enabled by default).

timing issues There are differences in timing when using xmlhttprequests for cross origin calls. Since the browser must wait for the response to evaluate possible access control header fields, a call to a non existent website will run into the browsers request timeout. A call to an existing website will not run into this timeout and error out earlier with a cross origin exception (only visible in the browser, javascript never gehts this info!). So there's also the possibility to measure the time from xmlhttprequest.send() to first response (in callback). An early callback call will indicate that the website is up from the browsers point of view but at least with xmlhttprequest you wont be able to evaluate the returncode (since this is blocked bei cross origin policy).

self.xmlHttpReq.open('POST', strURL, true);
self.xmlHttpReq.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
self.xmlHttpReq.onreadystatechange = function() {
    //stopwatch.stop and calc timediff. timediff < default browser request timeout indicates website is up from this browsers point of view. No clues on request status or anything else, just availability
}
self.xmlHttpReq.send(null);
//stopwatch.start
like image 39
tintin Avatar answered Sep 21 '22 23:09

tintin