如何使用 Claude Code 自动进行代码审查

学习如何使用 Claude Code 自动进行代码审查。本指南涵盖公关审查设置、子代理架构以及如何添加可视化质量保证以发现基于差异的审查漏洞。
Advanced computer use agent
Production-grade reliability
Transparent Execution

没人谈论的代码审查瓶颈

行为优先的 PR 验证
当 PR 打开时,Sai 不仅会阅读差异,还会打开您的预览部署,登录到测试账户,然后逐步点击受影响的用户流。它会对每个状态转换进行屏幕截图并标记任何中断的内容,为审阅者提供视觉证据,而不是代码注释。
根据屏幕截图自动重现错误
将用户的错误屏幕截图粘贴到 Sai 中。它探索应用程序,找出触发问题的确切点击顺序,并生成一份可用于工程的票证,其中包含重现步骤、预期行为与实际行为以及带注释的屏幕截图,从而将模糊的报告转化为 Claude Code 的可操作上下文。
闭环修复验证
在 Claude Code 修补代码后,Sai 会自动重新运行相同的测试流程。它会捕获之前和之后的屏幕截图,检查 Sentry 中是否存在新错误,并将结构化的通过/失败报告发布到 Slack 或 GitHub,因此,您的团队永远不会在未确认修复程序在产品中实际起作用的情况下合并修复程序。

没人谈论的代码审查瓶颈

您的团队的发货速度比其评论的速度快。

人工智能编码代理——Claude Code、Cursor、GitHub Copilot——生成拉取请求的速度比任何人工审阅者阅读请求的速度都要快。曾经在午餐前审查三个 PR 的高级工程师现在面临十二个 PR。代码看起来很干净。测试通过了。轮子很安静。

但是结账页面坏了。

这是2025年的代码审查差距:“代码正确” 和 “产品有效” 之间的距离。传统的代码审查(无论是人工还是人工智能)都会读出差异。它检查逻辑、模式和语法。它不会打开应用程序,点击结账流程,应用优惠券,并注意到总额下降到负四美元。

大多数 AI 代码审查工具都扩大了这一差距,而不是缩小了差距。他们产生更多的评论,更多的建议,更多的噪音。Reddit上的工程师描述了这种模式:“人工智能评论创造的工作量多于节省的工作量,因为每条评论都需要人工来验证其是否真实。”

问题不在于代码审查太慢。问题是代码审查不完整。它会审查代码。没有人评论该产品。

本指南介绍了代码审查自动化的三个层次:

  1. 手动审查 — 今天大多数团队是怎么做的
  2. Claude Code 评论 — 自动差异分析 /评论 和 GitHub 操作
  3. 行为优先审查 — 当 Sai 测试产品时 Claude Code 读取代码

最后,您将确切地知道如何设置每个等级,何时使用哪个等级,以及实时节省的资金来自哪里。

Claude Code 如何审查拉取请求

Claude Code 是 Anthropic 的人工智能编码代理,可在您的终端中运行。它可以读取您的代码库,了解项目上下文,并且可以在远远超出简单整理的层面上审查代码。

/review 命令

获得 Claude Code 审查的最快方法是内置的 /评论 命令:

# Review your current working changes
claude review

# Review a specific PR
claude review --pr 142

Claude Code 使用多个专门的子代理来分析差异:

  • 逻辑审阅者 — 检查正确性、边缘情况和回归
  • 安全审阅者 — 扫描漏洞、秘密暴露和注入载体
  • 风格评论家 — 强制执行命名规范、模式和可读性标准
  • 建筑评论家 — 标记结构性问题和模式违规行为

每个子代理都专注于其领域并独立报告。结果是一次结构化审查,包括分类调查结果、严重程度和建议的修复方案。

Claude Code 作为 GitHub 操作

为了对每次推送进行自动公关审查,Claude Code 提供了 GitHub Action:

name: Claude Code Review
on:
  pull_request:
    types: [opened, synchronize]

jobs:
  review:
    runs-on: ubuntu-latest
    steps:
      - uses: anthropics/claude-code-action@v1
        with:
          trigger: "review"

