すべてのプロダクト
Search
ドキュメントセンター

Web Application Firewall:Web SDKをwebアプリケーションに統合する

最終更新日:Jun 28, 2024

webアプリケーションのアンチクローラールールを設定する前に、Web SDKをwebアプリケーションに統合する必要があります。 このトピックでは、Web SDKをwebアプリケーションに統合する方法について説明します。 このトピックでは、Web SDKをSDKと呼びます。

コンポーネント

SDKには、webコレクターと非同期APIレスポンスコンポーネントが含まれています。

Webコレクター

webコレクターは、クライアントブラウザーの特性を全体的なアンチボット攻撃および防御システムに統合して、ネットワーク特性を使用して識別できない攻撃を識別します。 これは、保護能力を向上させるのに役立つ。

収集した特性を難読化して暗号化した後、webコレクターはCookieをルートドメイン名に統合し、Cookieにリクエストを送信します。 これにより、ブラウザーのパフォーマンスへの影響が軽減されます。

webコレクターは次の情報を収集します。

  • ブラウザの種類とバージョン、画面解像度、タイムゾーン、タイムスタンプなどのブラウザ情報

  • 一般的なブラウザレベルのボットスクリプトとドライバのプローブを含む、特定の攻撃と防御のプローブ

  • キーボード、マウス、タッチイベントなどのユーザー操作

    説明

    プライバシーを保護するために、キーボードイベントには、どのキーが押されたかではなく、キーが押された時点のみが含まれます。

非同期APIレスポンスコンポーネント

非同期API応答コンポーネントは、ウェブアプリケーションが、アンチボット攻撃および防御システムによってAPIに送信されるチャレンジ応答に応答することを可能にする。 課題には、JavaScript検証とCAPTCHA検証が含まれます。 非同期APIレスポンスコンポーネントを使用した後、Web Application Firewall (WAF) がAPIにチャレンジレスポンスを送信したことを検出すると、コンポーネントは応答します。

非同期APIレスポンスコンポーネントは、セキュリティ機能を提供したり、データ収集やレポートを実行したりしません。

次のセクションでは、非同期APIレスポンスコンポーネントの動作について説明します。

  1. このコンポーネントは、xmlHttpRequest (XHR) 、Fetch、Formなど、リクエストされたページに含まれる共通のAPIリクエストオブジェクトをグローバルに書き換え、オブジェクトのコードの追加レイヤーをカプセル化します。 これは元のオブジェクトの機能には影響しません。

  2. 要求されたページのJavaScriptコードの代わりに、コンポーネントは応答がWAFによって返されるかどうかをチェックします。 WAFは、チャレンジレスポンスを送信して、JavaScript検証またはCAPTCHA検証を実行するようにクライアントに指示できます。

  3. オリジンサーバーから応答が返された場合、コンポーネントは応答に対して操作を実行せず、要求されたページのJavaScriptコードに応答を渡します。 応答がWAFによって返された場合、コンポーネントは応答を解析し、JavaScriptを使用して必要な計算を実行し、JavaScript検証署名を含む要求をWAFに送信します。 WAFはJavaScript検証署名を検証し、リクエストをオリジンサーバーに送信します。

互換性

  • 環境の互換性: SDKは、Internet Explorer 8以降のバージョンでレンダリングエンジンを使用するブラウザーと互換性があります。

  • 互換性依存関係: クライアントブラウザーはCookieをサポートする必要があります。 クライアントブラウザーがCookieをサポートしていない場合、webコレクターは期待どおりに機能しません。

  • フック互換性: 特定のサービスの場合、XHR、Form、Fetchなどの同期APIリクエストで使用されるフックネイティブオブジェクトは、非同期APIレスポンスコンポーネントと競合します。

デプロイ方法

自動統合

自動統合は、HTMLページに送信されたリクエストがWAFを通過する場合にのみ使用できます。 自動統合により、HTMLページでのコード変更が不要になります。 HTMLページは、フルリフレッシュを必要とせずに実行時に更新することができる。

シナリオ固有の保護テンプレートを作成するときに [シナリオの構成] ステップで [自動統合] を選択した場合、ボット管理モジュールはHTMLデータを解析し、webコレクターと非同期API応答コンポーネントをドキュメントオブジェクトモデル (DOM) に挿入し、モジュールがHTMLページからの応答を処理するときに変更された応答をクライアントに返します。 詳細については、「Webサイトのアンチクローラールールの設定」をご参照ください。

説明

SDKを圧縮されたHTMLページに統合する場合、自動統合はcontent-encoding:gzip圧縮方式のみをサポートします。 Brotli圧縮とdeflate圧縮はサポートされていません。

マニュアル統合

手動統合は、自動統合がサポートされていないシナリオに適しています。 たとえば、HTMLページに送信されたリクエストがWAFを通過しない場合、または指定された圧縮方法がサポートされていない場合、自動統合は使用できません。 手動統合を実行するには、次の条件が満たされていることを確認します。

  • SDKは、非同期呼び出しが開始されるHTMLページに統合されています。

  • SDKが取得されます。 必要なスクリプトを取得するには、次の手順を実行します。 ボット管理ページ。 [シナリオ固有の保護] タブで、[テンプレートの作成] をクリックします。 [シナリオの設定] ステップで、[Web SDKの統合] パラメーターを [手動統合] に設定します。 次に、[SDKの取得] をクリックします。

    • 動的トークンベースの認証を有効にする場合は、次のスクリプト <script> を他のスクリプト <script> の前に配置して、次のスクリプトが最初に読み込まれるようにします。

      <script src="// g.alicdn.com/frontend-lib/frontend-lib/2.3.59/jquery_240527.min.js"></script>
      <script src="// g.alicdn.com/frontend-lib/frontend-lib/2.3.59/interfaceacting240527.js"></script>
      <script src="// g.alicdn.com/frontend-lib/frontend-lib/2.3.59/antidom_240527.js"></script> 
    • 動的トークンベースの認証を有効にしない場合は、次のスクリプト <script> を他のスクリプト <script> の前に配置して、次のスクリプトが最初に読み込まれるようにします。

      <script src="// g.alicdn.com/frontend-lib/frontend-lib/2.3.59/interfaceacting240527.js"></script>
      <script src="// g.alicdn.com/frontend-lib/frontend-lib/2.3.59/antidom_240527.js"></script> 

オンプレミス配置

この配置方法は、コンテンツセキュリティポリシー (CSP) でalicdnからのリソースの読み込みが許可されていない場合や、すべてのコンポーネントをオンプレミス環境に配置する必要がある場合など、特定の場合にのみ適しています。 この方法は使用しないことを推奨します。

オンプレミス環境でSDKをデプロイするには、オンプレミス環境でJavaScriptリソースのコピーを2つ作成し、Alibaba Cloud CDN内のすべてのJavaScriptコードをオンプレミス環境にコピーしてから、JavaScriptリソースとコードの前のコピーを他のリソースの前に配置する必要があります。 これにより、JavaScriptリソースとコードが最初に読み込まれます。