项目简介

Jan Browser MCP 服务器是 JanHQ 提供的浏览器自动化上下文协议服务器。它与 Jan 浏览器扩展配合,将您的网页浏览器转变为一个可供大型语言模型 (LLM) 调用的自动化工具。LLM 客户端可以通过 MCP 协议请求服务器执行网页操作,例如访问URL、点击页面元素、填写表单、捕获屏幕截图和DOM快照,从而实现复杂的网页互动和信息获取任务。

主要功能点

  • 网页导航: 访问指定URL,实现前进和后退操作。
  • 页面交互: 点击、输入文本、选择下拉选项、填写表单、拖拽页面元素等与网页元素进行互动。
  • 页面观测: 捕获页面截图,生成包含辅助功能树和可交互元素的DOM快照,供LLM理解页面布局和内容。
  • 网络搜索: 提供DuckDuckGo和Google搜索结果抓取功能,帮助LLM获取实时网络信息。
  • 浏览器桥接: 通过WebSocket桥接与浏览器扩展通信,由扩展在浏览器中执行实际的自动化操作。
  • MCP协议支持: 提供标准的MCP JSON-RPC接口,方便任何兼容MCP的LLM客户端集成。

安装步骤

  1. 克隆仓库: 在您的本地机器上执行以下命令克隆此GitHub仓库:
    git clone https://github.com/janhq/jan-browser-extension.git
    cd jan-browser-extension
  2. 安装依赖: 进入项目根目录后,安装所有必要的Node.js依赖:
    npm install
  3. 构建MCP服务器: 构建TypeScript代码,生成可执行的JavaScript文件:
    npm run build:mcp
  4. (可选)安装浏览器扩展: 如果您想完整体验浏览器自动化功能,还需要在您的浏览器中安装此扩展:
    • 构建扩展:'npm run build' (用于Chromium浏览器) 或 'npm run build:firefox' (用于Firefox)。
    • 在Chrome浏览器中,访问 'chrome://extensions'。
    • 开启右上角的“开发者模式” (Developer mode)。
    • 点击“加载已解压的扩展程序” (Load unpacked),然后选择您刚刚构建的 'jan-browser-extension/dist' 文件夹。
    • 将扩展固定到工具栏以便快速访问。
    • 在扩展设置中,您可以检查并配置MCP服务器的端口(默认17389)。

服务器配置

MCP客户端通常通过JSON-RPC协议连接到Jan Browser MCP服务器。以下是一个常见的MCP客户端配置示例,用于启动和连接服务器。请注意,这里的配置是提供给MCP客户端使用的,而不是服务器端代码。

{
  "serverInfo": {
    "name": "jan-browser-mcp",
    "version": "0.13.2"
  },
  "command": "node",
  "args": [
    "path/to/your/jan-browser-extension/mcp-server/dist/src/index.js",
    "--bridge-port",
    "17389"
  ],
  "capabilities": {
    "tools": {}
  },
  "description": "连接到Jan Browser扩展,提供浏览器自动化工具。"
}
  • serverInfo: 描述服务器的基本信息,如名称和版本。
  • command: 启动MCP服务器的可执行命令。通常为 'node',因为它是一个Node.js应用。
  • args: 传递给 'command' 的命令行参数列表。
    • 第一个参数是MCP服务器的入口文件路径。请务必将 '"path/to/your/jan-browser-extension/"' 替换为您的 'jan-browser-extension' 仓库的实际绝对路径。
    • '--bridge-port 17389': 指定MCP服务器与浏览器扩展通信的WebSocket端口。默认值为 '17389'。如果您在浏览器扩展中更改了端口,请务必在此处同步更新。
  • capabilities: 声明服务器提供的能力,这里表示提供工具。
  • description: 对此MCP服务器的简要说明。

基本使用方法

  1. 启动MCP服务器: 在 'jan-browser-extension/mcp-server/' 目录下(确保您已完成安装步骤中的构建),执行以下命令来启动MCP服务器:
    npm run start:mcp
    服务器将开始监听MCP客户端的请求,并等待浏览器扩展的连接。
  2. 连接浏览器扩展:
    • 在Chrome浏览器中,点击您工具栏上的Jan Browser MCP扩展图标。
    • 点击扩展界面中的“Connect”按钮来建立与MCP服务器的WebSocket连接。连接成功后,状态指示器应显示为“Connected”。
    • 标签页选择:
      • 使用当前标签页: 点击“Set current tab for browser use”按钮,将当前活动标签页指定给LLM控制。
      • 新标签页: 如果未指定,LLM客户端在执行导航工具时会自动打开并聚焦一个新的标签页进行自动化操作。
  3. 通过LLM客户端调用工具: 一旦MCP服务器和浏览器扩展都已成功连接并准备就绪,您的LLM客户端就可以通过调用'browser_navigate'、'browser_click'、'browser_snapshot'等工具来自动化浏览器操作。LLM将能够像人类一样与网页互动,完成复杂的任务。

信息

分类

网页与API