配置完成后,Claude Code:

  1. 从 GitHub 接收 PR 网络挂钩
  2. 克隆存储库并查看 PR 分支
  3. 阅读完整的差异和周围的上下文
  4. 在特定行中发布行内评论
  5. 添加包含总体评估的摘要评论

你也可以通过评论手动触发评论 @claude 评论 在任何 PR 上。

Claude Code 评论在哪些方面做得好

Claude Code 审查对以下方面确实有用:

  • 捕捉逻辑错误 这需要了解代码库上下文,而不仅仅是更改后的行
  • 识别缺失的错误处理 — 它会读取周围的代码,并注意到何时在没有 try/catch 的情况下调用了可以抛出的函数
  • 发现回归 — 它了解代码之前做了什么,并在新更改破坏现有行为时进行标记
  • 减轻审阅者的疲劳 — 它负责机械检查,因此人工审阅者可以专注于架构和产品决策
Claude Code 审查不能做什么

Claude Code 审查代码。它不运行代码。这意味着它不能:

  • 打开浏览器并测试实际的用户界面
  • 验证 CSS 更改在不同的屏幕尺寸上看起来是否正确
  • 检查付款流程是否端到端完成
  • 请注意,按钮现在隐藏在另一个元素后面
  • 重现用户屏幕截图中的错误
  • 访问授权墙工具,如 Sentry、Datadog 或管理员仪表板

这不是 Claude Code 的具体限制,而是基于差异的审查的根本限制。任何只读取代码的工具都无法告诉你该产品是否有效。

差距:AI 代码审查还缺少什么

这是一个真实的场景。您的团队对每个 PR 都使用 Claude Code 审核。它可以配置、运行并捕获真正的错误。然后会发生这种情况:

PR #247: 更新购物车折扣的优惠券逻辑

Claude Code 审查了差异并发现:

  • 折扣计算中没有逻辑错误
  • 对优惠券对象进行适当的空检查
  • 申请/移除优惠券的测试通过
  • 没有安全问题

PR 被合并。

两个小时后,一位用户报告说:“我在购物车中使用了5美元的优惠券,然后删除了一件商品。现在总数为负数。我无法退房。”

发生了什么?单独来看,优惠券逻辑是正确的。但是,优惠券应用程序和购物车物品移除之间的互动造成了一种状态,即没有涵盖任何测试,任何差异审阅者,无论是人类还是人工智能,都无法通过单独阅读代码来抓住这种状态。

随着代码库变得越来越复杂,此类错误也会增加:

  • 状态交互错误 — 两个独立运行但相互关联的功能
  • 视觉回归 — 布局偏移、元素重叠、响应式设计失效
  • 依赖流量的错误 — 仅在特定用户操作顺序之后出现的问题
  • 特定于环境的故障 — 暂存行为与本地不同

这些错误有一个共同的特征: 你只能通过使用产品找到它们。

完整循环:Sai + Claude Code 如何进行代码审查

Sai 是一名人工智能代理 它在云桌面上运行。它可以打开浏览器、点击应用程序、截取屏幕截图、读取错误日志,并与 Sentry、Slack 和 GitHub 等工具进行交互——所有这些都是自主运行的。

与 Claude Code 配对时,审查循环发生了根本性的变化:

传统人工智能评论: 公关开启 → 人工智能阅读差异 → 人工智能发表评论 → 人工验证

Sai + Claude Code 评测: PR 打开 → Claude Code 阅读差异 → Sai 打开应用程序 → Sai 测试流程 → Sai 屏幕截图问题 → Claude Code 修复了代码 → Sai 重新测试 → 发布了结构化报告

关键区别:Claude Code 会审查代码。Sai 评论了该产品。

8 步循环的工作原理

第 1 步:触发

循环从以下三个来源之一开始:

  • GitHub PR 已打开或更新(网络挂钩触发器)
  • 用户报告了一个错误(“使用优惠券后结账总额为负数”)
  • 出现新错误时会触发 Sentry 警报

传统的评论从差异开始。这个循环可以从用户体验开始。

第 2 步:Claude Code 分析代码

