3步解决n8n被薅羊毛：Turnstile验证拯救你的API账单

3步解决n8n被薅羊毛：Turnstile验证拯救你的API账单 3步解决n8n被薅羊毛：Turnstile验证拯救你的API账单 Modified August 1, 2025 No access Cloudflare Turnstile 与 n8n webhook 的集成演示 00:00 3、Turnstile加载状态检测（可选但有用） Code block JavaScript Copy // 检测Turnstile是否正常加载 const checkTurnstile = setInterval(function() { if (window.turnstile && document.querySelector('.cf turnstile')) { console.log('Turnstile验证组件已就绪'); clearInterval(checkTurnstile); } }, 1000); 📌 关键点： onTurnstileSuccess回调获取验证 token 表单提交时将 token 传递给后端 验证失败时禁用提交按钮 官方也提供了客户端集成代码，大家可以参考。最终效果： No access 文档多语言 00:00 四、配置 Webhook 后端 前端配置完成！用户现在可以完成验证了。但验证 token 如何在后端验证呢？ 好问题！ 其实很简单，通过 webhook 接收上传的数据，可以看出 output 里多了一个 turnstile token 字段。它就是 Cloudflare Turnstile 的验证 token。 接下来我们只需要在这个 webhook 后面追加一个验证节点，来验证这个 turnstile token 是否正常。 因为我们的 translate upload 这个接口也是暴露在公网上的，为了防止 turnstile token 被篡改掉，二次验证非常必要！ 一）增加专用的 Turnstile 验证节点 如图所示，增加一个 Trunstile 验证的 HTTP Request 节点。 🎯 它会调用 Cloudflare Turnstile API 验证用户提交的安全令牌，确保请求来自真实用户而非恶意机器人。 • 验证端点：https://challenges.cloudflare.com/turnstile/v0/siteverify • 验证失败时会阻止后续处理流程 这个验证节点配置非常简单，它只接受两个参数：第一步获取的密钥 ，以及 turnstile token 。 二）验证响应结果 如果验证通过的话，JSON中会有"success": true。后续节点检查 API 返回的 success 字段即可。 可复用：Turnstile 验证节点可以在其他工作流中复用！ 现在这个设计更加清晰和模块化了！🚀 五、写在最后 通过 Cloudflare Turnstile 与 n8n webhook 的集成，我们成功构建了一个既用户友好又安全可靠的前端防护体系。但这个实践背后，其实反映了更深层次的思考。 技术的本质是解决问题。但解决问题的过程中，我们往往会发现更深层的问题。这次的 Turnstile 集成实践，表面上是为了防止恶意请求，深层次却是在思考如何构建一个可持续、可扩展的服务体系。 你的 n8n 工作流准备好迎接真实世界的挑战了吗？ 🚀 🎼 参考资料： 本文的技术方案参考了 Darrell 的博客文章，在此基础上结合实际项目经验进行了完善和扩展。感谢原作者的分享！ 我是林月半子，关注我，带你一起挖掘工作流自动化的无限可能。 林月半子的AI笔记 客户端集成代码 No access Cloudflare Turnstile 与 n8n webhook 的集成演示 00:00 No access Cloudflare Turnstile 与 n8n webhook 的集成演示 00:00 3、Turnstile加载状态检测（可选但有用） 📌 关键点： onTurnstileSuccess回调获取验证 token 表单提交时将 token 传递给后端 验证失败时禁用提交按钮 关键点： onTurnstileSuccess回调获取验证 token 表单提交时将 token 传递给后端 验证失败时禁用提交按钮 官方也提供了客户端集成代码，大家可以参考。最终效果： 客户端集成代码 No access 文档多语言 00:00 No access 文档多语言 00:00 四、配置 Webhook 后端 前端配置完成！用户现在可以完成验证了。但验证 token 如何在后端验证呢？ 好问题！ 其实很简单，通过 webhook 接收上传的数据，可以看出 output 里多了一个 turnstile token 字段。它就是 Cloudflare Turnstile 的验证 token。 接下来我们只需要在这个 webhook 后面追加一个验证节点，来验证这个 turnstile token 是否正常。 因为我们的 translate upload 这个接口也是暴露在公网上的，为了防止 turnstile token 被篡改掉，二次验证非常必要！ 一）增加专用的 Turnstile 验证节点 如图所示，增加一个 Trunstile 验证的 HTTP Request 节点。 🎯 它会调用 Cloudflare Turnstile API 验证用户提交的安全令牌，确保请求来自真实用户而非恶意机器人。 • 验证端点：https://challenges.cloudflare.com/turnstile/v0/siteverify • 验证失败时会阻止后续处理流程 它会调用 Cloudflare Turnstile API 验证用户提交的安全令牌，确保请求来自真实用户而非恶意机器人。 • 验证端点：https://challenges.cloudflare.com/turnstile/v0/siteverify • 验证失败时会阻止后续处理流程 这个验证节点配置非常简单，它只接受两个参数：第一步获取的密钥 ，以及 turnstile token 。 二）验证响应结果 如果验证通过的话，JSON中会有"success": true。后续节点检查 API 返回的 success 字段即可。 可复用：Turnstile 验证节点可以在其他工作流中复用！ 现在这个设计更加清晰和模块化了！🚀 五、写在最后 通过 Cloudflare Turnstile 与 n8n webhook 的集成，我们成功构建了一个既用户友好又安全可靠的前端防护体系。但这个实践背后，其实反映了更深层次的思考。 技术的本质是解决问题。但解决问题的过程中，我们往往会发现更深层的问题。这次的 Turnstile 集成实践，表面上是为了防止恶意请求，深层次却是在思考如何构建一个可持续、可扩展的服务体系。 你的 n8n 工作流准备好迎接真实世界的挑战了吗？ 🚀 🎼 参考资料： 本文的技术方案参考了 Darrell 的博客文章，在此基础上结合实际项目经验进行了完善和扩展。感谢原作者的分享！ 参考资料： 本文的技术方案参考了 Darrell 的博客文章，在此基础上结合实际项目经验进行了完善和扩展。感谢原作者的分享！ 我是林月半子，关注我，带你一起挖掘工作流自动化的无限可能。 🔗 原文链接：https://mp.weixin.qq.com/s/1IKGnWajkJutAvBi2jYCdg 作者：林月半子的AI笔记 在上一篇文章里，我介绍了 n8n webhook 的三种认证方式——API密钥、基础认证和 Bearer Token。但那些方案？仅仅适用于后端服务间的调用罢了。它们就像是服务器之间的"暗号"，适合机器对机器的通信。 n8n webhook 的三种认证方式 然而，当我们将 webhook 作为前端服务直接展现给用户时，游戏规则完全变了。用户不会记住复杂的 API 密钥，也不应该暴露这些敏感信息给浏览器。更关键的是，当你的服务 URL 暴露在公网上时，又该如何有效防止恶意自动化请求呢？ 这个问题，比想象中更加棘手。 想象一下这样的场景：你精心搭建了一个 AI 翻译服务，用户可以通过网页上传文档并获得翻译结果。一切看起来完美，直到某天你发现 API 账单暴增——原来有人写了脚本在批量"薅羊毛"。传统的后端认证对此束手无策，因为攻击者根本不需要绕过任何认证，他们直接模拟用户行为就够了。 这就是我们今天要解决的问题。 一、背景 这几天准备给 MuleRun 提交一个工作流。原来我是采用 n8n 的 form 节点作为用户资料的提交。实话实说？默认表单样式实在太丑了！ 虽然能通过样式修改，但效果依然不尽如人意。 没办法，后来还是通过 vibe coding 的方式搞出了一个表单界面，效果还是可以的。 怎么实现的？其实很简单，在 n8n 里通过 webhook 就能搞定，如下图所示： 但是，问题来了。我们精心打造的工作流是为用户服务的，现实却异常残酷。恶意爬虫和自动化攻击接踵而至： 💀 • 每天大量自动化脚本疯狂批量调用翻译 API • 恶意用户通过脚本上传海量垃圾内容 • 竞争对手可能通过自动化工具进行"压力测试" • 每天大量自动化脚本疯狂批量调用翻译 API • 恶意用户通过脚本上传海量垃圾内容 • 竞争对手可能通过自动化工具进行"压力测试" 这个工作流的翻译服务是调用第三方 API 实现的。每当面对这种情况，每次调用都会产生成本！钱包在哭泣。 那么我们怎么去防护呢？这就是今天文章的核心所在——通过验证机制来阻止这些恶意行为。 喜欢冲浪的小伙伴们，应该对这个图标非常熟悉： 没错！下面会介绍如何将Cloudflare Turnstile 和 n8n 的 webhook 完美集成。 二、什么是 Turnstile？ Cloudflare Turnstile 是传统验证码（如reCAPTCHA）的现代化替代方案。它能够在用户几乎无感知的情况下完成人机验证，避免了繁琐的图片识别或文字输入步骤。相比传统验证码，Turnstile 更注重用户体验 ，同时提供强大的安全防护能力。 一）获取 Cloudflare Turnstile 登录 Cloudflare 账号后，在左边菜单栏里能看到一个 Turnstile，然后点击右侧的 “添加小组件”按钮。 Cloudflare 1、填写小组件名称 2、添加主机名 接下来需要添加主机名称，我的 n8n 是部署在 clawcloud 的。 假设我的访问地址是：https://n8n foobar.ap northeast 1.clawcloudrun.com/ 需要添加的主机名是：n8n foobar.ap northeast 1.clawcloudrun.com n8n foobar.ap northeast 1.clawcloudrun.com ⚠️ 注意：要去掉 https://，以及结尾的 /，只保留域名。 注意：要去掉 https://，以及结尾的 /，只保留域名。 3、点击创建，生成小工具 二）获取站点密钥和密钥 创建完小工具后就能获取站点密钥 和 密钥了， 如下图所示 🎯 网站密钥：放在网站上的，每个用户都能看到。没关系！ 密钥： 放在后端做验证用。我们用 n8n 当后端，所以会放在 n8n 的处理 workflow 中。 网站密钥：放在网站上的，每个用户都能看到。没关系！ 密钥： 放在后端做验证用。我们用 n8n 当后端，所以会放在 n8n 的处理 workflow 中。 三、配置 Webhook 前端 怎么用呢？非常简单！ 一）前端代码 特别需要关注 data sitekey 的 value 值，0x4AAAAAABnVAUEc9XDbVKWb。看出来了吗？它就是上面的站点密钥。 和 Turnstile 相关的前端代码片段： 与传统验证码截然不同！Turnstile 的验证过程对用户几乎透明：用户只需看到一个简单勾选框就能完成验证。就这么简单。 有了 HTML 结构，接下来需要 JavaScript 来处理 Turnstile 的回调和表单提交逻辑了。 二）JavaScript 处理逻辑 完整的前端还需要 JavaScript 来处理 Turnstile 的回调和表单提交： 1、Turnstile 回调函数（重要） 2、表单提交核心逻辑（重要）