我如何使用 Next.js 为 n8n 工作流生成 2800 多个 SEO 页面

Source: Dev.to

“如果你建造它，他们就会来。”

…其实并不完全是。如果 Google 不知道你的存在，他们是不会来的。

我一直在构建 n8nworkflows.world，一个用于 n8n 自动化模板的搜索引擎。我的目标很简单：让人们比在官方论坛上更容易找到高质量、已验证的 n8n 工作流。

但我遇到了瓶颈。人们并不只是搜索“n8n 工作流”。他们会搜索具体的问题：

• “如何将 Telegram 文件保存到 Google Drive”
• “Notion 到 Slack 的自动化”
• “Postgres 同步到 Google Sheets”

为了捕获这些流量，我需要为 每一种可能的集成组合 创建一个着陆页。手动编写这些页面需要多年时间。

于是，我使用 Next.js 和 Programmatic SEO 在一夜之间生成了 2,819+ 页面。下面是我的实现过程。

1. 问题： “长尾” 空白 🕳️

n8n 生态系统庞大。拥有数百个节点（集成）。
从数学上看，潜在的连接数量（节点 A → 节点 B）是巨大的。

大多数用户在寻找这些特定的配对。如果我只有一个主页，就会错失 99 % 的搜索意图。我需要一个结构化的目录，让 Google 能够爬取，索引诸如 Agile CRM + Schedule Trigger 或 Gmail + OpenAI 等特定术语。

2. 技术栈 🛠️

Source: …

3. 实现：从 JSON 到 SEO 页面

步骤 1 – 分析关系

我拥有 6,000+ 个 n8n 工作流 JSON 文件的数据库。
一个 Python 脚本解析这些 JSON 并提取 “节点对”。

示例：一个包含 Telegram Trigger 节点和 Google Drive 节点的工作流会生成关系 telegram-to-google-drive。

这些对被存储在 Supabase 表 integration_pairs 中：

步骤 2 – 使用 Next.js 实现动态路由

Next.js 让我们通过 动态路由 避免创建 2,000 个实体文件。

app/
└─ integration/
   └─ [slug]/
      └─ page.tsx

// app/integration/[slug]/page.tsx

import { createClient } from '@/utils/supabase/server';

export async function generateMetadata({ params }) {
  // 根据 URL slug 自动生成 SEO 标题
  const pair = params.slug.replace('-', ' to ');
  return {
    title: `Best ${pair} n8n Workflows & Templates (Free Download)`,
    description: `Discover verified automation templates to connect ${pair}. Download free JSONs.`,
  };
}

export default async function IntegrationPage({ params }) {
  const { slug } = params;

  // 获取所有匹配该对的工作流
  const workflows = await getWorkflowsByPair(slug);

  return (
    <>
      <h1>{slug.split('-').join(' ')} Integrations</h1>
      <ul>
        {workflows.map((wf) => (
          <li key={wf.id}>{wf.name}</li>
        ))}
      </ul>
    </>
  );
}

步骤 3 – 目录索引（“地图”）

为了帮助 Google 发现 2,800+ 个动态页面，我构建了一个庞大的 目录页面，按字母顺序（A‑Z）列出每一种组合。它相当于用户和爬虫的 “站点地图”。

4. 结果：一台 SEO 机器 🚀

• 2,819+ 个新入口点 – 搜索细分自动化的用户会直接进入专属页面。
• 更佳的用户体验 – 用户可以按“应用”浏览。想要了解 Notion 能做的所有事情？前往 Notion 集合。
• 可扩展性 – 添加一个将 “DeepSeek” 与 “WhatsApp” 连接的新工作流时，会自动生成 /integration/deepseek-to-whatsapp。

5. 奖励：排行榜 🏆

为了让站点更具黏性，我添加了一个 “名人堂” Leaderboard，实时跟踪工作流的 Heat Index（Views + Downloads），展示社区当前正在构建的内容。

接下来是什么？

我目前正在开发一个 AI 代理，它读取工作流 JSON，以自动提取原作者的姓名和社交链接，在应有的地方给予致谢，并进一步丰富社区体验。

将创作者的积分归还并构建“作者作品集”页面

(又一次 SEO 胜利！)

查看实时目录：

👉 n8n Integration Directory

告诉我你的想法！你在项目中尝试过程序化 SEO 吗？