jQuery를 사용하여 인터넷 연결이 있는지 확인하시겠습니까?

jQuery를 사용하여 인터넷 연결이 있는지 확인하시겠습니까?

이 질문에는 이미 다음과 같은 답이 있습니다.

인터넷 연결이 오프라인 상태인지 탐지하시겠습니까? (23개 답변)

닫힘8년 전에.

jQuery를 사용하여 인터넷 연결 여부를 어떻게 확인합니까?그런 식으로 저는 "제작 중에는 구글 캐시 버전의 JQuery를 사용하고, 개발 중에는 인터넷 연결에 따라 로컬 버전을 사용한다"는 몇 가지 조건을 붙일 수 있었습니다.

특정 사례에 가장 적합한 옵션은 다음과 같습니다.

에 ㅠㅠㅠㅠㅠ</body> 태그:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.10.2.min.js"><\/script>')</script>

문제가 jQuery에 집중되어 있기 때문에 이 방법이 가장 쉬운 방법일 것입니다.

보다 강력한 솔루션을 원하는 경우 다음을 시도할 수 있습니다.

var online = navigator.onLine;

오프라인 웹 앱에 대한 W3C의 사양에 대해 자세히 읽어 보십시오. 그러나 최신 웹 브라우저에서 이 기능이 가장 잘 작동할 것입니다. 오래된 웹 브라우저에서 이 기능을 사용하면 예상대로 작동하지 않거나 전혀 작동하지 않을 수 있습니다.

또는 자신의 서버에 대한 XHR 요청은 연결을 테스트하는 방법으로 나쁘지 않습니다.다른 답변 중 하나가 XHR에 대해 너무 많은 장애 지점이 있다는 것을 고려할 때, 연결을 설정할 때 XHR에 결함이 있으면 일상적인 사용 중에도 결함이 있을 수 있습니다.어떤 이유로든 사이트에 연결할 수 없는 경우 동일한 서버에서 실행 중인 다른 서비스에도 연결할 수 없습니다.그 결정은 당신에게 달렸어요.

저는 다른 사람의 서비스, 심지어 google.com 에도 XHR 요청을 하는 것을 추천하지 않습니다.서버에 요청하거나 요청하지 않습니다.

"온라인"이라는 것은 무엇을 의미합니까?

"온라인"이 무엇을 의미하는지에 대해 약간의 혼란이 있는 것 같습니다.인터넷은 네트워크의 집합이지만 때때로 인터넷에 "전체" 또는 월드 와이드 웹에 액세스하지 않고 VPN에 연결되어 있는 경우도 있습니다.회사에는 다른 외부 네트워크와의 연결이 제한된 자체 네트워크가 있는 경우가 많기 때문에 "온라인"으로 간주될 수 있습니다.온라인 상태가 되면 네트워크에 연결되어 있을 뿐 연결하려는 서비스의 가용성이나 연결 가능성은 없습니다.

네트워크에서 호스트에 연결할 수 있는지 확인하려면 다음 작업을 수행합니다.

function hostReachable() {

  // Handle IE and more capable browsers
  var xhr = new ( window.ActiveXObject || XMLHttpRequest )( "Microsoft.XMLHTTP" );

  // Open new request as a HEAD to the root hostname with a random param to bust the cache
  xhr.open( "HEAD", "//" + window.location.hostname + "/?rand=" + Math.floor((1 + Math.random()) * 0x10000), false );

  // Issue request and handle response
  try {
    xhr.send();
    return ( xhr.status >= 200 && (xhr.status < 300 || xhr.status === 304) );
  } catch (error) {
    return false;
  }

}

또한 이에 대한 요지는 https://gist.github.com/jpsilvashy/5725579 에서 확인할 수 있습니다.

로컬 구현에 대한 세부 정보

어떤 사람들은 "저는 항상 거짓으로 반환됩니다."라고 말했습니다.아마도 로컬 서버에서 테스트하고 있을 것이기 때문입니다.요청하는 서버가 무엇이든 HEAD 요청에 응답할 수 있어야 합니다. 원하는 경우 GET으로 변경할 수 있습니다.

네, 경기가 조금 늦어질 수도 있지만 온라인 이미지로 확인해보는 건 어떨까요?제 말은, OP가 구글 CMD나 로컬 JQ 복사본을 가져와야 하는지 알아야 하지만, 그렇다고 브라우저가 자바스크립트를 무조건 읽을 수 없다는 것은 아니죠?

