• 你有一个思想,我有一个思想,我们交换后,一个人就有两个思想

  • If you can NOT explain it simply, you do NOT understand it well enough

现陆续将Demo代码和技术文章整理在一起 Github实践精选,方便大家阅读查看,觉得不错,还请Star

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

当下,君在长江头,我在长江尾,夜夜思君不敢出门见君啊,一切测试全交给自己吧,

虽然想念前端,但是在家办公也绝对是和在公司办公一样一样的,高效不(qu)摸鱼

插播背景

在多个产品线上来回穿切换着开发功能,以前用Postman的场景是这样的:

实际远远不止这几个文件夹来归类多个产品线的接口,Postman的功能非常强大,但是面对以下这些状况时,我觉得调试一个接口太麻烦了 (这里不讨论工具的好坏,工具是帮助我们提高效率的,每个人的需求也不一样,我只说明我个人遇到的一些情况,不喜请勿喷)

  • 查找配置多数要通过鼠标点来点去, 与习惯文本和快捷键操作的便捷方式违背
  • 调试别人接口要导入他们的一些数据,比较麻烦
  • 多个产品线环境变量查看不直观
  • 写完接口要来回切换应用进行测试,比如(IDEA <——> Postman)
  • 快速定位接口比较麻烦
  • ......

无意间发现 IntelliJ IDEA 的 HTTP Client 工具刚好能解决我上面提到的一些问题,简单的说就是能直接在 IDEA 的代码编辑器中 创建,编辑,执行 HTTP请求,就像这样(如果你心动了,请继续向下看吧):

于是,去官网查看一番作出如下整理:

走进 Http Client

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

点击菜单:ToolsHTTP ClientTest RESTful Web Service

接下来进入下面的界面:

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

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

创建 HTTP request 文件

刚刚提到的 rest-api.http 就是 HTTP request 文件,可以通过两种方式创建:

  1. 通过快捷键 ⇧⌘N 然后选择 HTTP Request. (文件存放在Scratches 文件夹)
  2. 通过菜单操作 File—New—HTTP Request (文件存放在我们指定的目录下,就和我们平时创建class/package是一样一样滴)

如果在项目中使用,这里推荐使用第二种方式,因为它可以作为项目文件,通过 Git 提交到仓库,大家共享文件,共同维护接口请求数据,自然就不会出现调试别人接口还要导入他人数据的情况啦

编辑 HTTP request 文件

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

  1. 用户登录,成功后获取 Token,通常是 POST 请求
  2. 用户后续访问行为都要在请求头中携带登录成功返回的 Token

通过点击 Add Request,选择相应的方法就可以编写啦

都知道,通常写一个完整的请求需要写好多内容,贴心的 IDEA 给我们提供了模版,我们只需要在 Examples 中找模版就可以啦,比如找 POST 请求的模版,选取合适的拷贝过去就可以,so easy~~~

到这里,就可以发送基本的请求了,但是,一个项目中接口众多,如何快速生成参数?如何快速切换端口?如何让登录之后的每个请求自动携带成功返回的 Token?我们需要更高级的玩法

HTTP Client 进阶玩法

使用环境变量

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

使用变量的方式非常简单,就用两个大括号包围定义好的变量就可以了,就像这样:

当然我们也要有地方定义变量

定义环境变量

环境变量需要定义在环境文件中,环境文件有两种:

  1. 创建名为 rest-client.env.json 或者 http-client.env.json 的环境文件(其实里面就是保存 JSON 数据),该文件里可以定义用在整个项目上的所有常规变量
  2. 创建名为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 搭配我说的几个辅助功能很好的解决了文章开头说明的几个问题,对我个人情况来说,足矣!!

截图码字不易

  • 如果你认为本文对你有帮助,还请「在看/转发/赞」(这就是送我的大火箭,大跑车,大灰机️)

  • 如果你还发现了更好的功能还请补充在留言区,我回头继续补充这块内容,万分感谢

  • 公众号回复「工具」,还有更精彩的等着你

灵魂追问

  1. Kibana的Dev Tools用来调试ES接口和这个界面很相似,可以延伸了解一下相关知识
  2. 你在项目中如何高效测试接口与联调的呢?还请大方赐教
  3. 在家办公和公司办公对你有什么影响?

参考


