javascript - 寻找 AJAX get 和 post 使用的 Web 数据的绝对或可能估计？

Question

我一直在此处和谷歌浏览，但没有成功。我目前正在开发一个在用户本地计算机上运行的小页面(我猜它会被称为网络应用程序)，它使用 AJAX 的 get 和 post 方法。不过我想知道每次获取和发布使用了多少数据。

到目前为止，我在这里找到了一个页面，它可以帮助我在 JSON.stringify 使用 get 返回的 json 后计算数据的大小。 How many bytes in a JavaScript string?

但是我对此有一些想法。我认为 URL get 和 post 的大小也会消耗数据。由于它使用 https 协议(protocol)，我想大小会有所不同。

我遇到的问题是带有查询的 URL(URL 末尾的 ?something=value 内容)大小。

我稍后会使用 jQuery，如果它的测量方式不同，请注意。

如有任何帮助，我们将不胜感激。

编辑:为了避免混淆，我指的是网络数据。

Answer 1

您可以创建一个变量来存储responseText的.length之和；使用 .ajaxComplete() 对 Content-Length 响应 header 的总和进行求和，或 responseText.length

var blobs = [new Blob(["abc"]) // 3
             , new Blob(["defg"]) // 4
             , new Blob(["hijkl"]) // 5
            ]; // 12;
var _data = {sent:0, received:0};

$(document).ajaxComplete(function(event, jqxhr, ajaxOptions) {
  if (ajaxOptions.type === "GET") {
    _data.received += jqxhr.responseText.length;
  } else {
    _data.sent += ajaxOptions.data 
                  ? ajaxOptions.data.length 
                  : ajaxOptions.url.split("?")[1].length; // handle query string data
  }
  // sum `_data` using `jqxhr.responseText`     
  console.log("total data received:", _data, ajaxOptions);
  // sent: 14, received: 12
})

$.each(blobs, function(_, blob) {
  // three requests; 3, 4, 5 string characters, respectively
  $.get(URL.createObjectURL(blob)) 
})

$.post(URL.createObjectURL(new Blob([null])), {mno:123}); // 7

$.post("?pqr=789"); // 7

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">
</script>