Claude Code 读取 PR 差异,了解代码库上下文,并确定代码层面的潜在问题——逻辑错误、缺失的边缘案例、安全问题。

第 3 步:Sai 打开预览部署

当 Claude Code 读取代码时,Sai 在其云桌面上的真实浏览器中打开预览网址。它使用测试帐户登录并导航到受影响区域。

第 4 步:Sai 测试实际用户流量

这是其他人工智能审查工具无法执行的关键步骤。赛伊:

  • 将商品添加到购物车
  • 应用优惠券代码
  • 修改数量并移除物品
  • 继续结账
  • 检查总额、税款和折扣的计算是否正确
  • 每一步都有屏幕截图

第 5 步:Sai 生成重现步骤

如果有什么东西坏了 Sai 生成了一份工程就绪的错误报告:

重现步骤:1.加入 3 个橙子,每个 2 美元。购物车总计:6.002 美元。使用优惠券代码 SAVE5。购物车总计:1.003 美元。去掉一个橙子。购物车总计:-1.004 美元。点击结账。错误:“无法处理负总计”
预期:总额应重新计算为 4.00 美元-4.00 美元(上限)= 0.00 美元实际值:显示总数 -1.00 美元屏幕截图:[before_coupon.png] [after_remove.png] 主机错误:NonesEntry:未记录新错误

这不是对差异的模糊评论。这是一张有证据的 QA 票。

第 6 步:Claude Code 修复了代码

Claude Code 从 Sai 那里接收结构化复制步骤、屏幕截图和错误上下文。它没有猜测可能出了什么问题,而是确切地知道:

  • 哪个页面受到影响
  • 哪个操作顺序触发了错误
  • 预期的行为应该是什么
  • 实际行为是什么

它能生成有针对性的修复方案,而不是推测性的建议。

第 7 步:Sai 重新测试修复程序

在 Claude Code 修补代码后,Sai 再次运行相同的测试序列:

  • 申请优惠券 → 移除商品 → 查看总金额
  • 验证总数不再为负数
  • 捕获之前/之后的屏幕截图
  • 检查 Sentry 中是否有新错误

第 8 步:向 Slack/GitHub 提交结构化报告

最终输出是发布到您团队频道的结构化质量保证报告:

Sai QA Review: PR #247 — Coupon Discount Logic

Status: ✅ Fixed and verified

Issue found:
Cart total became negative when removing items after applying coupon.

Root cause:
Coupon discount was applied as fixed amount without 
recalculating against updated cart total.

Fix applied:
Added cap logic — discount cannot exceed current cart subtotal.

Verification:
- Before fix: Total = -$1.00 after removing item [screenshot]
- After fix: Total = $0.00, coupon capped correctly [screenshot]
- Sentry: No new errors
- Checkout flow: Completes successfully

分步操作:使用 Sai 设置 Claude Code Review

先决条件

  • 具有预览部署(Vercel、Netlify 或类似部署)的 GitHub 存储库
  • Claude Code 账户(用于代码分析)
  • 一个 Sai 账户 (用于视觉 QA 和浏览器测试)

第 1 步:设置 Claude Code GitHub Action

将 Claude Code 审阅操作添加到您的存储库中:

# .github/workflows/claude-review.yml
name: Claude Code Review
on:
  pull_request:
    types: [opened, synchronize]
  issue_comment:
    types: [created]

jobs:
  review:
    if: |
      github.event_name == 'pull_request' ||
      contains(github.event.comment.body, '@claude')
    runs-on: ubuntu-latest
    steps:
      - uses: anthropics/claude-code-action@v1
        with:
          trigger: "review"
          anthropic_api_key: ${{ secrets.ANTHROPIC_API_KEY }}

这使您可以自动审查每个 PR 的差异级别。

第 2 步:将 Sai 连接到您的 GitHub 存储库

在 Sai 中,设置一个在 PR 事件上触发的 webhook 工作流程:

  1. 打开 Sai → 设置 → 工作流程
  2. 创建新的 webhook 工作流程
  3. 选择 GitHub 作为提供商
  4. 选择你的存储库
  5. 将触发事件设置为 pull_request.已打开

第 3 步:定义测试流程

