使用HAR 分析器快速获取分析用户浏览器请求耗时信息

我们在维护服务的过程中可能会遇到用户报障访问网站的某个页面或者接口慢。由于大部分的用户没有调试错误的相关知识，就算是让用户使用浏览器自带的调试工具也很难找到异常的请求，远程的话也比较难做详细的分析。 幸好Chrome浏览器有两个工具可以让用户保存所有的请求信息，出问题的时候直接引导用户导出日志之后发给我们，再使用响应的工具打开日志，就可以慢慢的做深入分析了。

今天我先介绍下第一个工具，第二个工具比较复杂，后面我再单写一篇文章详细介绍。

工具： Google G Suite工具箱的HAR 分析器。

地址：https://toolbox.googleapps.com/apps/har_analyzer/

PS：墙外，需搭梯子

首先，引导用户使用F12打开浏览器调试工具，然后访问有问题的网站，在网络请求页面，右键选择“Save as HAR with content”,保存之后找到该后缀名为har的文件发给我们的技术人员。

图1：用户保存网络请求

然后，打开工具地址，导入该har文件。从工具的介绍中可以看到，其实不只是支持Chrome，还可以支持IE和Firefox。

图2：工具界面

打开文件后，我们可以在耗时类型这里勾选“独立”，然后点击请求详情中的“耗时”列，根据耗时的长短最反向排序，或者在右上角对的过滤框使用相应条件来过滤你感兴趣的请求。

图3：过滤请求

然后我们就可以方便的查看到感兴趣请求的耗时了。

图4：对比

这里各阶段的耗时定义目前在网上没有一个很详细和准确的说明（虽然有很多文章，但要么是中文的错漏百出，要么是英文的写得太简单），我在后面的文章中再慢慢跟大家分享。