云原生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还提供了导入代码、导出代码、导出WASM文件的快捷功能，以加速您的插件开发流程。
导入代码
在导入代码之前，请您确保已导出当前工程的代码/WASM文件，否则您当前编写的插件将会丢失，且无法找回。
在WebIDE编写插件页面，单击导入代码。
在确认导入代码弹框中，确认无误后，点击仍要导入，选择本地工程zip包。
WebIDE将会自动加载导入的工程。
导出代码
在WebIDE编写插件页面，单击导出代码。
浏览器将创建下载任务，将当前IDE工程打成ZIP包下载至本地默认下载地址。
导出WASM文件
在导出WASM文件前，请检查当前代码是否已生成wasm文件，若未生成导出将失败。
在WebIDE编写插件页面，单击导出WASM文件。
浏览器将创建下载任务，将当前工程的.wasm文件下载到本地默认下载地址。
基于TinyGo的插件代码编译需要依赖各种包，因此需要您保证工程正常编译后才能导出.wasm文件。常用编译流程如下：
1.进入主函数所在包
cd project/.../
2.下载依赖包
go mod tidy
3.执行编译
tinygo build -o main.wasm -target wasm ./main.go