告诉 Sai 在 PR 涉及特定区域时要测试什么:

When a PR modifies files in /src/checkout/:
1. Open preview deployment URL
2. Log in with test account
3. Add 3 items to cart
4. Apply coupon TESTCOUPON
5. Modify quantities
6. Remove one item
7. Proceed to checkout
8. Screenshot each step
9. Report any total that is negative or mismatched

步骤 4:配置报告

选择 Sai 发送结果的位置:

  • GitHub 公关 — 与代码审查一致
  • Slack 频道 — 提高团队知名度
  • 线性票 — 适用于需要追踪的拦截器

第 5 步:运行和迭代

前几个 PR 将校准系统。Sai 了解哪些流量很重要,“正确” 是什么样子,以及误报发生在哪里。一周后,您将拥有一个可自动捕获代码级和产品级问题的审查管道。

Aspect Tier 1: Manual Tier 2: Claude Code Tier 3: Claude Code + Sai
Setup time None 15 min (GitHub Action) 30 min (webhook + flows)
Review speed 30-60 min / PR 2-5 min / PR 3-7 min / PR
Catches logic bugs
Catches visual bugs
Tests user flows
Provides evidence Text comments Inline comments Screenshots + STR
Verifies fixes Manual re-review ✅ Automated re-test
Human time / PR 30-60 min 10-15 min 2-5 min

五个真实场景

场景 1:电子商务结账错误

触发器: PR 更新了付款处理逻辑。

Claude Code 发现: 缺少对被拒卡的错误处理。

赛发现: 卡被拒后,即使用户输入有效的信用卡,“下订单” 按钮仍处于禁用状态。加载微调器永远不会清除。

结果: Claude Code 修复了错误处理。Sai 验证成功输入卡片后该按钮是否可以重新启用。QA 报告已发布到 Slack。

场景 2:仪表板响应式设计中断

触发器: PR 重构了仪表板网格布局。

Claude Code 发现: 没有逻辑问题。CSS 更改看起来是正确的。

赛发现: 在平板电脑视口 (768px) 上,侧边栏与主内容区域重叠。两个图表小部件完全隐藏在导航面板后面。

结果: Sai 截屏了三个断点处的重叠部分。Claude Code 调整网格断点值。Sai 重新测试并确认所有尺寸的布局都很干净。

场景 3:身份验证流程回归

触发器: PR 更新了 Google 登录的 OAuth 集成。

Claude Code 发现: 令牌刷新逻辑看起来正确。范围配置正确。

赛发现: 登录谷歌后,重定向会进入404页面,因为回调网址已在代码中更新,但在谷歌云端控制台配置中未更新。

结果: Sai 截屏了 404。该团队更新了谷歌云控制台。Sai 重新测试了完整的 OAuth 流程(登录、重定向、会话创建),并确认其端到端运行。

场景 4:从屏幕截图中重现用户错误报告

触发器: 一位用户在 Slack 中发布了屏幕截图:“这个页面看起来坏了。”

仅限 Claude Code: 无法处理屏幕截图。需要代码上下文。

赛伊: 打开同一页面,识别损坏的布局,点击重现确切的状态。使用三个带注释的屏幕截图生成重现步骤。将文件路径、页面 URL 以及预期行为与实际行为交给 Claude Code。

结果: Claude Code 在最近合并的 PR 中发现了 z-index 冲突。修复它。Sai 验证页面的呈现是否正确。

场景 5:API 更改会以静默方式中断前端

触发器: 后端 PR 更改了响应形状 /api/订单 — 重命名 总金额总金额

Claude Code 发现: API 变更符合新的命名规范。后端测试通过。

赛发现: 前端订单历史记录页面显示每个订单总额的 “$NaN”。前端代码仍在引用 总金额

结果: Sai 截取了已损坏的订单历史记录。Claude Code 找到了前端参考并对其进行了更新。Sai 使用真实数据重新测试订单历史记录页面。

Stop doing repetitive tasks. Let Sai handle them for you.

Sai is your AI computer use agent — it operates your apps, automates your workflows, and gets work done while you focus on what matters.

Try Sai

FAQS