PageProofer

PageProofer MCP 服务

阅读、修复并回复来自 GitHub Copilot、Claude Code、Cursor 和其他 AI Agent 的 PageProofer 网站反馈备注。

PageProofer 收集网站上的视觉反馈：客户端和团队成员点击某个元素、留下备注，PageProofer 则会捕获页面、该元素、浏览器信息以及任何控制台错误。这个 MCP 服务让你的编码 Agent 可以处理这些备注。它会在代码中找到问题并修复，在备注下评论说明更改内容，然后将备注移至待审核状态。

这是一个托管（远程）服务，无需安装：

• URL： https://app.pageproofer.com/mcp
• 传输方式： 可流式传输的 HTTP
• 身份验证： Authorization: Bearer YOUR_TOKEN

此仓库仅记录该服务的相关信息。服务本身作为 PageProofer 的一部分运行。

Agent 可以做什么

工具	功能
list-sites	列出你可以处理的网站，以及各网站的域名、未处理备注数量和成员。
list-notes	按时间从新到旧列出某个网站的备注。可按状态、#标签、文本、页面、负责人或逾期情况筛选。默认仅列出未处理的备注。
get-note	获取某条备注的所有信息：反馈内容、页面 URL、备注所标记的元素（CSS 选择器和 HTML）、浏览器和窗口大小、控制台错误、网络请求失败、评论和附件。
get-attachment	获取截图或其他附件。图片会以 Agent 可查看的形式返回，文本文件则返回其内容。
add-comment	以你的身份评论某条备注，例如说明修复了什么以及对应的提交。评论也可以设为仅团队可见。
update-note	更改备注的状态、优先级、负责人或截止日期。

Agent 无法将备注标记为已完成或已关闭。Agent 修复问题后，会将备注移至审核中，供人员检查。

获取令牌

1. 登录 PageProofer，打开 My Settings，然后转到 AI agents 选项卡。
2. 为令牌命名（例如“我笔记本电脑上的 VS Code”），然后点击 Create token。
3. 立即复制令牌。它只会显示一次。

所有 PageProofer 方案（包括免费试用）均包含 AI Agent 访问权限。你可以为每台计算机或每个工具创建一个令牌，并随时撤销任意令牌。

配置

VS Code 中的 GitHub Copilot

将以下内容添加到项目中的 .vscode/mcp.json，或添加到用户 MCP 配置中。VS Code 会在首次使用时询问令牌，并将其安全存储。

{
  "inputs": [
    {
      "type": "promptString",
      "id": "pageproofer-token",
      "description": "PageProofer token (My Settings > AI agents)",
      "password": true
    }
  ],
  "servers": {
    "pageproofer": {
      "type": "http",
      "url": "https://app.pageproofer.com/mcp",
      "headers": {
        "Authorization": "Bearer ${input:pageproofer-token}"
      }
    }
  }
}

然后在 Agent 模式下打开 Copilot Chat，询问它有关备注的问题。

Claude Code

claude mcp add --transport http pageproofer https://app.pageproofer.com/mcp --header "Authorization: Bearer YOUR_TOKEN"

Cursor

在 ~/.cursor/mcp.json 或 .cursor/mcp.json 中：

{
  "mcpServers": {
    "pageproofer": {
      "url": "https://app.pageproofer.com/mcp",
      "headers": {
        "Authorization": "Bearer YOUR_TOKEN"
      }
    }
  }
}

其他 Agent

任何支持通过 HTTP 连接远程服务的 MCP 客户端，都可以使用 URL https://app.pageproofer.com/mcp 和请求头 Authorization: Bearer YOUR_TOKEN 进行连接。

使用方法

在项目文件夹中用自然语言提问：

• “Northwind 网站有哪些未处理的备注？”
• “修复未处理的 #checkout 备注，然后分别评论说明你做了哪些更改。”
• “备注 12 有什么问题？看看截图。”
• “显示分配给我且已逾期的备注。”

典型的处理流程是：Agent 列出未处理的备注，查看其中一条备注及其截图和控制台错误，找到相关元素对应的代码，进行修复，评论说明对应的提交，然后将备注移至审核中。

工作方式

• Agent 以你的身份操作。它只能看到你有权查看的网站和备注。
• 它的评论和更改会显示你的姓名，并标注“via AI agent”。
• 通知照常发送，因此 Agent 留下评论后，备注相关人员会收到通知。
• 备注文本和评论来自客户端和网站访客。服务会告知 Agent 将它们视为问题描述，而非指令。

请像保管密码一样保护你的令牌。不要将它提交到代码仓库。如果令牌可能已泄露，请在 My Settings > AI agents 中撤销它。

链接

• 帮助：连接 AI Agent
• 如何使用 AI Agent
• 支持：[email protected]