CaptchaLaCaptchaLa
移行ガイド

GeeTest から CaptchaLa へ移行する

セルフサービスの料金、英語優先のドキュメント、4つの隠しフィールドの代わりに単一トークン。10分かからずに切り替えできます。

登録 — 営業電話なし比較を読む
極GeeTestCurrent setup~10 minCaptchaLaDrop-in target

コード変更のイメージ

Before — GeeTest GT4
<div id="captcha"></div>
<script src="https://static.geetest.com/v4/gt4.js"></script>
<script>
  initGeetest4({ captchaId: 'YOUR_CAPTCHA_ID' }, function(captcha) {
    captcha.appendTo('#captcha')
    captcha.onSuccess(function() {
      var result = captcha.getValidate()
      document.getElementById('lot_number').value = result.lot_number
      document.getElementById('captcha_output').value = result.captcha_output
      document.getElementById('pass_token').value = result.pass_token
      document.getElementById('gen_time').value = result.gen_time
    })
  })
</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 — GeeTest サーバー検証 (Node)
const sign = crypto.createHmac('sha256', process.env.GEETEST_KEY)
  .update(req.body.lot_number).digest('hex')
const res = await fetch(`https://gcaptcha4.geetest.com/validate?captcha_id=${process.env.GEETEST_ID}`, {
  method: 'POST',
  headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
  body: new URLSearchParams({
    lot_number: req.body.lot_number,
    captcha_output: req.body.captcha_output,
    pass_token: req.body.pass_token,
    gen_time: req.body.gen_time,
    sign_token: sign,
  }),
})
const data = await res.json()
if (data.result !== '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（サーバー側用）をコピーします。

  2. 2

    GeeTest の初期化 JS を削除する

    initGeetest4 の呼び出しとその onSuccess コールバックを削除します。値を入れていた4つの隠し入力（lot_number、captcha_output、pass_token、gen_time）も外します。

  3. 3

    CaptchaLa ウィジェットタグを追加する

    GeeTest のブロック全体を当社の div + スクリプトに置き換えます。JS の設定は不要で、ウィジェットは data-app-key から自動初期化されます。

  4. 4

    サーバー検証を簡素化する

    GeeTest の検証（HMAC sign_token の計算、4フィールドのボディ、result 文字列チェック）を、apiv1.captcha.la/v1/validate への単一の JSON POST と valid フラグ（data.valid）に置き換えます。

  5. 5

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

    フォームを1つずつ切り替えます。コンバージョンとチャレンジ率を観察してください。最低利用量も契約もないので、段階的なロールアウトは無料です。

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

WordPress + WooCommerce

コミュニティ製の GeeTest プラグインやカスタム連携を使っていた場合は、公式の CaptchaLa プラグインに置き換えてください。インストール1つでログイン、登録、コメント、WooCommerce、CF7、Gravity、WPForms をカバーします。

View integration →

よくある質問

CaptchaLa は中国本土でも同じように使えますか？

はい。中国本土内にネイティブのエンドポイントを運用しており、他地域の実ユーザーと同じ低遅延の検証が得られます。別の SDK も別の請求も不要です。

チームが慣れている GeeTest のスライダー UX はどうなりますか？

CaptchaLa は適応型システムのチャレンジタイプの1つとしてスライダーを備えています。既定ではありませんが利用可能です。多くのチームは、既定（低リスクには非表示、高リスクにはクリック）がスライダー優先よりも高いコンバージョンになることを確認しています。

リスクスコアリングの感度に違いはありますか？

GeeTest のリスクモデルは APAC のトラフィックパターン向けに調整されています。CaptchaLa はグローバル向けです。APAC 中心のトラフィックなら同等の挙動が期待できます。APAC 外であれば、誤検知が有意に減ることがあります。