> 웹 프론트엔드 > JS 튜토리얼 > JavaScript를 사용하여 내 인터넷 속도를 어떻게 예측할 수 있나요?

JavaScript를 사용하여 내 인터넷 속도를 어떻게 예측할 수 있나요?

Mary-Kate Olsen
풀어 주다: 2024-12-06 21:48:17
원래의
1042명이 탐색했습니다.

How Can I Estimate My Internet Speed Using JavaScript?

JavaScript에서 인터넷 속도를 감지하는 방법

JavaScript는 사용자의 인터넷 속도를 추정하는 방법을 제공하지만 결과가 매우 정확하지 않을 수 있다는 점에 유의하는 것이 중요합니다.

구현

알려진 파일 크기의 이미지를 로드하고 크기를 측정하는 개념입니다. 로드하는 데 걸리는 시간. 걸린 시간을 이미지 파일 크기(바이트)로 나누어 대략적인 인터넷 속도를 구할 수 있습니다.

아래 링크에서 예시를 확인할 수 있습니다.

  • [ JavaScript를 사용하여 속도 계산](https://rosettacode.org/wiki/Calculate_speed_using_javascript)

샘플 코드

이 수정된 테스트 사례에는 잠재적인 문제를 해결하기 위한 수정 사항이 포함되어 있습니다.

// EXAMPLE ONLY. USE YOUR OWN IMAGE!
var imageAddr = "https://upload.wikimedia.org/wikipedia/commons/3/3a/Bloemen_van_adderwortel_%28Persicaria_bistorta%2C_synoniem%2C_Polygonum_bistorta%29_06-06-2021._%28d.j.b%29.jpg"; 
var downloadSize = 7300000; // bytes

function ShowProgressMessage(msg) {
    // Display progress messages on the console and a progress element on the page.
    if (console) {
        if (typeof msg == "string") {
            console.log(msg);
        } else {
            for (var i = 0; i < msg.length; i++) {
                console.log(msg[i]);
            }
        }
    }
    
    var oProgress = document.getElementById("progress");
    if (oProgress) {
        oProgress.innerHTML = (typeof msg == "string") ? msg : msg.join("<br />");
    }
}

function InitiateSpeedDetection() {
    ShowProgressMessage("Loading the image, please wait...");
    window.setTimeout(MeasureConnectionSpeed, 1);
};    

if (window.addEventListener) {
    window.addEventListener('load', InitiateSpeedDetection, false);
} else if (window.attachEvent) {
    window.attachEvent('onload', InitiateSpeedDetection);
}

function MeasureConnectionSpeed() {
    var startTime, endTime;
    var download = new Image();
    download.onload = function () {
        endTime = (new Date()).getTime();
        showResults();
    }
    
    download.onerror = function (err, msg) {
        ShowProgressMessage("Invalid image, or error downloading");
    }
    
    startTime = (new Date()).getTime();
    var cacheBuster = "?nnn=" + startTime;
    download.src = imageAddr + cacheBuster;
    
    function showResults() {
        var duration = (endTime - startTime) / 1000;
        var bitsLoaded = downloadSize * 8;
        var speedBps = (bitsLoaded / duration).toFixed(2);
        var speedKbps = (speedBps / 1024).toFixed(2);
        var speedMbps = (speedKbps / 1024).toFixed(2);
        ShowProgressMessage([
            "Your connection speed is:", 
            speedBps + " bps", 
            speedKbps + " kbps", 
            speedMbps + " Mbps"
        ]);
    }
}
로그인 후 복사

HTML에 ID가 "progress"인 요소를 포함합니다:

<h1>
로그인 후 복사

위 내용은 JavaScript를 사용하여 내 인터넷 속도를 어떻게 예측할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