视频简介一键生成三组封面方向

原文要点

Kevin发布的免费n8n模板（workflows/19064）：GET webhook在浏览器里渲染一个封面需求表单，POST接收后做字段归一化、长度限制、可选YouTube链接与封面文字校验，失败返回带修改提示的400错误页；通过后构建好奇缺口、高风险冲突、前后对比三个创意方向，生成URL编码的ThumbCanvas深链（含提示词与所选宽高比、可选YouTube链接），最后返回一个HTML评审页，每个方向有理由、提示词和跳到ThumbCanvas继续设计的按钮。设置要点：激活工作流拿到生产webhook URL，浏览器打开/webhook/thumbcanvas-brief的GET地址；传递HTTPS的YouTube链接需n8n实例走HTTPS；ThumbCanvas登录按套餐使用。

这次做成什么

在你自己的n8n上复刻这套「表单→校验→三方向→评审页→深链跳转」流程；本站未获取原工作流文件，按导读描述提供一个等价的最小自建方案，节点为Webhook(GET返回HTML表单)→Webhook(POST)→Code(校验+生成三方向)→Respond to Webhook(返回评审HTML)。

准备什么

• 一个可公网访问并已激活工作流的n8n实例（云端或自托管均可）
• ThumbCanvas账号可选，仅用于点按钮跳转后继续设计
• 一条用于练习的视频简介，至少包含主题和受众两点信息
• 若要在深链里传HTTPS的YouTube链接，n8n实例需配置HTTPS访问

具体怎么做

1. 建GET表单节点

   新建工作流，加Webhook节点：HTTP Method选GET，Path填thumbcanvas-brief，Response Mode选Respond to Webhook；后面接Respond to Webhook节点，Content-Type填text/html，Body粘贴下方材料的HTML表单。激活工作流后浏览器打开生产URL即可看到表单。

2. 建POST接收与校验

   再加一个Webhook节点，Method选POST，Path保持thumbcanvas-brief。接一个Code节点，读取body里的brief、thumbnailText、youtubeUrl字段：brief不足20字、封面文字超过60字、YouTube链接非https开头时，直接返回400状态和列出所有错误的HTML错误页。

3. 生成三个方向

   校验通过后，在同一个Code节点里用下方提示词模板拼出好奇缺口、高风险冲突、前后对比三条完整提示词，各配一句方向理由（20-40字），并把宽高比（如16:9）一起放入数据结构。

4. 拼深链并返回评审页

   对每条提示词做encodeURIComponent，拼成ThumbCanvas的create页URL（具体参数名需在ThumbCanvas页面核对，本站示例用prompt、ratio、youtube三个占位参数），渲染成三张卡片HTML：方向名、理由、提示词全文、打开按钮，用Respond to Webhook以text/html返回。

可直接复制的材料

<!DOCTYPE html><html lang="zh"><head><meta charset="utf-8"><title>封面需求</title></head><body><h1>视频封面需求表</h1><form method="POST" action="/webhook/thumbcanvas-brief"><p>视频简介（至少20字）：<br><textarea name="brief" rows="5" cols="60" required></textarea></p><p>封面文字（可选，60字内）：<input name="thumbnailText" size="40"></p><p>YouTube链接（可选，需https）：<input name="youtubeUrl" size="50"></p><p>宽高比：<select name="ratio"><option>16:9</option><option>9:16</option><option>1:1</option></select></p><p><button type="submit">生成三个封面方向</button></p></form></body></html>

方向一【好奇缺口】：为视频「{{brief}}」设计YouTube封面。画面只展示结果的一半或一个被遮挡的关键物，留出信息缺口让人必须点开。配色高对比，主视觉占画面60%以上，封面文字不超过8个字：{{thumbnailText}}
方向二【高风险冲突】：为同一视频设计封面。画面呈现冲突瞬间或「再不行动就晚了」的紧张感，人物表情夸张或倒计时元素，红色/黄色警示色调，文字用短句制造紧迫感。
方向三【前后对比】：为同一视频设计封面。画面左右分屏展示「之前」与「之后」的反差，中间用箭头或分割线连接，两侧亮度一暗一亮强化对比，文字点明变化结果。
统一要求：风格写实、主体清晰、小尺寸下仍可辨认，宽高比{{ratio}}。

输入与输出示例

本站虚构演示，未实际运行工作流，卡片文案为示例参考值。

输入

brief=「30天只用步行通勤，我的体脂和睡眠发生了什么变化，全程数据记录，面向想减脂但没时间的上班族」；thumbnailText=「不跑步也能瘦？」；ratio=16:9；youtubeUrl留空

对应输出

评审页返回三张卡片：①好奇缺口——理由「只露体脂秤数字的个位，逼观众点开看全貌」，按钮链接指向ThumbCanvas并预填提示词；②高风险冲突——理由「用‘30天后你会后悔没看’的倒计时制造紧迫」；③前后对比——理由「第1天与第30天侧面照分屏，反差一目了然」。若brief只填「减肥视频」四个字，则返回400页：「视频简介至少20字，请补充主题与受众」。

做完检查这些

• 浏览器打开GET webhook URL能看到含四个字段的表单，且激活的是生产URL而非测试URL
• 提交少于20字的简介会收到400状态页，且页面上逐条列出需要修改的字段
• 提交合法简介后返回的评审页包含恰好三个方向卡片，每个都有理由、提示词全文和跳转按钮
• 复制按钮链接在浏览器新标签能打开ThumbCanvas且提示词已预填

容易卡住的地方

• 用测试webhook URL测试时GET表单能看到但POST容易打到错误地址，务必激活后用生产URL
• 未配HTTPS的n8n实例传的YouTube链接可能在跳转时被浏览器拦截
• ThumbCanvas深链的具体参数名本站未核实，需打开其create页面核对后再定参数
• n8n的Respond to Webhook节点若不显式设置Content-Type为text/html，浏览器会把HTML当纯文本显示