Turnstileを使用したフォームのサンプル

<form action="/" method="POST">
  <input type="text" placeholder="username" class="form-control">
  <input type="password" placeholder="password" class="form-control">
  <div class="cf-turnstile" data-sitekey="0x4AAAAAAAAfoobarbaz" data-callback="javascriptCallback"></div>
  <button type="submit" value="Submit" class="form-control" disabled>ログイン</button>
</form>

<script src="https://challenges.cloudflare.com/turnstile/v0/api.js" async defer></script>
<script>
function javascriptCallback() {
  document.querySelector('[type="submit"]').removeAttribute('disabled')
}
</script>

元記事を表示する