聯機時發送警報

Question

我想了解navigator.onLine工作方式。 為此，我輸入了一個小片段，該片段應每3秒檢查一次瀏覽器是否在線，如果在線，則彈出一個警報：

function check_connection() {
var online = navigator.onLine;
return online;
}

function timed_alert() {

var perfectTiming = setInterval(check_connection,3000);

if (online) {
alert("ONLINE!");
clearInterval(perfectTiming);
}

timed_alert();

由於某種原因，這東西不起作用。 我做錯了什么？ 我應該在代碼段中進行哪些更改以使其起作用？

Answer 1

您的警報和檢查必須具有相同的功能，並且計時器ID（perfectTiming）是全局的。

var perfectTiming = null;
function check_connection() {
     var online = navigator.onLine;
     if (online) {
          alert("ONLINE!");
          clearInterval(perfectTiming);
     }
}

function timed_alert() {
    perfectTiming = setInterval(check_connection,3000);
}

timed_alert();

如果您要測試用戶是否具有較難的活動Internet連接，因為瀏覽器沒有真正的方法來檢查此情況。 但是，您可以測試幾個不同的ip / url以查看它們是否可以訪問

var testUrlIndex = 0;
var testurls = [
    "http://www.google.com",
    "http://www.cnn.com"
];
function testURL(url)
{
    var xmlhttp;
    if (window.XMLHttpRequest)
    {// code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp=new XMLHttpRequest();
    }
    else
    {// code for IE6, IE5
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function()
    {
        if (xmlhttp.readyState==4 && xmlhttp.status==0)
        {
                testUrlIndex++;
            if( testUrlIndex<testurls.length ) {
                testUrl(testurls[testUrlIndex]);
            } else {
                weAppearToBeOffline();
            }
        }
    }
    xmlhttp.open("GET",url,true);
    xmlhttp.send();
}

function weAppearToBeOffline() {
     //DO whatever you need to do if we are offline.
}
testUrl(testurls[0]); //start the check

這段代碼將檢查2個網址（如果您要檢查更多網址，只需將更多網址添加到testurls網址），如果它們testurls網址並且無法訪問它們，它將調用weAppearToBeOffline函數

現在，這僅在幾種方式上是有問題的，主要是因為存在這樣一種情況，即用戶可能在線但無法訪問這些URL中的任何一個，但可以訪問其他URL。

Answer 2

進行以下更改：

var perfectTiming = setInterval(check_connection,3000);

function check_connection() {    
  if(navigator.onLine){
      alert("ONLINE!");
      clearInterval(perfectTiming);
  }
}

Answer 3

您需要使用setTimeout而不是check_connection來調用timed_alert。

function check_connection() {
    var online = navigator.onLine;
    return online;
}

function timed_alert() {
    var online  =check_connection();


    if (online) {
       alert("ONLINE!");

    }
    else{

       setTimeout(timed_alert,3000);
    }
}
timed_alert();

Answer 4

您每3秒鍾檢查一次連接，但沒有執行任何操作。 timed_alert每3秒調用一次check_connection ，並在該函數內使用check_connection ：

var perfectTiming = setInterval(timed_alert,3000);

function check_connection() {
    var online = navigator.onLine;
    return online;
}

function timed_alert() {
    if (check_connection()) {
        alert("ONLINE!");
        clearInterval(perfectTiming);
    }
}

如果您打算在腳本的其他位置進行check_connection則這是采用的方法。