Comment puis-je estimer ma vitesse Internet à l'aide de JavaScript ?-js tutoriel-php.cn

Comment puis-je estimer ma vitesse Internet à l'aide de JavaScript ?

Mary-Kate Olsen

Libérer： 2024-12-06 21:48:17

original

1041 Les gens l'ont consulté

How Can I Estimate My Internet Speed Using JavaScript?

Comment détecter la vitesse Internet en JavaScript

JavaScript fournit un moyen d'estimer la vitesse Internet d'un utilisateur, bien qu'il soit important de noter que les résultats peuvent ne pas être très précis.

Mise en œuvre

Le concept consiste à charger une image avec une taille de fichier connue et à mesurer le temps nécessaire pour charger. En divisant le temps nécessaire par la taille du fichier image en octets, une estimation de la vitesse d'Internet peut être obtenue.

Un exemple peut être trouvé sur le lien ci-dessous :

[ Calculer la vitesse à l'aide de JavaScript](https://rosettacode.org/wiki/Calculate_speed_using_javascript)

Exemple Code

Ce scénario de test modifié intègre un correctif pour résoudre un problème potentiel :

// 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"
        ]);
    }
}

Copier après la connexion

Dans le code HTML, incluez un élément avec l'ID "progress" :