Claude软件基础设施AI 评分 · 79/100AI 辅助编辑·未发现明显提示词注入风险n8n.io

用 n8n + Claude 自动生成 SubmitRax 表单并托管到 GitHub Pages

自然语言描述 → Claude Sonnet 调用 SubmitRax MCP 生成表单 HTML → 自动发布到 GitHub Pages 并返回在线链接

有一点经验步骤流程提示词贴士
给谁
需要在静态站点快速部署可收集数据的表单的运营者或开发者
你会得到
通过聊天描述即可生成带样式的 HTML 表单，自动获得可访问的 GitHub Pages 链接
你需要
n8n · GitHub

硬约束

在 n8n 中导入该模板，配置 SubmitRax Bearer Token、Anthropic API Key、GitHub PAT 及仓库信息，启用 Chat Trigger 后即可通过自然语言对话生成并托管表单。

他们做了什么

Pollup 在 n8n 官方模板库发布了一个工作流模板：用户通过 Chat Trigger 用自然语言描述表单需求，Claude Sonnet AI Agent 调用 SubmitRax MCP 服务器生成表单 HTML，随后工作流自动检查 GitHub Pages 仓库中对应文件是否存在，执行创建或更新操作，最终返回表单的公开访问链接。模板包含完整的节点连接、参数配置和便签说明。

效果如何

作者报告称该工作流可生成带 Tailwind CSS 样式的表单 HTML，自动托管到 GitHub Pages，并返回 formKey 与 hosted URL（author_report）。SubmitRax 负责后端数据收集，可路由到邮件、Slack、Discord 或 webhook。

值得知道

GitHub Pages 链接生效需要一定时间，作者提示需耐心等待（'The hosted URL link tak ea while to go live. Be patient!'）。若使用 gh-pages 分支而非 main，需要手动修改两个 GitHub 节点的 branch 参数。Get Public Form HTML 的具体节点未在提供的 workflow.json 中显式出现，sticky-notes 提示需对照 SubmitRax API 文档确认端点。模板默认使用 claude-sonnet-5，但可更换为其他 Claude 模型或 OpenAI、Gemini 等。本站未实测此工作流。

步骤

  1. 配置 SubmitRax 与 Anthropic 凭证

    在 n8n 中创建两个凭证：1) HTTP Bearer Auth，填入从 submitrax.com 获取的 API Token；2) Anthropic API，填入你的 API Key，供 Claude Sonnet 模型节点使用。

  2. 配置 GitHub 仓库与 Pages 托管

    创建一个公开 GitHub 仓库并启用 GitHub Pages（默认从 main 分支部署）。生成具有 repo 内容读写权限的 Personal Access Token，在 n8n 中创建 GitHub 凭证并绑定到相关节点。打开 GitHub Hosting Config 节点，将 githubUsername 和 pagesRepo 替换为你的实际用户名和仓库名。

  3. 通过 Chat Trigger 输入表单需求

    打开 n8n Chat Trigger，用自然语言描述你想要的表单，例如字段、样式要求。不需要手写 HTML。

    运行提示词 · 来源原文。Chat Trigger 用户输入示例

    Create a form with a data field called "Date of birth", a "comment" textarea, and a text field "Name". Make it look nice with tailwind CSS.

  4. AI Agent 调用 MCP 生成表单

    SubmitRax Form Agent1 节点使用 Claude Sonnet 5 作为语言模型，连接 SubmitRax MCP Tool 和结构化输出解析器。Agent 会调用 MCP 服务创建表单端点，并返回包含 comment、formKey 和 html 的结构化数据。

  5. 安全建议：执行前人工确认

    安全建议（编辑补充的安全提示，非模板作者的做法）：在工作流向你的 GitHub 仓库提交文件、发布到 GitHub Pages 之前，先由你本人确认要提交的内容和目标仓库。

  6. 检查并发布到 GitHub Pages

    工作流通过 GitHub 节点检查 forms/<formKey>.html 是否已存在：若存在则更新文件，若不存在则创建新文件。两个分支最终都汇聚到 Compose Hosted URL 节点。

  7. 获取在线表单链接

    Compose Hosted URL1 节点根据 GitHub Hosting Config 中的用户名和仓库名，拼接出 https://<username>.github.io/<repo>/forms/<formKey>.html 的公开链接，与 comment 和 formKey 一并返回。

可复制提示词

运行提示词 · 来源原文。在 n8n 聊天窗口（Chat Trigger）中发送

这一段是提示词，页面不会在这里插入广告。

Create a form with a data field called "Date of birth", a "comment" textarea, and a text field "Name". Make it look nice with tailwind CSS.

来源

Generate and host SubmitRax chat-built forms with Claude and GitHub Pages · Pollup · n8n.io · 2026-09-22T13:52:29.103Z

留言与反馈

试过这个方法吗？分享效果、遇到的问题或改进建议。留言审核后公开，请勿填写敏感信息。

正在加载…

    相关用例