JS 如何获取http请求响应时间

问题:点击一个按钮用AJAX获取后台的数据,如何获取这个期间的请求时间,网速慢的请求下,请求时间长。快反之。

我有个思路不晓得正不正确:
点击按钮时,获取当前点击时的时间戳,当页面返回数据后,在获取时间戳,两个时间段相减。

阅读 24.9k
4 个回答
var sendDate = (new Date()).getTime();

$.ajax({
    //type: "GET", 
    type: "HEAD", 
    url: "/someurl.htm",
    success: function(){

        var receiveDate = (new Date()).getTime();

        var responseTimeMs = receiveDate - sendDate;

    }
});

这个思路是对的,在Chrome Network Timing中可以查看一个请求在各个阶段所花费的时间,由于segmentfault的评论上传图片功能有问题,在此把Timing中各个字段代表的意思发出来:
1、Queueing
请求文件顺序的的排序
什么东西?
浏览器有线程限制的,发请求也不能所有的请求同时发送,所以,队列喽。
从添加到待处理队列
到实际开始处理的时间间隔标示
2、Stalled
是浏览器得到要发出这个请求的指令到请求可以发出的等待时间,一般是代理协商、以及等待可复用的TCP连接释放的时间,不包括DNS查询、建立TCP连接等时间等
3、DNS Lookup
时间执行DNS查找。每个新域pagerequires DNS查找一个完整的往返。 DNS查询的时间,当本地DNS缓存没有的时候,这个时间可能是有一段长度的,但是比如你一旦在host中设置了DNS,或者第二次访问,由于浏览器的DNS缓存还在,这个时间就为0了。
4、Initial connection
建立TCP连接的时间,就相当于客户端从发请求开始到TCP握手结束这一段,包括DNS查询+Proxy时间+TCP握手时间。
5、Request sent
请求第一个字节发出前到最后一个字节发出后的时间,也就是上传时间
6、Waiting(TTFB)
请求发出后,到收到响应的第一个字节所花费的时间(Time To First Byte),发送请求完毕到接收请求开始的时间;这个时间段就代表服务器处理和返回数据网络延时时间了。服务器优化的目的就是要让这个时间段尽可能短。
7、Content Download
收到响应的第一个字节,到接受完最后一个字节的时间,就是下载时间

不知道你想要这请求的时间用来做什么用途。。 如果仅仅只是想看看请求时间的快慢的话。控制台有一个console.time可以了解一下.

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