CaptchaLaCaptchaLa
移行ガイド

Turnstile から CaptchaLa へ移行する

10分かからずに差し替え可能。フォームはそのまま、Cloudflare 依存を外し、チャレンジフォールバックと中国本土エンドポイントを手に入れます。

登録してキーを取得比較を読む
TTurnstileCurrent setup~10 minCaptchaLaDrop-in target

コード変更のイメージ

Before — Turnstile
<div class="cf-turnstile" data-sitekey="YOUR_SITE_KEY"></div>
<script src="https://challenges.cloudflare.com/turnstile/v0/api.js" async defer></script>
After — CaptchaLa
<button id="login-btn">Sign in</button>
<script src="https://cdn.captcha-cdn.net/captchala-loader.js"></script>
<script>
  loadCaptchala(() => Captchala.init({ appKey: 'YOUR_APP_KEY', action: 'login' })
    .onSuccess(res => onToken(res.token))
    .bindTo('#login-btn'));
</script>
Before — Turnstile サーバー検証 (Node)
const res = await fetch('https://challenges.cloudflare.com/turnstile/v0/siteverify', {
  method: 'POST',
  headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
  body: new URLSearchParams({
    secret: process.env.TURNSTILE_SECRET,
    response: req.body['cf-turnstile-response'],
  }),
})
const data = await res.json()
if (!data.success) return res.status(400).json({ error: 'bot' })
After — CaptchaLa サーバー検証 (Node)
const res = await fetch('https://apiv1.captcha.la/v1/validate', {
  method: 'POST',
  headers: {
    'X-App-Key': process.env.CAPTCHALA_APP_KEY,
    'X-App-Secret': process.env.CAPTCHALA_APP_SECRET,
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({ pass_token: req.body['captchala-token'] }),
})
const { data } = await res.json()
if (!data || !data.valid) return res.status(400).json({ error: 'bot' })

移行手順

  1. 1

    登録して App Key と Secret を取得する

    無料の CaptchaLa アカウントを作成し、サイトを追加して App Key（公開用）と App Secret（サーバー側用）をコピーします。Cloudflare アカウントは不要です。

  2. 2

    ウィジェットタグを差し替える

    cf-turnstile を captchala に、data-sitekey を data-app-key に置き換えます。スクリプト src を当社の CDN に変更してください。ウィジェットの形（div プレースホルダー + スクリプトタグ）は同じです。

  3. 3

    隠しフィールド名を更新する

    Turnstile は cf-turnstile-response を、CaptchaLa は captchala-token を挿入します。ほとんどのフォームハンドラーはフィールドを名前で読みませんが、読んでいる場合は1か所だけ定数名を変更してください。

  4. 4

    サーバー検証の呼び出しを更新する

    エンドポイントを apiv1.captcha.la/v1/validate に変更します。当社は JSON を受け付けます（Turnstile は form-urlencoded）ので、Content-Type とボディの形を更新してください。レスポンスは引き続き valid フラグ（data.valid）を返すため、分岐コードに使えます。

  5. 5

    段階的にロールアウトする

    ほとんどのフォームは Turnstile のまま残し、まずトラフィックの少ない1つのフォームに CaptchaLa を導入します。1日かけてコンバージョンとチャレンジ率を観察してください。納得できたら拡大しましょう。最低利用量も契約もありません。

より速く:プラグインを使う

WordPress + WooCommerce

WordPress でコミュニティ製の Turnstile プラグインを使っていた場合は、当社の公式プラグインに差し替えてください。ログイン、登録、コメント、WooCommerce のチェックアウト、CF7 / Gravity / WPForms をインストール1つでカバーします。

View integration →

Flarum

Composer 経由で CaptchaLa 拡張をインストールし、管理画面で有効化するだけ。Flarum のフォーム（登録、ログイン、パスワードリセット、投稿への返信）がすべて CaptchaLa を経由します。

View integration →

よくある質問

Cloudflare の CDN を維持したまま CaptchaLa を使えますか？

はい。CaptchaLa はあらゆる CDN から独立しています。お客様の多くは CDN に Cloudflare を、検証に CaptchaLa を使い続けています。2つのレイヤーは競合しません。

Cloudflare のボット検出ルールは引き続き適用されますか？

はい。それらは Cloudflare WAF / Bot Management の機能で、Turnstile とは別物です。Turnstile ウィジェットを削除しても、Cloudflare ゾーンの設定には影響しません。

Cloudflare Workers 経由で Turnstile を使っている場合は？

Worker 側でも移行は同じです。Turnstile の fetch を CaptchaLa の fetch に置き換えるだけです。Workers ランタイムと互換性のあるスニペットをドキュメントに用意しています。