Captcha:統合ガイド

スライダー、パズル、クリック認証、および画像復元

シーケンス図の説明:

1. ユーザーがビジネス クライアントで Captcha を初期化すると、クライアントは Captcha サーバーに画像や質問などの JavaScript (JS) リソースをリクエストします。

2. Captcha サーバーは JS リソースを動的に返します。その後、ビジネス クライアントはリソースを読み込み、Captcha をレンダリングします。

3. ユーザーがビジネス クライアントでスライダー、パズル、または画像復元チャレンジの解決などの Captcha 操作に成功すると、JS は自動的に回答を検証するリクエストを送信します。Captcha サーバーは、回答が正しいか、リクエストがマシンからのものかを検証します。

4. 検証が成功した場合、Captcha サーバーは success コールバック関数を呼び出し、CaptchaVerifyParam を返します。検証が失敗した場合、Captcha は自動的にリフレッシュされ、再試行できます。

5. ビジネス クライアントは、ビジネス パラメーターと CaptchaVerifyParam を含むリクエストをビジネス サーバーに送信します。

6. ビジネス サーバーは、Captcha サーバーの VerifyIntelligentCaptcha API を呼び出して CaptchaVerifyParam パラメーターを検証します。

7. Captcha サーバーは、パラメーターが正しいか、リクエストが悪意のあるものかを検証し、検証結果を返します。

8. ビジネス サーバーは検証結果に基づいてビジネス ロジックを処理し、検証結果とビジネス結果をクライアントの Web ページに返します。

No-captcha 検証

Web および H5 の統合

Web および H5 統合を使用する場合、検証シナリオを作成するときに Integration Method を [Web/H5] に設定します。

1. クライアント側の統合: 検証機能を使用するクライアントページ (Web および H5) に、Captcha 初期化コードを統合します。初期化コードの例については、「Web および H5 クライアント V3 アーキテクチャ統合」をご参照ください。

2. サーバー側の統合: クライアントページ (Web および H5) に対応するサーバーに SDK を統合します。次に、VerifyIntelligentCaptcha API を呼び出して Captcha 検証を開始します。詳細については、「サーバー側の統合」をご参照ください。

アプリの統合

アプリ統合を使用する場合、検証シナリオを作成するときに Integration Method を [Webview+H5 (アプリおよび WeChat Mini Program 用)] に設定します。

1. クライアント側の統合: 検証機能を使用するクライアントページ (Web および H5) に、Captcha 初期化コードを統合します。初期化コードの例については、「Web および H5 クライアント V3 アーキテクチャ統合」をご参照ください。

2. サーバー側の統合: クライアントページ (Web および H5) に対応するサーバーに SDK を統合します。次に、VerifyIntelligentCaptcha API を呼び出して Captcha 検証を開始します。詳細については、「サーバー側の統合」をご参照ください。

3. アプリ側の統合

   • Android アプリ: WebView コンポーネントを使用して、アプリ内で Captcha 2.0 を必要とするビジネスページを有効化してデプロイします。詳細については、「Android V3 アーキテクチャ統合」をご参照ください。

   • iOS アプリ: WKWebView コンポーネントを使用して、アプリ内で Captcha 2.0 を必要とするビジネスページを有効化してデプロイします。詳細については、「iOS V3 アーキテクチャ統合」をご参照ください。

WeChat Mini Program の統合

WeChat Mini Program 統合を使用する場合、検証シナリオを作成するときに Integration Method を [Webview+H5 (アプリおよび WeChat Mini Program 用)] または WeChat Mini Program Native Plugin に設定します。

WeChat Mini Program の統合: コンソールで検証シナリオを追加した後、検証機能を使用する WeChat Mini Program ページに Captcha 初期化コードを統合します。詳細については、「Mini Program 統合」をご参照ください。

• ビジネス クライアントの初期化をテストする

  構成が完了したら、Captcha が統合されているページのブラウザ コンソールを開きます。[Network] タブで情報を確認します。

  以下の項目がすべて存在する場合、クライアント側の統合は成功です:

  • 初期化リクエスト (図の ①)

  • 初期化リクエストの [Preview] には Captcha 情報が含まれており (図の ②)、success は true です。

  • Captcha リソース (図の ③)

• ビジネス クライアントの検証をテストする

  検証リクエストを送信した後、Captcha が統合されているページのブラウザ コンソールを開きます。[Network] タブで情報を確認します。

  VerifyResult が true (図の ①) の場合、検証は成功です。

• サーバー側の統合をテストする

  クライアント側の統合が成功すると、ビジネス API は captchaVerifyParam 検証パラメーターをビジネス サーバーに送信します。ビジネス サーバーは Alibaba Cloud の VerifyIntelligentCaptcha API を呼び出し、検証結果を返します。

  ビジネス サーバーの応答で検証結果を表示できます。VerifyResult が true の場合、サーバー側の統合は成功です。

  {
      "RequestId": "C******-B***-4***-A***-5*******1",
      "Message": "success",
      "HttpStatusCode": 200,
      "Code": "Success",
      "Success": true,
      "Result": {
          "VerifyCode": "T001",
          "VerifyResult": true
      }
  }

• Captcha が期待どおりに機能するかをテストする

  サーバー側の統合が成功すると、ビジネス結果と Alibaba Cloud Captcha の結果がクライアントに返されます。クライアントは返された結果に基づいて異なるビジネス運用を実行します。クライアントで Captcha を使用して、検証が期待どおりに機能するかをテストできます。

  • スライダー検証、ジグソー検証、クリック認証、および画像復元検証の場合、[検証に合格しました] メッセージが表示されると検証は成功です。

  • No-CAPTCHA 検証: ビジネスインタラクションが成功すると、検証が成功したことを示します。たとえば、ログインシナリオでは、ユーザー名とパスワードでログインした後に [ログインに成功しました] メッセージが表示されれば、検証は成功です。