• 于Postman
• postman基础功能介绍
• 使用postman进行接口自动化测试
• 快捷键大全简单操作请求工具栏接口窗口数据编辑

关于Postman

Postman是一款功能强大的网页调试与发送网页HTTP请求的Chrome插件，简单的说就是调试json和web请求的工具。

用户在开发或者调试网络程序或者是网页B/S模式的程序的时候是需要一些方法来跟踪网页请求的，用户可以使用一些网络的监视工具比如著名的Firebug等网页调试工具。今天给大家介绍的这款网页调试工具不仅可以调试简单的css、html、脚本等简单的网页基本信息，它还可以发送几乎所有类型的HTTP请求！Postman在发送网络HTTP请求方面可以说是Chrome插件类产品中的代表产品之一。

Postman的操作环境

postman适用于不同的操作系统，Postman Mac、Windows X32、Windows X64、Linux系统，还支持postman 浏览器扩展程序、postman chrome应用程序等。

postman基础功能介绍

首先，看一下它的基础功能：

collection在postman里面相当于一个文件夹，可以把同一个项目的请求放在一个Collection里方便管理和分享，Collection里面也可以再建文件夹。这里我们做一个普通接口的简单的示例：

请求区域介绍：

• 1 Authorization：身份验证，主要用来填写用户名密码，以及一些验签字段,postman有一个helpers可以帮助我们简化一些重复和复杂的任务。当前的一套helpers可以帮助你解决一些authentication protocols的问题。；
• 2 Headers：请求的头部信息
• 3 Body：post请求时必须要带的参数，里面放一些key-value键值对
• 4 Pre-requerst Script:可以让你在 请求之前自定义请求数据，这个运行在请求之前，语法使用JavaScript语句。
• 5 tests：tests标签功能比较强大，通常用来写测试，它是运行在请求之后。支持JavaScript语法。postman每次执行request的时候，会执行tests。测试结果会在tests的tab上面显示一个通过的数量以及对错情况。这个后面会进行详解，它也可以用来设计用例，比如要测试返回结果是否含有某一字符串
• 6 form-data：,它将表单数据处理为一条消息，以标签为单元，用分隔符分开。既可以单独上传键值对，也可以直接上传文件（当上传字段是文件时，会有Content-Type来说明文件类型,但该文件不会作为历史保存，只能在每次需要发送请求的时候，重新添加文件。）；post请求里较常用的一种

• 7 x-www-form-urlencoded：对应信息头-application/x-www-from-urlencoded，会将表单内的数据转换为键值对；
• 8 raw：可以上传任意类型的文本，比如text、json、xml等,所有填写的text都会随着请求发送；
• 9 binary：对应信息头-Content-Type:application/octet-stream，只能上传二进制文件，且没有键值对，一次只能上传一个文件, 也不能保存历史，每次选择文件，提交；

使用postman进行接口自动化测试

错，使用postman也可以进行接口自动化的，是不是很神奇

首先，既然是自动化测试，那么我们肯定需要工具 (Postman) 或者代码能帮我们直接判断结果是否符合预期。那么在接口测试上，大体就两个思路：

判断请求返回的 code 是否符合预期

判断请求返回的内容中是否包含预期的内容（关键字）

接下来我们看看如何利用 Postman 来解决上述的问题

快捷键大全

作为一名IT程序猿，不懂一些工具的快捷方式，应该会被鄙视的吧。收集了一些Postman的快捷方式，大家一起动手操作~

简单操作

发者常常依赖 Chrome DevTools 来分析和优化网络请求。这个工具伴随着开源浏览器内核 Chromium 被包括了 Edge、Opera、QQ 浏览器和 360 浏览器等常见浏览器所采纳和提供。在这篇文章中，我们将介绍 Chrome DevTools 中的 网络面板 (Network) 功能，并提供一些有用的技巧来帮助您优化网络请求。

1. 查看资源来源

在资源面板查看文件时，Reveal in Network panel 可以定位资源属于那个请求：

2. 过滤请求

点开后可以根据 Fetch/XHR、JS、CSS 等等选项请求过滤请求：

按住 Ctrl (Mac 用 Command) 进行点击可以多选，比如同时过滤 JS 和 CSS 类型的文件：

同时提供 Filter 输入框，可以根据输入的名称进行筛选，当然，你也可以写正则表达式，比如用 /(css|js)$/ 来同时筛选出 css 和 js 文件：

前面加个短横 - 还可以取反：

3. 保存所有网页请求

刷新页面所有请求都会重置掉，这对调试接口非常不方便，因为我们经常需要做前后请求对比，打开保存日志（Preserve Log）选项，将网页请求记录一直保存下来。

4. 禁止缓存

缓存对用户体验来说非常重要，但对开发来说非常不需要。打开禁止缓存（Disable Cache），拒绝所有缓存。

5. 网页加载截图

网络面板提供了网页加载截图， 方便你查看网页一步步的加载过程:

6. 禁止某些请求

在分析网页性能的时候，可以通过禁止某些请求来做控制变量法:

这个方法只能单个单个禁止请求，Chrome 还提供了个根据模板禁止请求，首先 Ctrl + Shift + P（Mac 用 Command + Shift + P ）运行命令菜单（Run command），搜索 Show Network request blocking 并运行它：

比如禁止所有 CDN 文件，可以这样写： https://cdn.heighliner.cloud/*

在这里插入图片描述

这里虽然叫做模板（Pattern），但是并不能用正则表达式，只能用通配符（*），弱鸡的 Chrome。

7. 模拟网络情况

大多数情况下，浏览器会发起畅通无阻的网络请求，但某些场景下我们希望它们不畅通且有阻。

节流（Throttling）处可以控制网络的快慢，默认提供快速 3G、慢速 3G、离线（Offline）。

当然你也可以进行自定义，其实无非就是控制下载（Download）、上传（Upload）和延迟（Latency）的值。

8. 查看 Load 事件

网络面板有多个地方展示 DOMContentLoaded 和 load 事件的时间点，蓝线对应 DOMContentLoaded 事件，红线代表 load 事件。

话说 Chrome 这里有个 BUG，暗黑模式和明亮模式下颜色表现不太一致。

在这里插入图片描述

9. 查看请求情况

在分析一个网站性能时候，有几个总数据值得参考。

第一个是网站总的请求数量，这里显示为 33：

第二个是传输的资源大小，这里为 731kB：

第三个是传输过来的资源解压之后的大小，这里为 1.9MB：

打开 Use large request rows ，可以详细看到每个请求解压前后的资源大小。

在这里插入图片描述

10. 分享请求

前后端接口联调对线的时候，经常需要查询接口详情，扔一两张截图或许方便但不够详细，HAR（HTTP Archive）是一种基于 JSON 格式的存档文件，你可以把所有 HTTP 请求下载成 HAR 文件：

扔给对方导入：

11. 清理网络请求

一键重置网络面板所有记录，还你干净如初。

想要了解更多？

欢迎大家关注我们公众号定期推荐有趣的开发者工具，也欢迎大家加入我们微信群一起讨论和交流：