浏览器获取网络请求信息
发表于 2017-06-14 | 分类于 随笔
Chrome浏览器打开开发者工具
| 客户端 | 快捷键 |
|---|---|
| Windows 和 Linux | Ctrl + Shift + j 或 F12 |
| Mac | ⌘ + Option + i |
Network选项
Network 面板记录页面上每个网络操作的相关信息，包括详细的耗时数据、HTTP 请求与响应头和 Cookie，等等。
相关参数解释
| 关键字段 | 名词解释 |
|---|---|
| Name | 资源的名称及其路径 |
| Status | HTTP 状态代码 |
| Type | 请求资源的 MIME 类型 |
| Initiator | 初始化该请求的对象或进程，具体解释1 |
| 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最好能提供文本信息，这样能较快的排查定位问题。
- parser: html解析器
Redirect: 一个Http重定向初始化了该请求
Script: 以script标签引用的js
Other: 其他情况如用户点击了一个链接或在地址栏输入了一个地址
所有用户赞赏通道：
