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

【问题标题】：How to determine and record latency of a remote server in the browser如何在浏览器中确定和记录远程服务器的延迟
【发布时间】：2023-04-06 16:34:01
【问题描述】：

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

对于上下文：我正在将一个 javascript 库加载到页面，该库是为捕获 DOM 元素值而编写的，然后将 GET 请求组装到外部服务器以传递这些值以进行收集。 Google Analytics 就是一个很好的例子，ga.js 库从页面/浏览器中限定数据值，并向外部服务器上的跟踪像素发出带有大量查询字符串名称/值对和/或 cookie 值的图像请求。这是一种常见的活动，一般都可以理解。

我要记录的是外部收集服务器的响应/确认（为了减少处理和/或数据收集开销，这可能仅限于响应不是 200 的情况）。 我的理解是响应代码仅在 HTTP 标头中可用。我什至不知道是否可以以这种方式捕获标头响应。我不清楚如何捕获或以其他方式记录这些响应代码并使它们在浏览器中可用，以便后续收集例程可能一个javascript库，可以与出站服务器域一起收集这些代码（即HOST：google-analytics.com STATUS：413 Request Entity Too Large），并将这些收集的值发送到外部收集环境。

作为一个额外的“很高兴拥有”，收集时间也是有益的，但我意识到这是一个明显不同的问题。发出请求时启动计时器，当请求被确认并返回给浏览器的状态码时停止它，发送该数字和数据：（HOST：google-analytics.com STATUS：413 Request Entity Too Large TIME：283ms )。

【问题讨论】：

标签： javascript analytics http-status-codes data-collection

【解决方案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 请求被阻止。远程服务器必须明确设置响应标头以允许此类请求。

【讨论】：