WebMCP SDK 使用助手

SkillAI & models

指导如何使用 WebMCP SDK库去开发WebAgent的技能包,将前端应用快速智能化。它包含 TinyRemoter,WebMcpServer,WebMcpClient,createRemoter, AI-Extension插件开发的文档及指南。

Available today. Use it from your connected AI after setup.

Connect ahel once, and every AI you use reads what you have installed.

Then ask your AI: use the WebMCP SDK 使用助手 skill

What this skill tells your AI

The instructions your AI receives, as published by opentiny/agent-skills in skills/webmcp-sdk-skill/SKILL.md and read by ahel’s review.

WebMCP-SDK 是一套前端智能应用开发工具包,曾用名称NEXT-SDKs也是同一个库。 它旨在简化 WebAgent 的集成与使用,内置了 Vue 版本的TinyRemoter组件和 WebMcpServer,WebMcpClient 等重要的类。

安装方式

用户使用 WebMCP-SDK 库,需要安装 @opentiny/next-sdk 的 npm 包。 用户使用 TinyRemoter 组件,需要安装 @opentiny/next-remoter 的 npm 包。

使用方法

根据任务类型,查阅对应的规则文档并严格遵循规范:

规则文档适用场景
快速开始WebMCP-SDK 库和 TinyRemoter 的入门指南
接入三方 AI 应用如何在各类 IDE 开发软件中,配置 mcpservers
Electron 应用接入如何在 Electron 工程中接入 WebMCP-SDK
uni-app 应用接入如何在 uni-app 工程中接入 WebMCP-SDK
本地连接如何支持 iframe 方式接入 WebMCP-SDK 库
WebAgent 私有化部署WebAgent 私有化部署用户指导书
总览WebMCP + WebSkills:企业级智能化页面操控方案
Vue 工程最佳实践Vue 工程的 WebMCP + WebSkills:企业级智能化页面操控方案
Angular 工程最佳实践Angular 工程的 WebMCP + WebSkills:企业级智能化页面操控方案
React 工程最佳实践React 工程的 WebMCP + WebSkills:企业级智能化页面操控方案
WebMcpClient 类WebMcpClient 的完整文档
WebMcpServer 类WebMcpServer 的完整文档
AgentModelProvider 类AgentModelProvider 的完整文档
createRemoter 函数createRemoter 的完整文档
工具函数WebMCP-SDK 库中导出的重要函数的完整文档
TinyRemoter 文档TinyRemoter 的完整文档
Skills 技能配置指南WebSkills 的规范以及如何配置给 TinyRemoter 使用
Custom llm 自定义大模型TinyRemoter 的 llmConfig 和 agentRoot 自定义配置的文档
自定义 AI 对话框组件useNextAgent 的使用文档,以及如何接入其它厂商的 UI
技术架构AI-Extension 浏览器插件技术架构文档
MCP Servers 工具开发指南AI-Extension 中的 mcp-servers 开发指南
Skills 技能开发指南AI-Extension 中的 Skills 技能开发指南
AI Extension 插件安装指南AI Extension 扩展插件安装指南
配置大模型AI Extension 中,如何自定义 AI 大模型配置指南

Signals

GitHub stars
20
Forks
2
Last commit
Sep 2026

ahel review

  • K1binfo
    installs-packages (in rules/ai-extension-next-wxt.md)
  • K1binfo
    installs-packages (in rules/angular-webmcp-best-practice.md)
  • K1binfo
    installs-packages (in rules/electron.md)
  • K1binfo
    installs-packages (in rules/react-webmcp-best-practice.md)
  • K1binfo
    installs-packages (in rules/vue-webmcp-best-practice.md)
  • K1binfo
    installs-packages (in rules/webmcp-webskills.md)

Automated review, not a security audit. Ruleset v1+k2.

Advanced
Catalog kind
skill
Gateway key
webmcp-sdk-skill
Source
github.com/opentiny/agent-skills