IntelliJ IDEA的这个接口调试工具真是太好用了!的更多相关文章

  1. Rest Client(Rest接口调试工具,有保存功配置功能) chrome浏览器插件

    Rest Client(Rest接口调试工具,有保存功配置功能) chrome浏览器插件 下载地址 插件的操作很简单,下面是一些简单的实例. 1.安装 在谷歌应用商城搜索postman,如下图1-1所 ...

  2. IntelliJ IDEA中Mapper接口通过@Autowired注入报错的正确解决方式

    转载请注明来源:四个空格 » IntelliJ IDEA中Mapper接口通过@Autowired注入报错的正确解决方式: 环境 ideaIU-2018.3.4.win: 错误提示: Could no ...

  3. boot项目swagger接口调试工具默认访问路径

    今天第一次接触boot项目,项目里集成了swagger接口调试工具,以前写项目的时候在swagger 文件夹里可以找到访问路径,换成boot项目以后找不到swagger文件夹了,百度了一下,boot项 ...

  4. 接口调试工具Postman之自动同步Chrome cookies,实现自动登陆验证

    前言 在前后端分离开发时,做为后端开发人员,要求独立开发完成某个接口后,开发人员自己需要先测试通过后再提交给测试人员进行测试,否则会出现到测试人员哪里业务流程根本就走不通,或者BUG会过多的情况等. ...

  5. Firefox火狐 浏览器接口调试工具 JSON 格式化

    作为一名“IT界”的淫才,还是主攻Web端的淫才,相信大家经常会联调各种接口! 如今APP猖狂的年代接口联调更为频繁,当然我们常用于Firefox火狐 浏览器,所以这里主要讲Firefox火狐 浏览器 ...

  6. 接口调试工具ApiPost的发送超时时间设置方法

    有部分使用ApiPost的同学反应:发送接口调试时,响应超时时间设置的太短导致接口访问失败,怎么设置呢? 就连百度也有很多人在搜: 今天就来说一说. ApiPost简介: ApiPost是一个支持团队 ...

  7. ApiPost接口调试工具模拟Post上传文件(中文版Postman)

    ApiPost简介: ApiPost是一个支持团队协作,并可直接生成文档的API调试.管理工具.它支持模拟POST.GET.PUT等常见请求,是后台接口开发者或前端.接口测试人员不可多得的工具 . A ...

  8. C#API接口调试工具

    自从去年软件界网站开发推崇前后端分离,我们公司也在进行转行行,从原先的前端架构,后端架构,数据库搭建一肩挑的模式也逐渐转型为前后端分离,大量招收前端开发人员,原来的人员也转型为专职的后端开发,这样的变 ...

  9. 强大的接口调试工具-Postman图文详解

    前言 在前后端分离开发时,后端工作人员完成系统接口开发后,需要与前端人员对接,测试调试接口,验证接口的正确性可用性.而这要求前端开发进度和后端进度保持基本一致,任何一方的进度跟不上,都无法及时完成功能 ...

随机推荐

  1. 前端-jQuery介绍

    目录 jQuery介绍 jQuery的优势 jQuery内容: jQuery版本 jQuery对象 jQuery基础语法 查找标签 基本选择器 层级选择器: 基本筛选器: 属性选择器: 表单筛选器: ...

  2. 关于面试题:[1, 2, 3].map(parseInt)问题的剖析

    一.前言 最近有小伙伴在公号中咨询了胡哥这道面试题,窃以为是比较有意思的一道面试题,于此分享给各位小伙伴.先把答案给了各位,和你理解的一样吗?! [1, 2, 3].map(parseInt) // ...

  3. 「SP122」STEVE - Voracious Steve 解题报告

    SP122 STEVE - Voracious Steve 题意翻译 Problem Steve和他的一个朋友在玩游戏,游戏开始前,盒子里有 n个甜甜圈,两个人轮流从盒子里抓甜甜圈,每次至少抓 1个, ...

  4. Python for Data Analysis 学习心得(四) - 数据清洗、接合

    一.文字处理 之前在练习爬虫时,常常爬了一堆乱七八糟的字符下来,当时就有找网络上一些清洗数据的方式,这边pandas也有提供一些,可以参考使用看看.下面为两个比较常见的指令,往往会搭配使用. spli ...

  5. 20.用PyInstaller打包py程序的步骤及问题解决

    最近写了一个移动和复制文件的代码,代码完成之后,想将其打包成一个可以在任何电脑上使用的软件, 于是在网上查找相关资料,可以用PyInstaller打包成.exe程序,以下是具体步骤: 1.安装PyIn ...

  6. less实现if else

    less没有我们平常使用的if,else条件判断,而是用when来实现这种用法 1.比如我们要设置宽度 宽度可以百分比,也可以是像素,当是百分比时做对应处理,当是px时做另一种处理,这时候就需要用wh ...

  7. Go Web 编程之 模板(一)

    概述 模板引擎是 Web 编程中必不可少的一个组件.模板能分离逻辑和数据,使得逻辑简洁清晰,并且模板可复用.引用第二篇文章<程序结构>一文中的图示,我们可以看到模板引擎在 Web 程序结构 ...

  8. 解决vue中element组件样式修改无效

    vue中element组件样式修改无效 <style> .detail{ .el-input__inner { height: 48px; } } </style> 直接写st ...

  9. python如何计算程序(代码块)的运行时间?

    1.引入time模块 2.调用time模块的time()函数 :用来获取当前的时间,返回的单位是秒 # 引入一个time模块, * 表示time模块的所有功能, # 作用: 可以统计程序运行的时间 f ...

  10. Java 利用Map集合计算一个字符串中每个字符出现的次数

    步骤分析 1.给出一串字符串,字符串中可以包含字母.数字.符号等等. 2.创建一个Map集合,key是字符串中的字符,value是字符的个数. 3.遍历字符串,获取每一个字符. 5.使用获取到的字符, ...