前端使用postman工具调试接口

1.表单类型的接口请求

什么是表单 ？

我们都知道，在发送HTTP请求的时候，一个请求中一般包含三个部分，分别是请求行，请求头，请求体 。

不同的接口，请求体的数据类型是不一样的，比较常见的一种就是表单类型，那么什么是表单类型呢 ？简单理解就是在请求头中查看Content-Type，它的值如果是:application/x-www-form-urlencoded .那么就说明客户端提交的数据是以表单形式提交的 。见下图

postman中如何请求？

如果在postman请求上图的接口，我们只需要填写四个参数，分别是(可以参考上图)：

• 请求方法：POST
• 请求URL：http://localhost/index.php?m=Home&c=User&a=do_login&t=0.21942974229794432
• 请求头：Content-Type：application/x-www-form-urlencode
• 请求体：username=13088888888&password=123456&verify_code=8888

实现步骤：

1. 打开postman，新建一个请求 。
2. 在请求中设置以上四个参数，点击Send按钮。在postman中设置请求体类型为，需要选择body->
   x-www-form-urlencoded
3. 查看响应数据。

上传文件的表单请求

在做接口测试时，我们经常会遇到需要上传文件的接口，比如微信的更新头像。这就需要用到：multipart/form-data。它也属于一种表单，但它既支持表单请求，也支持文件上传。它的请求报文中数据往往是下面这样的。

POST http://localhost/index.php/home/Uploadify/imageUp/savepath/head_pic/pictitle/banner/dir/images.html HTTP/1.1
Content-Type: multipart/form-data
file=a1.jpg

这种类型的接口，在postman中该如何请求呢 ？我们先分析需要填写的参数 。

• 请求方法：POST
• 请求URL：http://localhost/index.php/home/Uploadify/imageUp/savepath/head_pic/pictitle/banner/dir/images.html
• 请求类型：multipart/form-data
• 请求体：file=a1.jpg

实现步骤：

1. 打开postman，新建一个请求 。
2. 在请求中设置以上四个参数，点击Send按钮。注意：在postman中设置请求体类型，需要选择body-> form-data
   。file中要选择File类型，然后上传本地的文件 。
3. 查看响应数据。

json类型的接口请求

这应该是接口测试中最常见的一种情况了 ， 也就是请求体类型为json,我们来看下这个请求报文 。

POST http://xxx/api/sys/login HTTP/1.1
Content-Type: application/json;charset=UTF-8

{"account":"root","password":"123456"}

根据以上报文，我们可以分析出，我们在postman只需要填写四个参数即可，具体如下：

• 请求方法：POST
• 请求地址：http://xxx/api/sys/login
• 请求体类型：json
• 请求体数据：{“account”:“root”,“password”:“123456”}

实现步骤：

1. 打开postman，新建一个请求 。
2. 在请求中设置以上四个参数，点击Send按钮。注意：在postman中设置请求体类型，需要选择body-> raw -JSON
3. 查看响应数据。

2.接口响应数据解析

响应数据是发送请求后经过服务器处理后返回的结果，响应由三部分组成，分别是状态行、响应头、响应体。我们来看下postman的响应数据展示。

在postman中的响应数据展示：

• 状态行：Status：200 OK
• 响应头：Headers + Cookies，需要注意的是Cookies是包含在响应头中的，但是为了明显，工具会分开显示
• 响应体：Body

那么这些数据对我们做接口测试有什么作用呢 ？

• Body和Status是我们做接口测试的重点，一般来说我们都会验证响应体中的数据和响应状态码
• Test Results 是我们编写断言后，可以查看断言的执行结果 ，所以这个对我们也很有用 。
• Time 和Size 是我们做性能测试时，可以根据这两个参数来对所测接口的性能做一个简单的判断。

接下来我们再来关注下Body中的几个显示主题，分别是：Pretty，Raw，Preview .

Pretty:翻译成中文就是漂亮 ， 也就是说返回的Body数据在这个标签中查看 ，都是经过格式化的，格式化后的数据看起来更加直观，所以postman默认展示的也是这个选项。比如返回html页面，它会经过格式化成HTML格式后展示，比如返回json，那么也会格式化成json格式展示 。

Raw：翻译成中文未经过加工的，也就是原始数据 ，原始数据一般都是本文格式的，未经过格式化处理的，一般在抓包工具中都有这个选项 。

Preview：翻译成中文就是预览，这个选项一般对返回HTML的页面效果特别明显，如请求百度后返回结果，点击这个选项后就直接能查看到的页面 ，如下图 。同时这个选项和浏览器抓包中的Preview也是一样的 。

3.日志调试

在做接口测试时，经常会因为代码写的有问题导致报错，这时通过查看日志就显得非常重要了，postman也提供了这样的功能，它允许我们在脚本中编写打印语句，查看打印的结果 ; 同时也可以查看每个请求的日志信息 。

在postman中编写日志打印语句使用的是JavaScript，编写的位置可以是Pre-request Script 或Tests标签中。编写打印语句如：console.log(“我是一条日志”)

那么打印的日如何看呢 ？在postman中有俩个入口，第一个入口就是：view-show postman console 。

第二个入口就是左下角第三个图标 。

打开的日志界面

这里面有几个比较实用的功能：

• 搜索日志：输入URL或者打印的日志就能直接搜索出我们想要的请求和日志，这对我们在众多日志中查找某一条日志是非常方便的 。
• 按级别搜索：可以查询log,info,warning,error级别的日志 ，有助于我们更快定位到错误 。
• 查看原始报文(Show raw log)：如果习惯看原始请求报文的话，这个功能可能更方便些 。
• 隐藏请求(Hide network)：把请求都隐藏掉，只查看输出日志 。

总之，通过这个功能，我们在请求接口报错时，通过打印响应的日志，就能很轻松的找到问题原因了 。