检测网速快慢

检测通用网速快慢

var getConnection = () => {
    const nav = window.navigator;
    if (!nav) return null;
    return nav.connection || null;
};

var getNetworkState = function () {
    const connection = getConnection();
    if (!connection) {
        return {
            online: navigator.onLine,
        };
    }
    return {
        online: navigator.onLine,
        type: connection.type,
        effectiveType: connection.effectiveType,
        downlink: connection.downlink,
        downlinkMax: connection.downlinkMax,
        rtt: connection.rtt,
        saveData: connection.saveData,
    };
};

var tipHandler = function () {
    var state = getNetworkState();
    console.table(state);
    // var speed = navigator.connection.downlink * 1024 / 8; //单位为KB/sec
    // console.log("网速为" + speed + "KB/s");

    if(!state.online || state.downlink === 0) {
        $(".network-tip").text('您当前设备离线,无法进行考试!')
    } else if(state.downlink < 1) {
        $(".network-tip").text('您当前网速较差,可能会影响考试!')
    } else if (state.downlink < 5) {
        $(".network-tip").text('您当前网速良好,可能会影响考试!')
    } else {
        $(".network-tip").text('您当前网速极好,可以正常考试!')
    }
}

var connection = getConnection();
if (connection) {
    connection.addEventListener("change", tipHandler);
}

tipHandler()

检测用户和特定域名之间的网络速度

function startDownload() {
    var startTime = (new Date()).getTime();
    var prevLoaded = 0; // 上次记录的已加载的数据量
    var speeds = []; // 存储过去5秒的下载速度
    var downloadTimeIntervalInMs = 5000; // 5秒

    xhr = new XMLHttpRequest();
    xhr.open('GET', '可以在公司cdn上放一个文件的链接', true);
    xhr.responseType = 'arraybuffer';

    // 设置请求超时时间为5秒
    xhr.timeout = 5000;

    xhr.onprogress = function(event) {
        // 判断是否支持计算进度
        if (event.lengthComputable) { 
            var currentTime = (new Date()).getTime();
            var timeInterval = (currentTime - startTime) / 1000; // 总共用时()
            startTime = currentTime;

            var loaded = event.loaded; // 已加载的数据量
            var speed = (loaded - prevLoaded) / timeInterval / 1024; // kb/s
            prevLoaded = loaded;

            speeds.push(speed);
        }
    };

    xhr.ontimeout = function() {
        console.log('请求已超时,尝试中断请求...');
        xhr.abort();
    };

    xhr.onload = function() {
        if (xhr.status == 200) {
            console.log('请求成功!');
        } else {
            console.log('请求失败:' + xhr.status);
        }
    };

    console.log('开始下载...');
    xhr.send(null);

    setTimeout(function() {
        var sum = speeds.reduce(function(a, b) {
            return a + b;
        }, 0);
        var avg = sum / speeds.length;
        console.log(`过去5秒的平均下载速度为: ${avg.toFixed(2)} KB/s`);
    }, downloadTimeIntervalInMs);
}
startDownload()

  • 4
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值