沉浸式集成阿里云 OpenAPI|Alibaba Cloud API Toolkit for VS Code

简介: Alibaba Cloud API Toolkit for VSCode 是集成了 OpenAPI 开发者门户多项功能的 VSCode 插件,开发者可以通过这个插件方便地查找API文档、进行API调试、插入SDK代码,并配置基础环境设置。我们的目标是缩短开发者在门户和IDE之间的频繁切换,实现API信息和开发流程的无缝结合,让开发者的工作变得更加高效和紧密。


前言

OpenAPI 开发者门户是一个中心枢纽,提供 OpenAPI 搜索、文档、在线调试、SDK 获取、CodeSample、调用出错诊断、调用统计等功能。门户建立了用户学习和集成OpenAPI的完整路径,能够显著降低用户学习和集成OpenAPI的成本。

IDE 插件则是用于扩展和定制 IDE 功能的软件组件。它们可以添加新的工具、功能或集成第三方服务,来提高开发人员的生产力。比如 VS Code 这样的集成开发环境,通过插件系统支持丰富的扩展。插件可以用于语言支持、调试、主题定制、代码片段、自动补全等各种用途。

那么将 OpenAPI 门户和 IDE 通过插件系统相结合,会产生什么化学反应呢?答案就是更加沉浸式的 API 集成体验:

  1. 提高开发效率:集成开发环境(IDE)插件可以使开发人员在其常用开发工具中直接访问和试用 OpenAPI 服务,无需切换到其他平台或文档;除此之外,利用代码自动补全、语法校验等 IDE 插件能力,能够为开发者快速提供阿里云 OpenAPI 的 SDK Code Snippets 以及接入 AI 问答等能力,将阿里云 OpenAPI 集成的学习和集成在 IDE 中闭环,让门户变成开发者提效工具。
  2. 简化调试过程:插件可以提供调试平台和 SDK 代码示例,帮助开发人员更轻松地调试他们的应用程序与 OpenAPI 服务的集成;
  3. 增强用户体验:通过在开发人员熟悉的环境中提供对 OpenAPI 的访问,可以改善他们的工作流程,从而提高满意度并降低学习成本

插件功能一览

图1.jpg

  • 阿里云产品订阅:
  • 插件提供了一键订阅阿里云产品的功能,支持选择产品不同版本 API,并给予推荐版本提示,无需配置文件,可以通过快捷键 ctrl+cmd+k 搜索和订阅阿里云产品;
  • 支持全量展示云产品及其分类的树视图,用户可以直接点击对应云产品进行订阅操作。
  • API 搜索:
  • 支持搜索已订阅的 API,也可以通过快捷键 ctrl+cmd+l 搜索并查看已订阅的 API 文档或插入代码段。
  • API 文档预览:
  • 点击 API 可以打开一个新的标签页,并显示对应的 API 文档,文档包括接口说明、请求参数、响应参数和错误码。
  • API 调试:
  • 联动阿里云 CLI 和 VSCode CLI 插件身份配置,配置 AK 后可支持 API 调试;
  • 支持参数表单填写的方式调试阿里云 API,并查看结果;
  • 调用返回结果可以直接在编辑器中快速打开。
  • SDK 代码示例:
  • 支持通过参数表单填写的方式获得不同语言的 SDK 代码示例,并支持在编辑器中快速打开对应的 SDK 代码或另存为新文件;
  • 支持语言选择记忆,无需每次都要切换语言。
  • Code Snippets:
  • 支持代码片段功能,帮助用户快速编写 SDK 代码;
  • 支持快速搜索 API ,来插入 API 调用代码段能力;
  • 支持与 Linter 联动,快速修复未导入的依赖包(TypeScript)。
  • profiles 管理:
  • 管理你的阿里云 profiles。
  • 敏感信息检测:
  • 支持检测代码中的敏感信息,防止敏感信息泄漏风险。

IDE 插件带来的体验提升

为什么要把 OpenAPI 门户放到 IDE 里,归根结底就是为了给开发者提供更加便利、舒适、高效的 API 学习和开发环境,提升阿里云 OpenAPI 的学习和集成开发体验。VS Code 作为近年来最受欢迎的 IDE,在开发者体验上已经打好了坚硬的基石,那么 IDE 插件到底能为用户的 API 学习与集成之路带来什么体验提升呢?

