IntelliJ IDEA的这个接口调试工具真是太好用了！

时间 2020-08-12 标签 intellij idea 这个接口调试工具真是太好用

现陆续将Demo代码和技术文章整理在一块儿 Github实践精选 (https://github.com/FraserYu/learnings)，方便你们阅读查看，以为不错，还请Star
前端

抗击疫情，在家办公。工做照常干，领导须要几个新功能接口开发。之前在公司办公，一般开发完的功能没什么问题，暴露出 Swagger 接口文档，直接找旁边的前端大人联调测试了git

当下，君在长江头，我在长江尾，夜夜思君不敢出门见君啊，一切测试全交给本身吧，
github

虽然想念前端，可是在家办公也绝对是和在公司办公同样同样的，高效不（qu）摸鱼json

插播背景api

在多个产品线上来回穿切换着开发功能，之前用Postman的场景是这样的:
浏览器

实际远远不止这几个文件夹来归类多个产品线的接口，Postman的功能很是强大，可是面对如下这些情况时，我以为调试一个接口太麻烦了（这里不讨论工具的好坏，工具是帮助咱们提升效率的，每一个人的需求也不同，我只说明我我的遇到的一些状况，不喜请勿喷）数据结构

查找配置多数要经过鼠标点来点去, 与习惯文本和快捷键操做的便捷方式违背
调试别人接口要导入他们的一些数据，比较麻烦
多个产品线环境变量查看不直观
写完接口要来回切换应用进行测试，好比（IDEA <——> Postman）
快速定位接口比较麻烦
......
无心间发现 IntelliJ IDEA 的 HTTP Client 工具恰好能解决我上面提到的一些问题，简单的说就是能直接在 IDEA 的代码编辑器中建立，编辑，执行 HTTP请求，就像这样(若是你心动了，请继续向下看吧)：

因而，去官网查看一番做出以下整理：app

走进 Http Client编辑器

HTTP Client 是 IDEA 默认绑定好并启用的插件，若是你那里没有启用，按照下图启用就好
ide

点击菜单：Tools — HTTP Client — Test RESTful Web Service

接下来进入下面的界面：

上图已给出提示，REST Client 是被弃用的，点击右侧的 Convert request to new format , 进到下面界面：

默认会建立一个名为 rest-api.http 的文件，该文件被存储在 Scratches 文件夹下，为了突出主角光环，关于 Scratch Files 请官网自行查看（继续向下看不影响理解的），黄色框线的功能也很是有用，继续向下看

建立 HTTP request 文件

刚刚提到的 rest-api.http 就是 HTTP request 文件，能够经过两种方式建立：

经过快捷键 ⇧⌘N 而后选择 HTTP Request. （文件存放在Scratches 文件夹）
经过菜单操做 File—New—HTTP Request （文件存放在咱们指定的目录下，就和咱们平时建立class/package是同样同样滴）
若是在项目中使用，这里推荐使用第二种方式，由于它能够做为项目文件，经过 Git 提交到仓库，你们共享文件，共同维护接口请求数据，天然就不会出现调试别人接口还要导入他人数据的状况啦

编辑 HTTP request 文件

咱们模拟实际项目中场景来编辑文件

用户登陆，成功后获取 Token，一般是 POST 请求
用户后续访问行为都要在请求头中携带登陆成功返回的 Token
经过点击 Add Request，选择相应的方法就能够编写啦

都知道，一般写一个完整的请求须要写好多内容，贴心的 IDEA 给咱们提供了模版，咱们只须要在 Examples 中找模版就能够啦，好比找 POST 请求的模版，选取合适的拷贝过去就能够，so easy～～～

到这里，就能够发送基本的请求了，可是，一个项目中接口众多，如何快速生成参数？如何快速切换端口？如何让登陆以后的每一个请求自动携带成功返回的 Token？咱们须要更高级的玩法

HTTP Client 进阶玩法

使用环境变量
在编写HTTP请求时，可使用变量对其元素进行参数化。变量能够保存请求的host、port和path、查询参数或值、请求头值或请求体值等.

使用变量的方式很是简单，就用两个大括号包围定义好的变量就能够了，就像这样：

固然咱们也要有地方定义变量

定义环境变量
环境变量须要定义在环境文件中，环境文件有两种：

建立名为 rest-client.env.json 或者 http-client.env.json 的环境文件(其实里面就是保存 JSON 数据)，该文件里能够定义用在整个项目上的全部常规变量
建立名为rest-client.private.env.json 或者 http-client.private.env.json，看文件名你应该也猜到这是保存敏感数据的，好比密码，token等，该文件默认是被加入到 VCS 的 ignore文件中的，同时优先级高于其余环境文件，也就是说，该文件的变量会覆盖其余环境文件中的变量值
里面的文件内容就像这样

{
  "dev": {
    "host": "localhost",
    "port": 8081,
    "identifier": "tanrgyb",
    "password": "iloveu"
  },
  "prod": {
    "host": "dayarch.top",
    "port": 8080,
    "identifier": "admin",
    "password": "admin"
  }
}

运行一下咱们编写的请求吧：

IDEA自动识别多个环境，这样就能够垂手可得的切换环境，使用不一样的变量值了（这皮鞋，你说亮不亮，还有更亮的）

巧用 response handler 脚本
上面提到，咱们要让登陆成功后的全部请求都自动携带成功返回的 Token，这样不用咱们每次都手动将其添加到header中，一样有两种方式将脚本插入到请求中

内嵌方式

GET host/api/test

> {%
response 脚本
%}

外部文件方式（就是将内嵌的脚本抽离出到文件中）

GET host/api/test

> scripts/my-script.js

以登陆返回获取的token设置到变量中为例，看代码：

POST http://{{host}}:{{port}}/login
Content-Type: application/json
Accept: application/json

> {%
client.global.set("auth_token", response.body.result.token);
 %}

注意
response.body.result.token 是我按照我登陆返回的数据结构写的，不一样结构不同，你也能够是这样的 response.body.token , response.body 以后根据你的数据结构发挥吧
我仍是不放心，把个人登陆返回结构（项目中怎样设计这种结构，能够参考以前写的Springboot返回统一JSON数据格式是怎么实现的？)粘贴在此处吧，这回理解了吧？

