使用 Turnstile 的步骤:
首先,你需要创建一个 cloudflaree 帐户并获得你的站点密钥和密钥。然后,嵌入 Turnstile JavaScript API 脚本:
<script src=https://challenges.cloudflare.com/turnstile/v0/api.js async defer></script>
你可以通过扫描HTML中的cf-turnstile类元素来使用隐式渲染:
<form action="/login" method="POST">
<div class="cf-turnstile" data-sitekey="yourSiteKey"></div>
<input type=submit>
</form>
用户回答质询后,cf-turnstile-response令牌将被插入元素。你可以验证这个令牌来确认它的有效性,不论是在服务器端还是云端(例如使用一个简单的Worker):
async function handleRequest() {
//...接收令牌
let formData = new FormData();
formData.append('secret', turnstileISecretKey);
formData.append('response', receivedToken);
await fetch('https://challenges.cloudflare.com/turnstile/v0/siteverify', {
body: formData,
method: 'POST'
});
//...
}
你也可以通过JavaScript显式调用Turnstile质询。响应令牌只能被兑换一次。
你可以创建"操作",用自定义标签来区分不同页面(例如登录、注销、创建帐户)。
部署后,你可以查看分析报告,了解部署位置和用户如何解决质询。
网友回复
为啥所有的照片分辨率提升工具都会修改照片上的图案细节?
js如何在浏览器中将webm视频的声音分离为单独音频?
微信小程序如何播放第三方域名url的mp4视频?
ai多模态大模型能实时识别视频中的手语为文字吗?
如何远程调试别人的chrome浏览器获取调试信息?
为啥js打开新网页window.open设置窗口宽高无效?
浏览器中js的navigator.mediaDevices.getDisplayMedia屏幕录像无法录制SpeechSynthesisUtterance产生的说话声音?
js中mediaRecorder如何录制window.speechSynthesis声音音频并下载?
python如何直接获取抖音短视频的音频文件url?
js在浏览器中如何使用MediaStream与MediaRecorder实现声音音频多轨道混流?