📖 工作台拓展 - 便捷的文档查阅

通过工作台拓展(Workbench Extensions)插件在侧边栏增加了一个可交互的树视图(TreeView),并通过 Webview API创建一个自定义的用户界面(Webview)来实现自定义内容渲染。这样,我们就可以把 API 文档、API 调试、SDK 代码示例等通过 Webview 的方式嵌入到 VS Code 中,方便开发者一边比对文档,一边进行 API 的集成开发,开发者再也不用浏览器窗口和 IDE 来回切换了

图2.jpg

API 文档查阅

图3.png

Profiles 管理

新增和切换阿里云 profiles。

图4.jpg

📋 配置文件零感知的云产品订阅能力

利用云产品订阅机制结合 VSCode 的数据存储,能够做到用户零配置使用插件,这是因为将配置文件存储在了 VSCode 的全局域中,用户通过视图交互来进行配置管理,对配置文件零感知。

快捷操作

图5.jpg

快速搜索

利用视图交互、快捷键、快速选择等能力,用户就可以直接在 IDE 中快速搜索云产品和 API,非常方便。开发者可以很容易的通过操作栏的图标或者快捷键进行快速选择。以插件快速搜索云产品及选择对应版本进行订阅的操作为例:

快速搜索云产品ctrl+cmd+k

图6.jpg

快速搜索 API 并预览 API 说明ctrl+cmd+l

图7.jpg

🚀 API 调试 & SDK 代码示例与 Editor 的无缝衔接

在网页版门户中,用户可能需要对 API 调试结果进行处理,需要将调试结果复制到编辑器中,再进行查看或者处理,生成的 SDK 示例代码也是需要进行跨平台的复制。

在 IDE 插件中,API 调试和 SDK 代码示例的能力是在 Webview 中呈现的,通过 Webview 和 VS Code 的消息机制,能将这些能力与编辑器代码区无缝衔接起来。

图8.jpg

图9.jpg

可以通过在 Webview 中点击「在 IDE 中打开」按钮,就能在编辑器中快速打开一个 Editor 标签页,然后用户就可以进行编辑等后续操作。同理,我们就可以完成调试表单的通信来完成 API 试用以及 SDK 代码示例生成等等功能。

图10.jpg

🔨  编程式语言特性:CodeSnippets & 快速修复

编程式语言特性可能是用户在使用 IDE 版本的 OpenAPI 门户时,感受到的最明显的体验升级。利用这个能力,我们可以给用户提供不同 API 的代码片段,帮助用户快速编写 SDK 代码。

图11.gif


CodeSnippets

图12.jpg

快速修复

VSCode 提供了 CodeActionsProviderAPI,用于向编辑器注册 Code Actions Provider。Code Actions 是 IDE 提供的一种功能,允许开发者通过特定的上下文菜单或者快捷键执行代码修正、重构、格式化等操作。通过这个 API 我们能够实现一些例如快速修复等能力。

如果你安装了当前语言的 Linter,插件就可以拿到当前代码文档的全部诊断信息,比如用户在使用了 SDK 后,未导入依赖,这时,Linter 插件就会报错,你可以使用「快速修复」导入依赖。

图13.jpg

📄 文档增强

能够在编写 SDK 代码时,通过代码文档看到 OpenAPI 的描述信息以及更多相关示例链接,来获得更多代码示例参考。

图14.jpg

⚠️ 敏感信息检测

图15.jpg

总结

从 OpenAPI 用户旅程来看,Alibaba Cloud API Toolkit 已经完成了搜寻 OpenAPI;通过文档、调试、SDK 代码示例来学习和试用 API;在编辑器中辅助开发者集成 API 的能力。阿里云 OpenAPI 插件,目前的功能形态目前更适合有一定经验的开发者作为提效工具进行使用,结合了 IDE 的相关代码能力是网页版无法提供的,如果今后能够结合 AI 能力,在问答、搜索、诊断上有进一步优化,会对搜寻 API 、学习 API 和 API 问题排查这三个部分有一个更大的体验提升。


OpenAPI 开发者门户插件一览表

👏 欢迎大家安装体验!

API 插件:IDE 内快速查阅阿里云产品的 API