<script>
function doConnectFunction() {
// Grab the GOOGLE CMD
}
function doNotConnectFunction() {
// Grab the LOCAL JQ
}

var i = new Image();
i.onload = doConnectFunction;
i.onerror = doNotConnectFunction;
// CHANGE IMAGE URL TO ANY IMAGE YOU KNOW IS LIVE
i.src = 'http://gfx2.hotmail.com/mail/uxp/w4/m4/pr014/h/s7.png?d=' + escape(Date());
// escape(Date()) is necessary to override possibility of image coming from cache
</script>

딱 내 2센트야

5년 후 버전:

오늘날, 이 페이지에 설명된 다양한 방법의 핵심 내용을 이해하고 싶지 않다면 JS 라이브러리가 있습니다.

그 중 하나가 https://github.com/hubspot/offline 입니다.미리 정의된 URI(기본적으로 즐겨찾기 아이콘)의 연결을 확인합니다.사용자의 연결이 다시 설정된 시점을 자동으로 감지하고 다음과 같은 깔끔한 이벤트를 제공합니다.up그리고.down사용자 UI를 업데이트하기 위해 바인딩할 수 있습니다.

Ping 명령을 모방할 수 있습니다.

Ajax를 사용하여 자신의 서버에 타임스탬프를 요청하고 setTimeout을 사용하여 타이머를 5초로 정의합니다. 응답이 없으면 다시 시도합니다.

4번의 시도에서 응답이 없으면 인터넷이 다운된 것으로 가정할 수 있습니다.

그래서 당신은 이 루틴을 사용하여 1분이나 3분과 같은 일정한 간격으로 확인할 수 있습니다.

그것은 저에게 좋고 깨끗한 해결책인 것 같습니다.

XHR 요청을 몇 번 전송하여 시도할 수 있으며, 오류가 발생하면 인터넷 연결에 문제가 있음을 의미합니다.

나는 이것을 하기 위해 jQuery 플러그인을 작성했습니다.기본적으로 현재 URL(웹에서 이미 한 번 로드되었기 때문에)을 확인하거나 인수로 사용할 URL을 지정할 수 있습니다.항상 구글에 요청을 하는 것은 최선의 방법이 아닙니다. 왜냐하면 구글은 다른 국가에서 다른 시간에 차단되기 때문입니다.또한 특정 해양/기상 전선/정치적 기후를 가로지르는 연결이 그날 어떤 것인지에 좌우될 수도 있습니다.

http://tomriley.net/blog/archives/111

나는 인터넷 연결이 존재하는지 확인하기 위해 여기서 일하는 해결책이 있습니다.

$.ajax({
    url: "http://www.google.com",
    context: document.body,
    error: function(jqXHR, exception) {
        alert('Offline')
    },
    success: function() {
        alert('Online')
    }
})

XHR 요청을 보내는 것은 해당 서버가 다운된 경우 실패할 수 있기 때문에 좋지 않습니다.대신 Google API 라이브러리를 사용하여 캐시된 버전의 jQuery를 로드합니다.

jQuery를 로드한 후 Google API를 사용하여 콜백을 수행할 수 있으며, 이것은 jQuery가 성공적으로 로드되었는지 확인합니다.아래 코드와 같은 것이 작동해야 합니다.

<script type="text/javascript">
    google.load("jquery");

    // Call this function when the page has been loaded
    function test_connection() {
        if($){
            //jQuery WAS loaded.
        } else {
            //jQuery failed to load.  Grab the local copy.
        }
    }
    google.setOnLoadCallback(test_connection);
</script>

Google API 설명서는 여기에서 확인할 수 있습니다.

훨씬 간단한 솔루션:

<script language="javascript" src="http://maps.google.com/maps/api/js?v=3.2&sensor=false"></script>

코드의 뒷부분에 있습니다.

var online;
// check whether this function works (online only)
try {
  var x = google.maps.MapTypeId.TERRAIN;
  online = true;
} catch (e) {
  online = false;
}
console.log(online);

온라인 상태가 아닌 경우 Google 스크립트가 로드되지 않으므로 예외가 발생하는 오류가 발생합니다.

언급URL : https://stackoverflow.com/questions/2384167/check-if-internet-connection-exists-with-jquery