接下来咱们就能够愉快的在其余请求上携带这个 Token 了

注意
这里的Authorization 类型，你们根据本身的实际状况作修改，好比：Authorization: Bearer {{auth_token}}
以上这些已经知足个人平常使用，没有进一步了解更多，更多关于 Response 脚本的用法请你们查看官网 HTTP Response reference吧

你觉得到这里结束了（OMG），还有香料须要和你们分享，搭配上面功能使用更棒哦

辅助功能说明

RestfulToolkit
RestfulToolkit 一样是个插件，在插件市场搜索安装便可

安装了这个插件后，打开侧边栏，项目的全部接口信息都会展示在此处：

我经常使用的功能就是把指定接口生成的JSON数据拷贝到 HTTP request 文件中，免去手写的麻烦了，你说方便不？

除此以外，使用快捷键 cmd+\, 能够根据关键字快速找到接口，回车迅速到达代码接口位置，这也是带来了极大的便利

Live Template
项目中请求内容各有不一样，IDEA标准提供的GET POST 请求案例可能还不能知足咱们的需求，这时咱们就能够利用 Live Template 定制本身的模版，迅速生成request 内容，像这样：

JSON Viewer
JSON Viewer是一款 Chrome浏览器插件，在浏览器 Omini-box 中输入 json-viewer + Tab, 粘贴json在此处，就能够对json数据进行格式化了

打开开发者工具，在Network下双击某个HTTP请求，会自动在 new tab下格式化返回的json数据，免去了粘贴数据而后格式化的烦恼

关于自测接口的干货我抖的差很少了，抖抖更健康

总结

再次重申，不作工具党，也没有任何批判之意，工具只是为了让咱们更高效的工做，选择适合本身的。从上面的介绍中来看，IDEA HTTP client 搭配我说的几个辅助功能很好的解决了文章开头说明的几个问题，对我我的状况来讲，足矣！！

截图码字不易

若是你认为本文对你有帮助，还请「在看/转发/赞」（这就是送个人大火箭