使用 javascript 的带宽实用程序
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4547166/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Bandwidth utility using javascript
提问by Rajeev
IS there any utility to measure bandwidth from my server to the client or any standard APIS.Need this for web application
是否有任何实用程序可以测量从我的服务器到客户端或任何标准 APIS 的带宽。Web 应用程序需要这个
回答by T.J. Crowder
Don't know of any utility or standard API, no, but you can do this by having several images of various sizes on your website, and then retrieving them bypassing cache and watching how long it takes for them to load. That information, along with the size of the image, gives you an indicationof the speed between the two endpoints.
不知道任何实用程序或标准 API，不，但您可以通过在您的网站上放置多个不同大小的图像来实现此目的，然后绕过缓存检索它们并观察加载它们需要多长时间。该信息以及图像的大小为您提供了两个端点之间的速度指示。
The reason for using multiple images is that you'll want to start small (say, 20k), but if the connection is fast that will give you a very inaccurate number; so based on how quickly that image loaded, you'll want to select another image of an appropriate size to try to get a better idea of the actual bandwidth (as opposed to the latency setting up the connection and such).
使用多个图像的原因是您希望从小尺寸开始（例如 20k），但是如果连接速度很快，那么您将得到一个非常不准确的数字；因此，根据图像加载的速度，您需要选择另一个合适大小的图像，以尝试更好地了解实际带宽（而不是设置连接等的延迟）。
You can do this just with straight JavaScript, by adding imgtags off-page with a unique query string to bypass caching; but as you've tagged your question "jQuery", you may find it more convenient to use the .ajax function(with its cache: falsesetting) instead.
您可以直接使用 JavaScript，通过img在页外添加带有唯一查询字符串的标签来绕过缓存，从而做到这一点；但是当您将问题标记为“jQuery”时，您可能会发现使用.ajax 函数（及其cache: false设置）更方便。
The speed number you come up with is only an indication, since other things could be going on that mess up your timing (video streaming in another tab — or on another computer hooked to the same internet connection, even other things slowing up the execution of your JavaScript, like a JS-heavy animation on the page), but it should be good enough to give you an idea what you're working with.
您提出的速度数字只是一个指示，因为其他事情可能会扰乱您的时间安排（另一个选项卡中的视频流 - 或连接到同一互联网连接的另一台计算机，甚至其他事情会减慢执行速度您的 JavaScript，就像页面上的 JS 重动画一样），但它应该足以让您了解您正在使用的内容。
回答by doublemax
// Network connection - https://github.com/daniellmb/downlinkmax
var connectionSpeed = function()
{
// Deal with vendor prefixes
var defaultSpeed = false,
navigator = window.navigator,
connection = navigator.connection || navigator.mozConnection || navigator.webkitConnection || null;
if( ! connection )
return defaultSpeed;
// assume W3C Editor's Draft 09 October 2014
if( 'downlinkMax' in connection )
{
var downlinkMax = connection.downlinkMax;
if( ! downlinkMax )
return defaultSpeed;
if( ! isFinite(downlinkMax) )
return defaultSpeed;
return downlinkMax;
}
// assume W3C Working Draft 29 November 2012
if( 'bandwidth' in connection )
{
var bandwidth = connection.bandwidth;
if( ! bandwidth )
return defaultSpeed;
if( isNaN(speed) )
return defaultSpeed;
// standardize connection.bandwidth value by converting megabytes per second (MB/s) to megabits per second (Mbit/s)
return bandwidth * 8;
}
// assume W3C Working Draft 07 June 2011
switch( connection.type )
{
// convert connection.type value to approximate downlink values
// speed estimate is based on the median downlink value for common devices in megabits per second (Mbit/s)
case 'none':
return 0;
case '2g':
return 0.134;
case 'bluetooth':
case 'cellular':
return 2;
case '3g':
return 8.95;
case '4g':
return 100;
case 'ethernet':
return 550;
case 'wifi':
return 600;
}
return defaultSpeed;
};
回答by Adrian Ber
I needed something similar, so I wrote https://github.com/beradrian/jsbandwidth, a rewrite of https://code.google.com/p/jsbandwidth/.
我需要类似的东西，所以我写了https://github.com/beradrian/jsbandwidth，重写了https://code.google.com/p/jsbandwidth/。
The idea is to make two calls through Ajax, one to download and the other to upload through POST.
这个想法是通过 Ajax 进行两次调用，一个是下载，另一个是通过 POST 上传。
It should work with both jQuery.ajaxor Angular $http.
它应该与两者jQuery.ajax或 Angular 一起使用$http。
