Web Browser (kogiQA)

kogiQA MCP Web Browser

一个使用 kogiQA 提供浏览器自动化功能的 Model Context Protocol（MCP）服务。该服务 可让大模型通过自然语言与网页交互，无需使用屏幕截图 或针对视觉优化的模型。

适用场景：

• 调试页面样式问题
• 自动修复控制台错误。
• 梳理并记录 Web 应用的功能
• 自动编写端到端测试
• 自动执行应用的探索性测试

查看示例提示词：使用示例

kogiQA MCP 与 Playwright MCP 的区别

kogiQA MCP 服务提供的浏览器集成了 kogiQA 浏览器控制算法的功能。 Agent 可借此在无需选择器的情况下与页面交互，从而节省时间和令牌。

安装

自动安装：

npx kogiqa-mcp@latest

Claude Code

claude mcp add kogiqa-browser npx kogiqa-mcp@latest

VS Code

点击下方任一按钮，直接在 VS Code 中安装：

也可以通过 VS Code CLI 安装：

code --add-mcp '{"name":"kogiqa-browser","command":"npx","args":["kogiqa-mcp@latest"]}'

Cursor

也可以前往 Cursor Settings → MCP → Add new MCP Server，然后输入命令 npx kogiqa-mcp@latest。

标准配置

对于其他 MCP 客户端，请将以下内容添加到 MCP 配置中：

{
  "mcpServers": {
    "kogiqa-browser": {
      "command": "npx",
      "args": [
        "kogiqa-mcp@latest"
      ]
    }
  }
}

使用示例

配置好服务后，只需用自然语言与 Agent 对话即可。由于 kogiQA 无需选择器，你只需描述要完成的操作，而不必说明如何查找元素。

测试用户流程

Open http://localhost:3000, log in with the demo credentials, add the first product to the cart, and verify that the cart badge shows "1".

调试样式问题

Go to https://myapp.example.com/pricing and check why the "Pro" plan card overflows its container on a 1280px-wide viewport. Suggest a CSS fix.

修复控制台错误

Navigate to http://localhost:5173, open every page linked from the main menu, collect all console errors, and fix them in the source code.

梳理并记录应用

Explore https://staging.example.com, follow all internal links up to two levels deep, and produce a Markdown document describing each page and its main features.

生成端到端测试

Walk through the sign-up flow at http://localhost:3000/signup and write Cypress end-to-end tests covering the happy path and validation errors.

探索性测试

Do 10 minutes of exploratory testing on http://localhost:8080: try edge-case inputs in every form you find and report anything that looks broken or inconsistent.

要求

• Node.js 20 或更高版本
• VS Code、Cursor、Windsurf、Claude Desktop、Goose、Junie 或其他 MCP 客户端