📌 VS Code:Alibaba Cloud API Toolkit

📌 JetBrains:Alibaba Cloud Developer Toolkit

CLI 插件:快速而高效地编写 CLI 语句

📌 VS Code: Alibaba Cloud CLI Tools

相关文章
|
28天前
|
API
阿里云短信服务文档与实际API不符
阿里云短信服务文档与实际API不符
|
26天前
|
弹性计算 网络安全
阿里云国际OpenAPI多接口快速管理ECS服务器教程
阿里云国际OpenAPI多接口快速管理ECS服务器教程
|
18天前
|
存储 人工智能 自然语言处理
Elasticsearch Inference API增加对阿里云AI的支持
本文将介绍如何在 Elasticsearch 中设置和使用阿里云的文本生成、重排序、稀疏向量和稠密向量服务,提升搜索相关性。
63 14
Elasticsearch Inference API增加对阿里云AI的支持
|
8天前
|
安全 Java API
【三方服务集成】最新版 | 阿里云短信服务SMS使用教程(包含支持单双参数模板的工具类,拿来即用!)
阿里云短信服务提供API/SDK和控制台调用方式,支持验证码、通知、推广等短信类型。需先注册阿里云账号并实名认证,然后在短信服务控制台申请资质、签名和模板,并创建AccessKey。最后通过Maven引入依赖,使用工具类发送短信验证码。
【三方服务集成】最新版 | 阿里云短信服务SMS使用教程(包含支持单双参数模板的工具类,拿来即用!)
|
2天前
|
运维 Cloud Native 应用服务中间件
阿里云微服务引擎 MSE 及 云原生 API 网关 2024 年 10 月产品动态
阿里云微服务引擎 MSE 面向业界主流开源微服务项目, 提供注册配置中心和分布式协调(原生支持 Nacos/ZooKeeper/Eureka )、云原生网关(原生支持Higress/Nginx/Envoy,遵循Ingress标准)、微服务治理(原生支持 Spring Cloud/Dubbo/Sentinel,遵循 OpenSergo 服务治理规范)能力。API 网关 (API Gateway),提供 APl 托管服务,覆盖设计、开发、测试、发布、售卖、运维监测、安全管控、下线等 API 生命周期阶段。帮助您快速构建以 API 为核心的系统架构.满足新技术引入、系统集成、业务中台等诸多场景需要
|
6天前
|
监控 Ubuntu Linux
使用VSCode通过SSH远程登录阿里云Linux服务器异常崩溃
通过 VSCode 的 Remote - SSH 插件远程连接阿里云 Ubuntu 22 服务器时,会因高 CPU 使用率导致连接断开。经排查发现,VSCode 连接根目录 ".." 时会频繁调用"rg"(ripgrep)进行文件搜索,导致 CPU 负载过高。解决方法是将连接目录改为"root"(或其他具体的路径),避免不必要的文件检索,从而恢复正常连接。
|
16天前
|
弹性计算 负载均衡 监控
阿里云slb的slb-api介绍
【10月更文挑战第17天】
46 1
|
28天前
|
API
阿里云短信平台API错误码提示错误天级流控显示小时级错误码
阿里云短信平台API错误码提示错误天级流控显示小时级错误码
|
1月前
|
运维 Cloud Native 应用服务中间件
阿里云微服务引擎 MSE 及 云原生 API 网关 2024 年 09 月产品动态
阿里云微服务引擎 MSE 面向业界主流开源微服务项目, 提供注册配置中心和分布式协调(原生支持 Nacos/ZooKeeper/Eureka )、云原生网关(原生支持Higress/Nginx/Envoy,遵循Ingress标准)、微服务治理(原生支持 Spring Cloud/Dubbo/Sentinel,遵循 OpenSergo 服务治理规范)能力。API 网关 (API Gateway),提供 APl 托管服务,覆盖设计、开发、测试、发布、售卖、运维监测、安全管控、下线等 API 生命周期阶段。帮助您快速构建以 API 为核心的系统架构.满足新技术引入、系统集成、业务中台等诸多场景需要
|
API
阿里云API大赛决赛在即,15战队将上演争冠之战
阿里云API应用创新大赛总决赛来袭,15个参赛战队上演夺冠之位
1620 0