webcode

语言：中文 | English

webcode 用来把 ChatGPT、Gemini、DeepSeek 等这类网页 AI 接到本地 VS Code 中，支持读、写、编辑本地文件，运行命令，还支持 MCP 和 Skills。

快速开始

1. 安装 VS Code 扩展

1. 打开 VS Code 扩展商店。
2. 搜索 webcode gateway。
3. 安装扩展。

2. 启动 Gateway

1. 在 VS Code 中打开一个具体文件夹或工作区。
2. 点击右下角状态栏里的 webcode: 关闭。
3. 在弹出的菜单里点击 启动 webcode。
4. 等待状态栏文字变成 webcode: <端口>。

当状态栏显示端口号时，说明本地 Gateway 已经启动。启动成功后会自动打开 AI 启动菜单，不需要再点一次状态栏。

3. 打开目标网页 AI

1. 在启动菜单里选择目标站点，例如 Open Gemini、Open ChatGPT 或其他支持的入口。
2. webcode 默认会用 Edge 独立保活模式 打开 Microsoft Edge。
3. 独立 Edge profile 会自动加载内置的 webcode bridge。
4. 桥接页会自动与本地 Gateway 完成握手。
5. 握手成功后，浏览器会自动跳转到对应的 AI 站点。

首次使用时，需要在这个独立 Edge profile 中登录一次目标 AI 站点。登录过程中如果跳转到 Google、Microsoft 等第三方登录页，bridge 会暂时暂停当前页面能力并保留 session；登录完成并回到目标 AI 站点后会自动恢复。当 bridge 显示 ON 时，表示连接已经可以使用。

如果 Gateway 已经在运行，点击状态栏里的 webcode: <端口> 可以重新打开同一个启动菜单。

4. 在对话中使用

1. 打开目标 AI 站点中的新对话。
2. 先输入你的实际需求，再在同一条消息末尾添加 /webcode 或 @webcode。
3. 当 webcode 询问是否添加初始化上下文时，点击 添加 或按 Enter。
4. webcode 会把触发词替换为完整初始化上下文。确认消息内容后，由你手动发送。

如果初始化上下文超过当前 AI 站点的输入框限制，webcode 会优先把完整上下文作为 txt 附件添加到消息中，并在输入框里保留一段简短说明。

例如：

• 读取 src/utils.ts，然后为它补一个单元测试。 /webcode
• 列出当前工作区的文件结构。 @webcode
• 把项目文档生成到 docs 目录里。 /webcode

内置工具

webcode 内置 read_file、write_file、edit_file、search_files、search_code、execute_command、run_in_terminal、terminal_session 等本地工具，用于文件读写、代码搜索、命令执行和终端会话管理。

具体工具清单见 内置工具说明。

MCP

需要接入浏览器自动化、GitHub、数据库或其他外部能力时，可以通过 webcodeGateway.servers 配置第三方 MCP server。

具体配置方式见 MCP 服务配置指南。

Skills

webcode 可以把当前 VS Code 工作区中的本地 Skills 暴露给网页 AI，让模型按需读取项目工作流、模板、领域说明或脚本资源。

具体使用方式见 Skills 使用指南。

项目规则

初始化时，webcode 会从 VS Code 当前打开的主工作区根目录读取项目规则文件，并随初始化结果发送给网页 AI：

• USER_RULES.md
• AGENTS.md 或 CLAUDE.md

如果 AGENTS.md 和 CLAUDE.md 同时存在，只发送 AGENTS.md。浏览器扩展不再提供单独的个性化指令设置页。

其他 AI 平台支持

webcode 内置支持常见网页 AI，也允许通过 VS Code 配置快速接入新的站点。稳定平台可以加入内置站点列表，实验或私有站点通常只需要配置 webcodeGateway.aiSites。

具体步骤见 站点支持扩展指南。

从源码构建

源码下载、依赖安装、打包脚本、产物说明和本地安装方式见 构建指南。

常见问题

触发词无反应、工具调用执行后页面没有变化、查看历史工具调用等问题见 常见问题。

参与贡献

欢迎提交 Issue 和 Pull Request。

许可证

MIT License

webcode

Language: English | 中文

webcode connects ChatGPT, Gemini, DeepSeek, and other web AI products to local VS Code so they can read, write, and edit local files, run commands, and use MCP and Skills.

Quick Start

1. Install the VS Code Extension

1. Open the VS Code Marketplace from the Extensions view.
2. Search for webcode gateway.
3. Install the extension.

2. Start the Gateway

1. Open a folder or workspace in VS Code.
2. Click webcode: OFF in the bottom-right status bar.
3. In the menu that opens, click Start webcode.
4. Wait for the status bar item to change to webcode: <port>.

When the status bar shows a port number, the local gateway is running. The AI launch menu opens automatically after startup, so you do not need to click the status bar a second time.

3. Open a Supported AI Product

1. Choose the target site in the launch menu, such as Open Gemini, Open ChatGPT, or another supported entry.
2. webcode opens Microsoft Edge in Edge Isolated Keepalive mode by default.
3. The isolated Edge profile auto-loads the bundled webcode bridge extension.
4. The bridge page completes the handshake with the local gateway automatically.
5. After the handshake succeeds, the browser redirects to the target AI site.

On first use, sign in to the target AI site once in the isolated Edge profile. If sign-in redirects to a third-party provider such as Google or Microsoft, the bridge temporarily pauses page capabilities and keeps the session; it resumes automatically after the browser returns to the target AI site. When the bridge extension shows ON, the connection is ready to use.

If the gateway is already running, click webcode: <port> in the status bar to open the same launch menu again.

4. Use It in Chat

1. Open a new chat on the target AI site.
2. Enter your actual task first, then add /webcode or @webcode at the end of the same message.
3. When webcode asks whether to add the initialization context, choose Add or press Enter.
4. webcode replaces the trigger word with the full initialization context. Review the message, then send it yourself.

If the initialization context exceeds the current AI site's input limit, webcode first attaches the full context as a txt file and keeps a short instruction in the input box.

For example:

• Read src/utils.ts and write a unit test for it. /webcode
• List the files in the current workspace. @webcode
• Create project docs under the docs directory. /webcode

Built-in Tools

webcode includes built-in local tools such as read_file, write_file, edit_file, search_files, search_code, execute_command, run_in_terminal, and terminal_session for file reads and writes, code search, command execution, and terminal session management.

See the built-in tools reference.

MCP

Use webcodeGateway.servers when you want to attach third-party MCP servers for browser automation, GitHub, databases, or other external capabilities.

See the MCP server configuration guide.

Skills

webcode can expose local Skills from the current VS Code workspace so the web AI can load project workflows, templates, domain notes, or script resources on demand.

See the Skills guide.

Project Rules

During initialization, webcode reads project rule files from the root of the primary VS Code workspace and sends them with the initialization result:

• USER_RULES.md
• AGENTS.md or CLAUDE.md

If both AGENTS.md and CLAUDE.md exist, only AGENTS.md is sent. The browser extension no longer has a separate custom-instructions settings page.

Additional AI Platform Support

webcode includes built-in support for common web AI products and can also attach new sites through VS Code configuration. Stable platforms can be added as built-in sites; experimental or private sites usually only need webcodeGateway.aiSites.

See the site support guide.

Build From Source

See the build guide for repository checkout, dependency installation, packaging scripts, artifacts, and local installation.

FAQ

See the FAQ guide for trigger-word issues, tool calls that executed but did not update the page, and tool-call history logs.

Contributing

Issues and pull requests are welcome.

License

MIT License