浏览器获取网络请求信息

发表于 2017-06-14   |   分类于 随笔

Chrome浏览器打开开发者工具

| 客户端 | 快捷键 |
| -------- | :----: |
| Windows 和 Linux | Ctrl + Shift + j 或 F12 |
| Mac | ⌘ + Option + i |

Network选项

Network 面板记录页面上每个网络操作的相关信息,包括详细的耗时数据、HTTP 请求与响应头和 Cookie,等等。
相关参数解释

| 关键字段 | 名词解释 |
| -------- | :----: |
| Name | 资源的名称及其路径|
| Status | HTTP 状态代码 |
|Type |请求资源的 MIME 类型|
|Initiator|初始化该请求的对象或进程,具体解释[^footnote]|
|Size | 资源的大小,包括响应头和响应内容的组合大小|
|Time |从请求开始至在响应中接收到最终字节的总持续时间|
|Timeline |显示所有网络请求的可视瀑布|

查看单个资源的详细详情

  • 通过点击某个资源的Name可以查看该资源的详细信息

| 关键字段 | 名词解释 |
| -------- | :----: |
| Headers |HTTP头信息,我们重点关注的|
| Preview |JSON、图像和文本资源可以预览|
|Response |HTTP 响应数据|
|Timing|资源请求生命周期过程中每部分话费的时间|

Headers网络请求信息

  • 以经过又拍云CDN为例,具体分析Headers信息.
  • 在Headers标签里面可以看到Request URL、Method、Status Code、Remote Address等基本信息和详细的Response Headers 、Request Headers等信息。

|关键字段 |实例 | 名词解释 |
| -------- | -----: | :----: |
|Request URL |http://upyun5.b0.upaiyun.com/test.png|具体资源的请求地址|
|Request Method |Get|请求方式|
|Status Code |200 OK|请求状态码|
|Remote Address |111.1.36.114:80|解析到的服务器IP和请求端口|
|Accept-Ranges |bytes|可以用于判断支不支持 Range 请求|
|Age |4256|表示在又拍云CDN上的缓存时间,单位为秒|
|Cache-Control |max-age=691200 |最大缓存时间,单位为秒;特别的字段值为 no-cache 或者 no-store,此时CDN节点对此资源不做缓存|
|Content-Length |17388|CDN上文件的响应体的长度|
|Content-Type |image/jpeg|文件的MIME信息|
|ETag | 865b50d3e0f647c22cb32f641de2e09f|文件的唯一标志符|
|Expires | Wed, 05 Apr 2017 16:51:00 GMT|响应过期的日期和时间|
|Last-Modified |Tue, 13 Sep 2016 02:47:26 GMT|资源的最后修改时间|
|Server |marco/0.26|请求的服务器名称和版本|
|X-Cache |MISS(S) from 403-zj-fud-209, MISS from mix-hz-fdi-167; HIT(R) from cmn-zj-hgh-118|其中只要有 HIT 就表示命中缓存|
|X-Request-Id |9bde11d3930c9631797407c653b3a0e3;477211e0b31542a22b1395ab5b96ff95|请求的ID,主要用于排查定位问题|
|X-Source |U/304|源站响应的状态码|
#实例截图:#

  • 当你在使用又拍云出现问题的时候,可以截图在工单里面反馈给又拍云的技术支持。对于响应头信息和请求的URL最好能提供文本信息,这样能较快的排查定位问题。
    此处输入图片的描述

[^footnote]:

  • parser: html解析器
    Redirect: 一个Http重定向初始化了该请求
    Script: 以script标签引用的js
    Other: 其他情况如用户点击了一个链接或在地址栏输入了一个地址
所有用户赞赏通道:

发表新评论

© ICP: 浙ICP备17033011号-1