未经直接许可估算用户的上传速度

Question

我希望在未获得直接许可的情况下粗略估计用户的上传速度.这只是为了区分真正慢的连接和非常快的连接,所以准确性并不是非常重要的......

Answer 1

这是一个实现这个使用XMLHttpRequest扩展@YiğitYane的想法.

上传速度取决于两件事:用户的连接速度和服务器的连接速度.我在这里所做的假设是要测试用户之间的速度你的服务器.而且XMLHttpRequest,由于同源策略,这确实是唯一的选择.

使用上传速度,您无需返回任何内容.您只需要将POST大量数据存储到服务器上的任何页面即可.最容易点击的页面是您已经使用的页面.为此,您可以完全保留网址的域部分.open().POST某些服务器上的数据限制为2兆字节,因此我使用了一个是安全的.一个就足以得到一个体面的阅读.

为了防止缓存URL,我在末尾附加一个随机数.

url = '?cache=' + Math.floor( Math.random() * 10000 )

为了防止POST数据被gzip压缩,我使用随机数据.该函数允许您传递要检查的迭代次数.迭代间隔为每五秒钟.该update回调函数被调用与检查的速度,所有的检查的移动平均每个迭代.使用尽可能多的迭代来获得所需的精度.如果您只是想要粗略估计,那么一次迭代就足够了.

它被称为这样:

checkUploadSpeed( 10, function ( speed, average ) {

} );

演示

你可以在这里试试这个代码.

私人服务器

你可以在ThinkingStiff自己的服务器上试试这个,这可能是这些服务器中最快的.

堆栈代码段

    function checkUploadSpeed( iterations, update ) {
        var average = 0,
            index = 0,
            timer = window.setInterval( check, 5000 ); //check every 5 seconds
        check();

        function check() {
            var xhr = new XMLHttpRequest(),
                url = '?cache=' + Math.floor( Math.random() * 10000 ), //random number prevents url caching
                data = getRandomString( 1 ), //1 meg POST size handled by all servers
                startTime,
                speed = 0;
            xhr.onreadystatechange = function ( event ) {
                if( xhr.readyState == 4 ) {
                    speed = Math.round( 1024 / ( ( new Date() - startTime ) / 1000 ) );
                    average == 0 
                        ? average = speed 
                        : average = Math.round( ( average + speed ) / 2 );
                    update( speed, average );
                    index++;
                    if( index == iterations ) {
                        window.clearInterval( timer );
                    };
                };
            };
            xhr.open( 'POST', url, true );
            startTime = new Date();
            xhr.send( data );
        };

        function getRandomString( sizeInMb ) {
            var chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789~!@#$%^&*()_+`-=[]\{}|;':,./<>?", //random data prevents gzip effect
                iterations = sizeInMb * 1024 * 1024, //get byte count
                result = '';
            for( var index = 0; index < iterations; index++ ) {
                result += chars.charAt( Math.floor( Math.random() * chars.length ) );
            };     
            return result;
        };
    };
    
    checkUploadSpeed( 10, function ( speed, average ) {
        document.getElementById( 'speed' ).textContent = 'speed: ' + speed + 'kbs';
        document.getElementById( 'average' ).textContent = 'average: ' + average + 'kbs';
    } );

<div id="speed">speed: 0kbs</div>
<div id="average">average: 0kbs</div>

的jsfiddle

托管演示的JSFiddle服务器速度较慢.

单击此按钮转到小提琴:

Answer 2

您可以向发送/返回大量数据的服务发出异步 ajax 请求，并测量客户端加载所需的时间。这当然受到客户端当前网络使用情况的影响。