LangChain/LangGraph+Webfuse MCP，研究代理
它的作用
输入一个研究主题。代理计划其方法，导航到多个网页，使用目标CSS选择器提取数据，并提供结构化比较。您可以在浏览器中实时观看每一步。
例子： “比较阿姆斯特丹和鹿特丹：人口、面积和顶级景点”
代理人访问每个城市的维基百科，阅读信息框，提取数字，并进行并排比较。
先决条件
快速开始
cd agent
pip install -r requirements.txt
cp ../.env.example .env # Add OPENAI_API_KEY + WEBFUSE_REST_KEY
uvicorn agent:app --port 8082部署 extension/ 到您的Webfuse空间。集 AGENT_URL 到您的服务器URL。
看 设置.md 完整的指南。
建筑
Webfuse Extension (sidebar) FastAPI Agent Server Webfuse MCP
Research topic →POST→ /research
Stream events ←SSE← LangGraph ReAct agent
↓ tool calls
navigate() ──────────→ session-mcp.webfu.se
see_dom_snapshot() ──→ 13 browser tools
act_click() ─────────→ live browser session代理使用LangGraph的 create_react_agent 使用异步工具包装器，通过Streamable HTTP调用Webfuse MCP工具。每个工具调用都作为进度事件流式传输到侧边栏UI。
是什么让这与众不同
其他集成演示显示了单页交互。这个是关于 多页推理:
- 代理人计划访问哪些页面
- 在它们之间导航，提取可比数据
- 使用目标CSS选择器(
.infobox,table.wikitable)避免上下文溢出 - 与引文进行结构化比较
这是LangChain/LangGraph模式：使用工具进行推理的链。Webfuse使浏览器成为这些工具之一。
示例研究主题
- “比较阿姆斯特丹和鹿特丹：人口、面积和顶级景点”
- “比较Next.js和Remix的功能”
- “研究Python与Rust的web后端：性能、生态系统、学习曲线”
- “比较Notion与Confluence的定价和功能”
- “找到纽约最高的建筑，并将其与迪拜进行比较”
7代理工具
| 工具 | MCP工具 | 它的作用 |
|---|---|---|
navigate | navigate | 转到URL |
see_dom_snapshot | see_domSnapshot | 读取页面HTML（使用CSS选择器作用域） |
see_accessibility_tree | see_accessibilityTree | 读取页面结构 |
act_click | act_click | 单击元素 |
act_scroll | act_scroll | 滚动页面 |
act_type | act_type | 在表单字段中键入 |
act_key_press | act_keyPress | 按键盘键 |
该代理拥有13个可用MCP工具中的7个，即研究工作流程所需的工具。通过扩展添加更多 make_tools() 在 agent.py.
交换LLM
# OpenAI (default)
from langchain_openai import ChatOpenAI
llm = ChatOpenAI(model="gpt-4o")
# Anthropic
from langchain_anthropic import ChatAnthropic
llm = ChatAnthropic(model="claude-sonnet-4-20250514")
# Google
from langchain_google_genai import ChatGoogleGenerativeAI
llm = ChatGoogleGenerativeAI(model="gemini-2.0-flash")相同的Webfuse工具适用于所有提供商。
链接
- 博客文章
- Webfuse 的AI浏览器驱动平台
- LangGraph文档，代理框架
- 会话MCP服务器文档，完整工具参考
其他Webfuse集成
Webfuse MCP适用于任何AI框架：
- OpenAI代理SDK -带浏览器控制的Python代理
- 克劳德桌面/光标/VS代码 -零代码MCP配置
- 语言链/语言图 -多页研究代理
- Vercel AI SDK -Next.js浏览助手
- LiveKit语音代理 -语音控制浏览器
- ChatGPT GPT -使用浏览器工具自定义GPT
- WebMCP演示 -任何网站上的语义工具
许可证
麻省理工学院