如何使用javascript测试浏览器中用户到服务器的延迟？ [英] How to test latency from user to server in browser using javascript?

问题描述

我想使用我网站的访问者收集一些信息。

我需要的是每个访问者ping 3个不同的主机名，然后将以下信息保存到数据库中。

I want to gather some information using the visitors of my websites.
What I need is for each visitor to ping 3 different hostnames and then save the following info into a DB.

Visitor IP, latency 1,latency 2, latency 3

当然，一切都必须对访客透明，不得以任何方式打扰他。
这可能吗？能给我举个例子？是否有任何jQuery插件或更容易的东西

Of course everything has to be transparent for the visitor without interrupting him in any way. Is this possible? Can you give me an example? Are there any plugins for jQuery or something to make it easier

编辑

这是我到目前为止 jsfiddle.net/dLVG6 ，但数据太随机了。它从50跃升到190

This is what I have so far jsfiddle.net/dLVG6 but the data is too random. It jumps from 50 to 190

推荐答案

这可能会让您更加痛苦。

This is going to be more of a pain that you might think.

你的第一个问题是Javascript没有ping。大多数Javascript擅长的是HTTP和一些堂兄协议。

Your first problem is that Javascript doesn't have ping. Mostly what Javascript is good at is HTTP and a few cousin protocols.

第二个问题是你不能只发出一些ajax请求并给结果计时（那将是方式太明显了）。 相同的来源政策将阻止您使用ajax与该网页来源之外的服务器进行通信。你需要使用JSONP，或者更改图像标签的src，或者更间接的更新。

Second problem is that you can't just issue some ajax requests and time the results (that would be way too obvious). The same origin policy will prevent you from using ajax to talk to servers other than the one the page came from. You'll need to use JSONP, or change the src of an image tag, or something else more indirect.

你的第三个问题是你不想做任何会导致返回大量数据的东西。您不希望数据传输时间或广泛的服务器处理干扰测量延迟。

Your third problem is that you don't want to do anything that will result in a lot of data being returned. You don't want data transfer time or extensive server processing to interfere with measuring latency.

第四，您不能要求可能缓存的URL。如果对象碰巧在缓存中，你会得到非常低的延迟测量，但它没有意义。

Fourth, you can't ask for URLs that might be cached. If the object happened to be in the cache, you would get really low "latency" measurements but it wouldn't be meaningful.

我的解决方案是使用图像标签没有 src 属性。在文档加载时，将 src 设置为指向有效的服务器但使用无效的端口。通常，服务器简单地拒绝连接比生成正确的404错误响应更快。所有你需要做的就是测量从图像中获取错误事件所需的时间。

My solution was to use an image tag with no src attribute. On document load, set the src to point to a valid server but use an invalid port. Generally, it is faster for a server to simply reject your connection than to generate a proper 404 error response. All you have to do then is measure how long it takes to get the error event from the image.

来自 Filddle ：

var start = new Date().getTime();
$('#junkOne').attr('src', 'http://fate.holmes-cj.com:8886/').error(function () {
    var end = new Date().getTime();
    $('#timer').html("" + (end - start) + "ms");
});

该技术可能会有所改进。以下是一些想法：

The technique could probably be improved. Here's some ideas:

1. 使用IP地址而不是DNS主机名。


2. 执行ping 多次，抛出最高和最低分，然后平均其余部分。


3. 如果您的网页有很多繁重的处理，请在您考虑UI时尝试进行测试负载最轻。

这篇关于如何使用javascript测试浏览器中用户到服务器的延迟？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！