javascript - 如何在浏览器中确定和记录远程服务器的延迟

Question

相关:How to determine latency of a remote server through the browser

我试图了解收集外部服务器http响应状态代码的可行性。

对于上下文:我正在将一个 javascript 库加载到页面，该库被编写为捕获 DOM 元素值，然后将 GET 请求组装到外部服务器以传递这些值以进行收集。 Google Analytics 就是一个完美的例子，ga.js 库从页面/浏览器中确定数据值的范围，并向外部服务器上的跟踪像素发出带有大量查询字符串名称/值对和/或 cookie 值的图像请求。这是一项常见的事件，也是众所周知的。

我试图记录的是外部收集服务器的响应/确认(为了减少处理和/或数据收集开销，这可能仅限于响应不是 200 的情况)。 我的理解是响应代码仅在 HTTP header 中可用。我什至不知道是否可以以这种方式捕获 header 响应。我不清楚如何捕获或以其他方式记录这些响应代码并使它们在浏览器中可用，以便后续的收集例程可能一个 javascript 库，可以结合出站服务器域(即主机:google-analytics.com 状态:413 请求实体太大)收集这些代码，并将这些收集的值发送到外部收集环境。

作为一个额外的“很高兴拥有”，收集时间也将是有益的，但我意识到这是一个明显独立的问题。发出请求时启动计时器，当请求被确认并返回到浏览器的状态代码时停止计时器，发送该数字和数据:(主机:google-analytics.com 状态:413 请求实体太大时间:283ms )。

Answer 1

如果您使用ajax向远程服务器发出请求以及远程服务器的响应，您可以从 XmlHTTPRequest 获取状态代码目的。请求完成后，status 属性将为您提供 http 状态代码。

您可以使用类似 jquery 的内容简化事情。

警告:此示例代码未经测试

 var startTime = new Date().value;

 $.get('http://example.com/some/path', { param1:'value1', param2:'value2'})
    .done(function(data, status, jqxhr) {
      var endTime = new Date().value;
      var elapsedMS = endTime - startTime;
      // handle your success things here
    })
    .error(function(jqXHR, textStatus, errorThrown ) {
      var endTime = new Date().value;
      var elapsedMS = endTime - startTime;
      // handle your failure here
      if (typeof console != 'undefined') {
        console.log('your url', jqXHR.status, textStatus, errorThrown);
      }
    })
    ;

注意:一些跨域ajax请求被阻止。远程服务器必须明确设置响应 header 以允许此类请求。