auto detect URL status and set to use it

Question

I have below function using which I can water the pot over the internet, however when I am at home I can use http://192.168.1.156:8025/?waterPlant1 instead of http://www.example.com:8025/?waterPlant1 . Secondly going by second link it takes time sometimes to turn on valve. So is there any way I can auto detect if I have success with http://192.168.1.156:8025/?waterPlant1 I continue use that URL else use http://www.example.com:8025/?waterPlant1. which would mean like I am not on same network or I am not at home.

function waterPlant1() {
    var ifrm = document.createElement("iframe");
    ifrm.setAttribute("src", "http://www.example.com:8025/?waterPlant1");
    ifrm.setAttribute("id", "iframe");
    ifrm.style.visibility = "false";
    ifrm.style.display = "none";
    document.body.appendChild(ifrm);

 }



<button onclick="waterPlant1()">Water the Plant</button>

using jQuery answer here: http://stackoverflow.com/questions/8571227/use-javascript-to-check-http-status-codes/8571617#8571617 using browser: open inspect element, network tab and see what the code of status. — Janatbek Orozaly, Feb 12 '17 at 07:23
The main concept is the status code ,if successfully the request has been placed you will get the status code 200 if not try the other one — Pranoy Sarkar, Feb 12 '17 at 08:33
Possible duplicate of [Use javascript to check http status codes](http://stackoverflow.com/questions/8571227/use-javascript-to-check-http-status-codes) — nyedidikeke, Feb 12 '17 at 13:12

Janatbek Orozaly · Answer 1 · 2017-02-12T08:47:55.590

0

Wrote some code for you, and it returned the status and everything you want to know about your URL. Check if it helps.

var url = 'Your default url';
  $('button').click(function(){
    $.ajax({
          url: url,
          data:"",
          method:"post",
          success: function(data, textStatus, jqXHR){
           console.log("data is ", data, "\n status is ", textStatus, "\n jqXHR is :", jqXHR);
          },
          error: function(){
            
            $.post( "Your second URL",      function( data ) {
                console.log(data)
              });
          }
        })     
  })

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button>Water the Plant</button>

edited Feb 12 '17 at 08:47

answered Feb 12 '17 at 08:07

Janatbek Orozaly

445
3
17

I don't see where you are changing the URL ? – Ciasto piekarz Feb 12 '17 at 08:09
in if else statement inside success callback – Janatbek Orozaly Feb 12 '17 at 08:11
Default URL should be the one starting with `192.168.1.156` – Ciasto piekarz Feb 12 '17 at 08:36
:-), I'll change it. – Janatbek Orozaly Feb 12 '17 at 08:46
So I am going to keep default 'url' to `192.168.1.156` and on status 404, I am going to change `url` to `www.example.com`. – Ciasto piekarz Feb 12 '17 at 08:53
Kind of, but as @Bulent Vural said, you could check it on backend. – Janatbek Orozaly Feb 12 '17 at 09:01

score 0 · Answer 2 · answered Feb 12 '17 at 08:40

0

Because of the HTTP timeouts, it may take longer to detect if a URL unreachable then going the long way where both of them are reachable.

If you have control over the back-end, I would suggest sending the signal to the both URL. On the backend, process the first request & ignore the later one but return success to the both.

answered Feb 12 '17 at 08:40

Bulent Vural

2,630
1
13
18

couldn't timeout on `ajax` call as in my answer below be useful ? – Ciasto piekarz Feb 12 '17 at 14:40

Ciasto piekarz · Answer 3 · 2017-02-12T14:43:17.517

I manage to get it to work like this , I pass url from the button click function call, if it works , its fine. otherwise if it times out. use example.com [which means I am not at home network]

function waterPlant1(url){

    $.ajax({
          url: url,
          data:"",
          timeout: 500,
          method:"post",
          success: function(data, textStatus, jqXHR){

           console.log("URL is: " + url);
          }
          ,
          error: function(request, status, err){
            if (status == "timeout") {
             url = 'http://example.com/?waterPlant1';
             document.getElementById("msg").innerHTML = url;

             var ifrm = document.createElement("iframe");
       ifrm.setAttribute("src", url);
       ifrm.setAttribute("id", "iframe");
       ifrm.style.visibility = "false";
       ifrm.style.display = "none";
       document.body.appendChild(ifrm);
            } else {
                // another error occured  
                alert("error: " + request + status + err);
            }

          }
        }) 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button onClick="waterPlant1('http://192.168.1.16/?waterPlant1')">Water the Plant</button>

the advantage of passing URL from function as argument is that on every button click I test the local network URL first. this way I can avoid global variable, it getting overwritten by past click so on next retry so local network URL us never used.

auto detect URL status and set to use it

3 Answers3