每周给网页截图做检查并生成 Linear 报告

每周给网页截图做检查并生成 Linear 报告

一个分两部分的 n8n 工作流。A 部分给 Google 表格里的每个页面拍一张基准截图。B 部分每周一运行，拍一张新截图，让 Google Gemini 对比这两张，并把差异记成一个 Linear issue。

包里有什么

• workflow.json：n8n 导出的工作流，三十四个节点。二十四个干活，十个是便签，解释各个步骤。里面没有任何凭据。
• README.md：这份设置说明，压缩包里的是英文版。

我们相对原来的副本改了什么

• 聊天模型原来用的是 models/gemini-1.5-pro-latest。Google 的模型页和弃用页（2026 年 11 月 12 日查阅）已经不再列出任何 1.5 模型，所以 Mindket 的版本用 models/gemini-3.6-flash，模型页把它列为可用，并支持图片输入。
• Get Webpages List 里还留着一个只保留表格第 2 行的过滤。Mindket 的版本把它删了，所以 B 部分会检查每一行。
• 两个截图节点原来把 Apify 令牌作为 token 查询参数发送。Apify 的 API 文档（2026 年 11 月 12 日查阅）说这比 Authorization 头更不安全，所以 Mindket 的版本改用 Header Auth 凭据。
• Drive 文件夹、Google 表格和 Linear 团队原来属于原作者。这些字段现在是空的，请选你自己的。
• 便签里原来有推广链接、一个示例表格的链接，还有加入聊天服务器的邀请。它们被换成一个普通链接和一句说明表格各列的话。
• 文件原来没有 settings 部分，所以 Mindket 的版本加上了 executionOrder v1，也就是 n8n 给新工作流设的值。
• 有几个节点原来关联着作者 n8n 里的凭据。这些关联已删掉，请选你自己的。
• 别的都没改。提示词、循环和报告文字都是文件原有的。

开始之前

• 一个 n8n 实例。如果想让周一的运行自动发生，就要发布这个工作流。
• 一个 Google Sheets 文件，列为 service、url 和 base。service 里放名称，url 里放完整的页面地址，每个页面一行。base 留空，因为 A 部分会填它。
• 一个放基准截图的 Google Drive 文件夹。
• 一个 Apify 账号和它的 API 令牌。截图来自 Apify 的 apify/screenshot-url actor。
• 一个来自 Google AI Studio 的 Google Gemini API 密钥。
• 一个 Linear 账号，以及用来记录 issue 的团队。

设置

1. 在 n8n 里新建一个工作流，打开它的菜单，选 Import from File，选中 workflow.json。
2. 添加一个 Google Sheets 凭据。在 Get URLs with Missing Base Images、Update Base Image 和 Get Webpages List 里选中它，并在每个节点里选好你的文件和工作表。
3. 添加一个 Google Drive 凭据。在 Upload to Drive 和 Base Image 里选中它，并在 Upload to Drive 里选好你的文件夹。
4. 为 Apify 添加一个 Header Auth 凭据。名称填 Authorization，值填 Bearer <YOUR_APIFY_TOKEN>，换成你自己的令牌。在 Run Webpage Screenshot 和 Run Webpage Screenshot1 里选中它。
5. 添加一个 Google Gemini 凭据，填上你的密钥，在 Google Gemini Chat Model 里选中它。检查模型是 models/gemini-3.6-flash。
6. 添加一个 Linear 凭据，在 Create Report 里选中它，并在那里选好你的团队。
7. 点 Execute workflow。这会运行 A 部分。之后打开表格，检查每一行的 base 里都有一个文件 id。
8. 想立刻试 B 部分，就打开 Schedule Trigger，运行这一步。发布工作流后，每周一 6 点会运行一次。

一次运行的过程

1. A 部分从手动触发器开始。Get URLs with Missing Base Images 读出表格的各行。
2. Loop Over Items 把每个页面发给 Run Webpage Screenshot，它运行 Apify actor 并等待回答。窗口宽 1280 像素，Wait 在页面之间停两秒。
3. 循环结束后，Merge 把每一行和它的截图配对。Download Screenshot 取回图片，Upload to Drive 用编码后的页面地址作为名称保存，Update Base Image 把 Drive 文件 id 写进 base。
4. B 部分从 Schedule Trigger 开始，它在每周一 6 点触发。Get Webpages List 读出各行，For Each Webpage... 一次取一行。
5. 对每个页面，Base Image 从 Drive 下载保存的截图。Run Webpage Screenshot1 拍一张新的，Download New Screenshot 取回它，Combine Screenshots 把两张合到一起。
6. Visual Regression Agent（Basic LLM Chain 1.4）把两张图作为 Image (Binary) 消息发给 Google Gemini Chat Model。它的系统消息要求找出文字、图片、颜色、位置和布局上的变化。它还说要忽略文字样式和大小写。Structured Output Parser 把回答变成一个变化列表，每项有类型、描述、之前的状态和现在的状态。Wait1 停一秒。
7. 最后一个页面之后，Combine Row and Result 把每一行和它的列表合在一起。Has Changes 只留下至少有一处变化的页面，Aggregate 把它们收到一起。Create Report 创建一个名为 Visual Regression Report 的 Linear issue，带日期。这个 issue 列出每个页面和它的变化。

改变结果

• 哪些页面：表格的各行。
• 什么时候运行：Schedule Trigger。
• 什么算变化：Visual Regression Agent 里的系统消息。
• 报告发到哪里：Create Report。如果不用 Linear，就换成 Slack 或 Jira 节点。
• 截图的大小和等待：两个截图节点的请求体。保持一致，基准图和新图片才能对上。
• 模型：Google Gemini Chat Model 里的 modelName。

注意事项

• 尽管名字如此，Get URLs with Missing Base Images 读的是每一行。A 部分每运行一次，就为每个页面存一个新的基准文件，并改写 base。旧文件留在 Drive 里。
• 一个在线页面的两张截图很少完全一样。广告、轮播和日期可能显示成变化，所以读最初几份报告时要记着这一点。
• Apify 的同步运行接口在 300 秒后结束调用（Apify API 文档，2026 年 11 月 12 日查阅）。
• B 部分里，每个页面花一次 Apify 运行和一次 Gemini 调用。Apify 和 Google 把它们记到你的账号上。
• 页面地址发给 Apify。每个页面的两张图发给 Google，报告文字发给 Linear。
• 文件里没有任何凭据和密钥。