本文へスキップ

ブラウザーエージェントの適用

WhaTapブラウザーモニタリングサービスを使用するには、会員登録後、プロジェクトを作成し、WebアプリケーションにWhaTapブラウザーエージェントを適用する必要があります。

次の動画ガイドを参照してください。

プロジェクト作成​

エージェントをインストールする前にプロジェクトを作成してください。

  1. WhaTapモニタリングサービスに移動し、ログインします。

  2. プロジェクトを作成するには、画面左サイドメニューからプロジェクト全体 > + Projectボタンを選択してください。

  3. 商品選択 画面でプロジェクトにインストールする製品を選択してください。

  4. プロジェクト名, データサーバーリージョン, プロジェクトタイムゾーン項目を順番に設定してください。

    プロジェクトの生成

  5. 通知言語の設定で、警告通知メッセージの言語を選択してください。

  6. すべての設定を完了した後は プロジェクトを作成する ボタンを選択してください。

ノート

  • データサーバーリージョンは、リージョン(クラウドサービスを提供するためにインストールしたデータセンターのグループ)を意味します。特定のリージョンを選択すると、そのリージョンに所属するデータセンターにユーザーのデータが保存されます。

  • プロジェクトタイムゾーンは通知とレポートを生成する基準時間です。

  • 複数のプロジェクトをグループで管理する場合は、プロジェクトグループからグループを選択するか、グループを追加してください。 グループの詳細については、次の文書を参照してください。

  • 組織を選択してプロジェクトを追加する場合は、組織下位のグループを必須に設定する必要があります。

プロジェクトアクセスキーの確認​

プロジェクトアクセスキーは、WhaTapサービスを有効にするための固有IDです。

インストール手順セクションでプロジェクトアクセスキーの発行ボタンをクリックします。プロジェクトアクセスキーが自動的に発行されると、次の手順に進みます。

Tips

プロジェクトを作成すると、自動的にエージェントインストールページに移動します。エージェントインストールページが表示されない場合は、左側のメニューから全プロジェクトを選択し、新しく作成したプロジェクトを選択します。

WhaTapブラウザーエージェントのインストール​

エージェントのインストール画面の指示に従って、Webアプリケーションに適用するWhaTapブラウザーエージェントコードを適用してください。

WhaTapブラウザーエージェントのインストール

データ収集サンプリング​

WhaTapブラウザーエージェントは、ユーザーセッションを基準にデータを収集します。 収集する全体セッションの割合を0から100の範囲で設定できます。

WhaTapブラウザーエージェントスクリプト​

WhaTapブラウザーエージェントは、インラインスクリプトの形式で提供します。 インストールガイドで提供するスクリプトコードを、モニタリング対象のすべてのHTML ページの<head>タグの先頭に追加してください。

次の2つの方法のいずれかを選択して、エージェントを適用してください。

  • Async(非同期ロード): WebアプリケーションにWhaTapブラウザーエージェントを非同期形式でロードします。
    • ウェブアプリケーションのロード性能に影響しません。
    • ブラウザーエージェントがロードされる前に発生したAJAX、エラーなどのデータが欠落する可能性があります。
  • Sync(同期ロード): WebアプリケーションにWhaTapブラウザーエージェントを同期形式でロードします。
    • ウェブアプリケーションのロード時にすべてのデータを収集することをお勧めします。
    • ウェブアプリケーションのロードに影響を与える可能性があります。

WhaTapブラウザーエージェントのオプション設定​

WhaTapブラウザーエージェントに適用するオプションを設定します。 オプションは、インストールスクリプトのConfigオブジェクトで設定できます。 プロジェクトアクセスキー、ユーザーセッション全体の割合、収集から除外リソースドメインなどを設定できます。

config example
config: {
  projectAccessKey: {プロジェクトアクセスキー},
  pcode: {pcode},
  sampleRate: 100,
  ignoreOrigins: [ 'https://ignore-site.com/' , '/^(https?://)([^/]*)(ignore-site.io)(/)(.*)/i' ],
  collectUserClick: false
}
  • projectAccessKey：プロジェクトアクセスキーです。
  • pcode：プロジェクトコードです。
  • sampleRate：収集するユーザーセッションの割合を設定できます。
  • ignoreOrigins：統計収集から除外する特定のリソースドメインを文字列の配列の形で追加できます。 正規表現を適用することもできます。
  • collectUserClick：クリックイベントを収集できます。 既定値はfalseです。
ノート

projectAccessKey、pcode値は、インストールガイドで記載されているスクリプトコードをコピーして使用することをお勧めします。

次の段階​

  • ユーザー定義イベントを収集する

    ブラウザーモニタリングを通じてウェブサービスの問題点を把握し、ユーザーエクスペリエンスを改善するために、ウェブページで発生するイベントのうち、開発者と運営者が希望するイベントを追加で収集できるインターフェースを提供します。 ユーザー定義イベントを収集する方法の詳細については、次の文書を参照してください。

  • 実際のユーザーIDを設定する

    ブラウザーのモニタリングにおいて、実際のユーザーのログインIDやEメールなどでユーザーIDを設定し、データを収集することができます。 実際のログインIDに基づいてユーザーセッションの性能とイベント情報を確認し、ブラウザーのエラー情報を確認して問題を把握することができます。 詳細については、次の文書を参考にしてください。

  • モニタリングの開始

    WhaTapモニタリングサービスページに移動し、ブラウザーモニタリングを開始してください。 先に作成したプロジェクトを選択しダッシューボード > ブラウザモニタリングメニューに移動してください。 モニタリング状況を確認することができます。 ブラウザモニタリングメニューの詳細については、次の文書を参考にしてください。