WebIDE编写插件，插件开发_API 网关(API Gateway)-阿里云帮助中心

云原生API网关通过插件来为您提供定制化的扩展能力。本文介绍如何通过WebIDE一站式完成自定义插件的开发和编译。

背景信息

为了解决自定义插件编写门槛较高，搭建开发环境难的问题，云原生API网关提供了一个包含插件开发环境的WebIDE Runtime，您可以通过WebIDE一站式完成自定义插件的开发和编译。

应用场景

重要

关闭WebIDE窗口前，请确保您已导出代码/WASM文件，否则您当前编写的插件将会丢失，且无法找回。

场景一：从零开始编写网关插件

登录云原生API网关控制台。
在左侧导航栏，选择插件，并在顶部菜单栏选择地域。
在插件页面单击WebIDE编写插件。
在弹框中选择插件语言，单击新建空白项目卡片。
单击开始编写。

场景二：在导入预设样例基础上编写网关插件

登录云原生API网关控制台。
在左侧导航栏，选择插件，并在顶部菜单栏选择地域。
在插件页面单击WebIDE编写插件。
在弹框中选择插件语言，单击导入样例工程。
单击开始编写。

场景三：使用AI大模型，根据提出的插件需求自动生成插件代码

登录云原生API网关控制台。
在左侧导航栏，选择插件，并在顶部菜单栏选择地域。
在插件页面单击WebIDE编写插件。
在弹框中选择插件语言，单击AI助手辅助生成。
在插件需求编辑框中使用自然语言详细描述需求。
单击开始生成以创建AI生成任务。
生成完成后单击浮窗查看详情。

插件代码基本结构

网关插件的开发包括配置解析和处理函数两个部分，配置解析是读取插件输入配置的过程，处理函数则是指请求头处理、请求体处理、响应头处理以及响应体处理的四个函数。

type MyConfig struct {
    // config items
}

func parseConfig(json gjson.Result, config *MyConfig, log wrapper.Log) error {
    // parse config form json
    return nil
}

// 请求头处理函数
func onHttpRequestHeaders(ctx wrapper.HttpContext, config MyConfig, log wrapper.Log) types.Action {}

// 请求体处理函数
func onHttpRequestBody(ctx wrapper.HttpContext, config MyConfig, body []byte, log wrapper.Log) types.Action {}

// 响应头处理函数
func onHttpResponseHeaders(ctx wrapper.HttpContext, config MyConfig, log wrapper.Log) types.Action {}

// 响应体处理函数
func onHttpResponseBody(ctx wrapper.HttpContext, config MyConfig, body []byte, log wrapper.Log) types.Action {}

WebIDE基本能力

WebIDE中预装了higress-plugin-helper插件，您可以通过Ctrl+Shift+P （Windows/Linux）或 Cmd+Shift+P （Mac）打开vscode命令面板，输入higress后，可以看到如下5条命令：

命令	使用说明
`Higress 插件：Init`	生成一个基本的wasm-go插件项目，您可基于此项目进行修改实现自己的业务逻辑。
`Higress 插件：Build`	编译wasm插件。
`Higress 插件：Run/Restart`	运行wasm插件，您可通过`localhost:8080`访问envoy代理的httpbin服务来验证插件逻辑；如果修改了插件配置文件，您可以通过该命令重新加载插件使新配置生效。
`Higress 插件：Stop`	停止插件运行。
`Higress 插件：Build & Run`	修改代码后，运行该命令编译插件并且运行。

执行 Higress 插件：Build 进行插件的编译，如遇到编译失败情况，可以在terminal中手动执行以下命令：

go mod tidy
tinygo build -o main.wasm -scheduler=none -target=wasi -gc=custom -tags="custommalloc nottinygc_finalizer"
#如果在header阶段返回了 `types.HeaderStopIteration` 应该使用以下命令编译
#tinygo build -o main.wasm -scheduler=none -target=wasi -gc=custom -tags="custommalloc nottinygc_finalizer proxy_wasm_version_0_2_100"

在您选择新建空白项目或者导入样例工程编写插件时，WebIDE还提供了导入代码、导出代码、导出WASM文件的快捷功能，以加速您的插件开发流程。

导入代码

重要

在导入代码之前，请您确保已导出当前工程的代码/WASM文件，否则您当前编写的插件将会丢失，且无法找回。

在WebIDE编写插件页面，单击导入代码。
在确认导入代码弹框中，确认无误后，点击仍要导入，选择本地工程zip包。
WebIDE将会自动加载导入的工程。

导出代码

在WebIDE编写插件页面，单击导出代码。
浏览器将创建下载任务，将当前IDE工程打成ZIP包下载至本地默认下载地址。

导出WASM文件

重要

在导出WASM文件前，请检查当前代码是否已生成wasm文件，若未生成导出将失败。

在WebIDE编写插件页面，单击导出WASM文件。
浏览器将创建下载任务，将当前工程的.wasm文件下载到本地默认下载地址。