VSCode 的 HTTP REST API 调试插件 —— Thunder Client

Postman 如何引导我创建自己的 API 客户端 :Thunder Client VS Code 扩展

我为自己的项目工作 localmint.com,我需要定期更新位置数据,这涉及到处理大量爬虫程序和 API。过去几年,我一直在使用 Postman 测试 API,但最近每次更新,Postman 桌面客户端的加载速度都变慢,UI 也变得混乱。

因此,我开始寻找其他客户端,发现他们需要多次点击才能发出简单的 api 请求,并且具有复杂的 UI。然后我搜索了 Visual Studio代码扩展库,找到了REST 客户端扩展,它很流行,但不是基于 GUI 的客户端。所以我最终决定创建自己的 API 客户端。

由于我经常使用 Visual Studio Code 进行开发,所以我决定开发 扩展,而不是单独下载软件,而且还有数百万用户已经在使用 VS Code。我为新扩展设置了以下设计目标

扩展设计目标

  • 轻量级 API 客户端

  • 简单、整洁且易用的用户界面

  • 处理大型响应并全屏查看

  • 支持 VS Code 主题

  • 集合 & 环境变量

  • 无脚本测试

发展

我开始了关于如何使用 VS Code api 开发扩展的初步研究,持续了几天,然后开始开发软件。最终能够完成上述目标功能的扩展开发。下面是扩展的屏幕截图

Laravel

Thunder Client 扩展

技术

用于开发 VS Code 扩展的技术有 Javascript、Flexbox、Typescript、Ace编辑器、Got、Nedb。没有使用 Javascript 或 bootstrap 框架。

无脚本测试

我注意到我们需要在 Postman 和其他客户端中编写大量样板代码,以便使用脚本(如 status code equal 200)进行基本测试。因此,我实现了基于 GUI 的测试,在这里,您可以选择两个下拉列表来轻松地执行大多数标准测试,而无需任何脚本知识。下面是测试的屏幕截图。

  • (更新)现在可以从测试选项卡中的 api 响应中设置环境变量,有关详细信息,请参阅 Github 页面。

Laravel

Thunder Client 测试

上面截图中的 5 个测试用例只花了几秒钟就完成了,在 Thunder 客户端中进行测试就是如此简单。

在脚本中要做相同的测试需要花费大量时间,并且需要脚本编写方面的知识。下面是在 Postman 中执行相同测试所需的代码。我必须在 google 上搜索一些测试的语法。

// 状态码测试
pm.test("Status code is 200", function () {
  pm.response.to.have.status(200);
});
// 属性检查
pm.test("Property message contains Thunder Client", function () {
   var jsonData = pm.response.json();
   pm.expect(jsonData.message).to.contains("Thunder Client");
});
// 响应 content-type 检查
pm.test("Content-Type contains application/json", function () {
   pm.response.to.be.header("Content-Type", "application/json");
});

基于脚本的测试在高级场景中仍然很有用,但对于标准测试来说太过繁琐。

扩展链接

反馈

请下载扩展,让我知道你喜欢什么或想反馈的内容。要报告任何 bug 或功能请求,请访问 Github 支持页面。

联系

你可以通过 Linkedin 或 Twitter 与我联系

本文中的所有译文仅用于学习和交流目的,转载请务必注明文章译者、出处、和本文链接
我们的翻译工作遵照 CC 协议,如果我们的工作有侵犯到您的权益,请及时联系我们。

原文地址:https://rangav.medium.com/thunder-client...

译文地址:https://learnku.com/laravel/t/61016

本文为协同翻译文章,如您发现瑕疵请点击「改进」按钮提交优化建议
《L04 微信小程序从零到发布》
从小程序个人账户申请开始,带你一步步进行开发一个微信小程序,直到提交微信控制台上线发布。
《G01 Go 实战入门》
从零开始带你一步步开发一个 Go 博客项目,让你在最短的时间内学会使用 Go 进行编码。项目结构很大程度上参考了 Laravel。
讨论数量: 2

好的,我一定给你start

2年前 评论
mouc

正常情况下用apidoc来测试API, 但是它不能上传文件。所以也安装了这个用于文件上传的情况。

2年前 评论

讨论应以学习和精进为目的。请勿发布不友善或者负能量的内容,与人为善,比聪明更重要!