动态表单生成服务

bidur是一个通过模型上下文协议(MCP)为AI代理动态生成表单的服务,适用于需要从用户收集特定数据的场景。

  • by ogulcanakca
  • Python
  • 本地部署
  • 更新于
在 GitHub 查看 ogulcanakca/bidur

使用说明

投标人

毕,有些信息不见了!让我生成UI来收集缺失的部分。

通过模型上下文协议(MCP)为AI代理生成动态表单。

现场演示

试用bidur演示→

它做什么

Agent: "I need api_key, project_name from the user"
       ↓
MCP Server creates a form → User fills it in browser → Data returns to agent

快速开始

选项1:远程SSE(建议用于测试)

from agents import Agent, Runner
from agents.mcp import MCPServerSse

async def main():
    async with MCPServerSse(
        params={
            "url": "https://gen-ui-mcp-server.onrender.com/sse",
            "headers": {"X-OpenAI-API-Key": "sk-..."},
        },
        client_session_timeout_seconds=300,
    ) as mcp_server:
        
        agent = Agent(
            name="My Agent",
            instructions="Use collect_user_input to gather info from user.",
            mcp_servers=[mcp_server],
        )
        
        result = await Runner.run(agent, "Collect user's name and email")

选项2:Docker(本地开发)

cd docker
docker-compose up -d

# MCP Server: http://localhost:8080
# Form Server: http://localhost:9110

然后用MCP检查员进行测试:

npx @modelcontextprotocol/inspector

将URL设置为 http://localhost:8080/sse 浏览器用户界面。添加一个名为X-OpenAI-API-Key的新自定义标头。在值字段中输入您的OpenAI API键。

选项3:带MCP检查器的远程SSE

npx @modelcontextprotocol/inspector sse https://gen-ui-mcp-server.onrender.com/sse --header "X-OpenAI-API-Key: sk-..."

然后在浏览器UI中:

  1. 将URL设置为: https://gen-ui-mcp-server.onrender.com/sse
  2. 首选 工具 标签
  3. 跑 collect_user_input 带有测试输入
  4. 检查 服务器通知 表单URL

测试

python examples/mcp_sse_example.py

安装

git clone https://github.com/ogulcanakca/bidur.git
cd bidur
pip install -r requirements.txt

export OPENAI_API_KEY=sk-...

可用工具

collect_user_input

参数 类型 说明
missing_fields list[str] 要收集的字段名称(例如。, ["username", "email"])
context str 可选上下文,可更好地生成表单
timeout_seconds int 最大等待时间(默认值:300)

退货:

{
  "form_url": "https://...",
  "message": "User successfully submitted the form",
  "data": {"username": "john", "email": "john@example.com"}
}

建筑

┌─────────────┐     SSE      ┌─────────────┐     HTTP     ┌─────────────┐
│   Agent     │◄────────────►│ MCP Server  │◄────────────►│ Form Server │
│ (Your App)  │              │  Port 8080  │              │  Port 9110  │
└─────────────┘              └─────────────┘              └─────────────┘
                                    │                            │
                              Tool Handler                  HTML/JS Form
                              API Key Mgmt                  Schema Gen

项目结构

gen-ui-mcp/
├── src/gen_ui/
│   ├── mcp_server/          # MCP Server implementation
│   │   ├── server.py        # SSE transport, tool routing
│   │   └── tools.py         # collect_user_input tool
│   ├── agents/              # Form schema generation
│   └── tools/               # Standalone tool (non-MCP)
├── ui/html/
│   ├── server.py            # Form Server HTTP API
│   └── index.html           # Form UI
├── docker/
│   ├── Dockerfile.mcp
│   ├── Dockerfile.form
│   └── docker-compose.yml
├── examples/
│   └── mcp_sse_example.py   # SSE connection example
└── run_mcp_server.py        # Entry point (stdio/sse)

备注

客户端限制

正在进行的研究: VS Code、Cursor和Claude Desktop客户端在工具执行期间当前不显示日志通知。这意味着表单URL在表单提交后才可见。正在调查替代方法。

OpenAI代理SDK功能

该项目支持 护栏 和 追踪 OpenAI代理SDK的功能。

内置护栏:

护栏 类型 说明
safety_guardrail 输入 验证字段名称,检查注射模式
llm_field_validation_guardrail 输入 对可疑字段名进行基于LLM的语义验证
schema_format_guardrail 输出 验证JSON模式结构和属性定义