如何通过 Cloudflare Turnstile 保护 n8n Webhook 免受恶意请求？

在现代网络服务中，保护用户数据和防止恶意请求是至关重要的。本文将详细介绍如何通过 Cloudflare Turnstile 与 n8n webhook 的集成，构建一个安全可靠的前端防护体系。

一、背景：为什么需要保护 n8n Webhook？

在上一篇文章中，我们探讨了 n8n webhook 的三种认证方式，但这些方法主要适用于后端服务之间的通信。当 webhook 直接面向用户时，情况就大不相同。用户不应接触复杂的 API 密钥，且在服务 URL 暴露于公网上时，如何防止恶意请求成为了一个棘手的问题。

恶意请求的威胁

想象一下，你的 AI 翻译服务被恶意用户利用脚本进行批量请求，导致 API 账单暴增。这种情况不仅影响了服务的正常运行，还可能造成经济损失。因此，建立有效的防护机制显得尤为重要。

二、什么是 Cloudflare Turnstile？

Cloudflare Turnstile 是一种现代化的验证码解决方案，旨在提供更好的用户体验。与传统的验证码不同，Turnstile 允许用户在几乎无感知的情况下完成验证，避免了繁琐的图片识别或文字输入。

获取 Cloudflare Turnstile

1. 登录 Cloudflare 账号，找到 Turnstile 选项。
2. 点击 添加小组件，填写小组件名称。
3. 添加主机名（如：n8n-foobar.ap-northeast-1.clawcloudrun.com），注意去掉 https:// 和结尾的 /。
4. 创建小工具后，获取 网站密钥 和 密钥，分别用于前端和后端验证。

三、配置 Webhook 前端

前端代码实现

在前端代码中，需要特别关注 data-sitekey 的值，它是之前获取的 网站密钥。以下是一个简单的表单示例：

html

JavaScript 处理逻辑

需要实现 Turnstile 的回调和表单提交逻辑：

javascript
let turnstileToken = null;
let isVerified = false;

function onTurnstileSuccess(token) {
turnstileToken = token;
isVerified = true;
document.getElementById(‘submitBtn’).disabled = false;
}

form.addEventListener(‘submit’, async function(e) {
e.preventDefault();
if (!isVerified) {
alert(‘请完成安全验证！’);
return;
}
// 发送请求时包含 turnstile-token
});

四、配置 Webhook 后端

后端验证 Turnstile Token

在 n8n 的 webhook 中，接收上传的数据时，需验证 turnstile-token。可以通过增加一个 HTTP Request 节点来调用 Cloudflare Turnstile API 进行验证。

1. 增加一个 Turnstile 验证节点，调用端点 https://challenges.cloudflare.com/turnstile/v0/siteverify。
2. 传递之前获取的密钥和 turnstile-token。

验证响应结果

如果验证成功，返回的 JSON 中会有 "success": true。后续节点可以根据这个字段决定是否继续处理请求。

五、写在最后

通过 Cloudflare Turnstile 与 n8n webhook 的集成，我们不仅提升了用户体验，还有效防止了恶意请求。这一实践反映了技术在解决问题时的深层思考：如何构建一个可持续、可扩展的服务体系。

我认为：在技术不断发展的今天，保护用户数据和服务安全是每个开发者的责任。通过合理的设计和有效的工具，我们可以为用户提供更安全的体验。