HTML Server Status Checker

Question

I'm looking for a plugin for a website that checks that status of an online server. No matter how much I searched, I could not find one that uses simple HTML or CSS. I cannot use PHP because Weebly doesn't seem to understand it.

I can use CSS, HTML, and Javascript. All I need is something that tells the user if the server is online or offline.

You can always make a request with AJAX to the website and see if that succeeds or not, if it's an HTTP server. — Sami Kuhmonen, Apr 11 '15 at 18:56
Another super simple way if it's a website you're checking, load an image from the remote server with the img attribute `onerror="this.src='offline.png'"` — CᴴᵁᴮᴮʸNᴵᴺᴶᴬ, Apr 11 '15 at 19:04
@SamiKuhmonen you're most likely going to run into cross-site issues though when trying to make a call to a page that's not apart of the current domain. — jwatts1980, Apr 11 '15 at 19:25
@CᴴᵁᴮᴮʸNᴵᴺᴶᴬ Does your code point to displaying a different image if the server is offline? — UltraStallion, Apr 11 '15 at 19:46
Do a little searching before you ask the question here is a question that is very similar http://stackoverflow.com/questions/23997675/checking-if-web-server-is-online-offline — Odis Harkins, Apr 11 '15 at 19:56
The idea is it loads the image from the website that you're checking, but if it is unavailable (offline) it loads a local image called offline.png which could be something like "website currently offline" — CᴴᵁᴮᴮʸNᴵᴺᴶᴬ, Apr 11 '15 at 20:06
@CᴴᵁᴮᴮʸNᴵᴺᴶᴬ That will not work because not all clients will have a certain "server offline" png willy nilly in their computers. — UltraStallion, Apr 11 '15 at 21:06
You misunderstand. The offline image won't be on every visitor's computer it will be with your HTML/js/CSS. — CᴴᵁᴮᴮʸNᴵᴺᴶᴬ, Apr 11 '15 at 21:59
Also, the onerror attribute can do more than src replace. You can make it trigger text change etc with js — CᴴᵁᴮᴮʸNᴵᴺᴶᴬ, Apr 11 '15 at 22:01

Tomas K · Answer 1 · 2015-04-12T11:42:41.233

1

As sami kuhmonen said, you can make an ajax post and see if it fails:

EDITED
the html:

<div id="divtodiplaystatus"></div>

and the JavaScript:

        $.ajax({
            //your server url
            url: "http://google.com",
            type: "post",
            data: "onlinecheck",
            success: function(){
                //function if server's online
                document.getElementById("divtodiplaystatus").innerHTML = "Server is online!";
            },
            error:function(){
                //function if server's offline
                document.getElementById("divtodiplaystatus").innerHTML = "Server is offline :(!";
            }
        });

edited Apr 12 '15 at 11:42

answered Apr 11 '15 at 20:44

Tomas K

361
4
17

I cannot add certain files to the website because my site is 3rd party hosted. I do not have root folder directory access. I can only add or remove HTML from the page itself. Is there a way to include that in an HTML string? (The server I'm trying to monitor is hosted by me however) – UltraStallion Apr 11 '15 at 21:08
So you can't add it in ? I don't know if there is a way to solve your problem only with html – Tomas K Apr 11 '15 at 21:15
So just midify the code and add an function to display a Text via JavaScript innerHTML.... I will update the answer – Tomas K Apr 12 '15 at 11:32

HTML Server Status Checker

1 Answers1