EUM アプリケーションキーを取得し、Cordova ベースのアプリケーションをインストゥルメント化するには、次の手順を実行します。

ネイティブ モバイル アプリケーションの場合、iOS インストゥルメンテーションまたは Android インストゥルメンテーションの手順に従います。モバイルエージェントで JavaScript エージェントを挿入し、WKWebView の自動インストゥルメンテーションを含むモバイルアプリケーションを自動でインストゥルメント化します。

要件の確認

AppDynamics Cordova プラグインを使用するには、ハイブリッド アプリケーションで次のものを使用する必要があります。

  • Cordova 8.0.0 以降
  • npm 3.10.10 以上
  • Node.js 6.11.3 以降
  • iOS アプリケーションの WKWebView

WkWebView の要件

デフォルトでは、Cordova iOS プラットフォームコマンドを使用して、UIWebView をサポートする cordova-ios のバージョンを追加します。AppDynamics では UIWebView をサポートしていないため、手動で WkWebView に変更する必要があります。

  1. 次のコマンドを実行します。

    (ionic) cordova platform add ios
    CODE
  2. ログ出力が以下を返すことを確認します。

    Using WkWebView
    CODE
  3. ログ出力が Using UIWebView を返す場合は、手動で Using UIWebView に変更する必要があります。

アプリケーションキーの取得

Getting Started Wizard を完了すると、EUM アプリケーションキーが付与されます。このキーは、ソースコードを変更するときに必要になります。場合によっては、複数のモバイルアプリケーションで同じキーを共有できます。

Getting Started Wizard を完了したのに EUM アプリケーションキーが付与されない場合は、「アプリケーションキーの取得」を参照してください。

Cordova プラグインのインストールと初期化

AppDynamics Cordova プラグインは、Ionic および PhoneGap フレームワークと連携して動作するように認定されています。そのため、以下のインストール手順は Ionic および PhoneGap アプリケーション用です。Cordova ベースのフレームワークについては、プラグインのインストール手順を参照してください。

Ionic アプリケーションのルートディレクトリから、次のコマンドを実行してプラグインをインストールし、モバイルアプリケーションを構築します。詳細については、Ionic Cordova プラグインのマニュアルを参照してください。

  1. カッコ内の値をアプリケーションの設定に置き換え、コマンドを実行して、設定されたプラグインを追加します。
    SaaS 展開の場合:

    ionic cordova plugin add appd-plugin-eum-mobile --variable APP_KEY="<#EUM_APP_KEY#>" --variable SCREENSHOTS_ENABLED=<true|false> --variable LOGGING_LEVEL=[0-6]  --save
    JS

    オンプレミス展開の場合は、変数 COLLECTOR_URL の値を EUM サーバの URL に置き換えて、SCREENSHOT_URL の値をオンプレミスのスクリーンショット サービスへの URL に置き換えます。

    ionic cordova plugin add appd-plugin-eum-mobile --variable APP_KEY="<#EUM_APP_KEY#>" --variable SCREENSHOTS_ENABLED=<true|false> --variable LOGGING_LEVEL=[0-6] --variable COLLECTOR_URL="http(s)://<on-prem_eum-server_url>:<PORT>" --variable SCREENSHOT_URL="http(s)://<on-prem_screenshot_service-url>" --save
    JS
  2. (オプション)また、インタラクション キャプチャ モードiOS/Androidを無効または設定し、Cordova iOS アプリケーションのネットワーク接続をテストする URL を設定することもできます。 

    1. インタラクション キャプチャ モードはデフォルトでオンになっていますが、このモードを無効にするには、変数 INTERACTION_CAPTURE_MODE0 に設定するか、プラットフォームに必要なキャプチャモードを指定します(次の表の iOS および Android のインタラクションモード値を参照)。INTERACTION_CAPTURE_MODE を設定すると、WebView インタラクションのキャプチャのみを制御します。INTERACTION_CAPTURE_MODE0 に設定すると、WebView とのインタラクションはキャプチャされなくなります。ただし、iOS の UI ボタンなどのネイティブ UI 要素とのインタラクションは、各プラットフォームの基盤となるネイティブエージェントによって常にキャプチャされているため、引き続きキャプチャされます。

      ionic cordova plugin add appd-plugin-eum-mobile --variable APP_KEY="<#EUM_APP_KEY#>" --variable INTERACTION_CAPTURE_MODE=<see modes in table below> --variable SCREENSHOTS_ENABLED=<true|false> --variable LOGGING_LEVEL=[0-6] --variable COLLECTOR_URL="http(s)://<on-prem_eum-server_url>:<PORT>" --variable SCREENSHOT_URL="http(s)://<on-prem_screenshot_service-url>" --save
      CPP
      Capture Mode説明
      キャプチャなし0ユーザのインタラクションはキャプチャされません。
      ボタンの押下1ボタンの押下がキャプチャされます。
      テーブルセルの選択2テーブルセルの選択がキャプチャされます。
      テキストフィールドの選択4テキストフィールドの選択がキャプチャされます。
      テキストビューの選択8テキストビューの選択がキャプチャされます。
      すべて-1すべてのユーザインタラクションがキャプチャされます。
      Capture Mode説明
      キャプチャなし0ユーザのインタラクションはキャプチャされません。
      ボタンの押下1ボタンの押下がキャプチャされます。
      編集テキストの選択2編集テキストの選択がキャプチャされます。
      リスト項目の選択4リスト項目の選択がキャプチャされます。
      すべて-1すべてのユーザインタラクションがキャプチャされます。
    2. デフォルトでは、Cordova プラグインは http://google.com/ を使用し、Cordova iOS アプリケーションの接続をテストします。ただし、変数 REACHABILITY_HOST を URL に設定することで、別の URL を使用して接続をテストできます。次の例では、Cordova プラグインは、Cordova iOS アプリケーションの接続をテストするために http://example.com を使用するように設定されています。

      ionic cordova plugin add appd-plugin-eum-mobile --variable APP_KEY="<#EUM_APP_KEY#>" --variable REACHABILITY_HOST="http://example.com" --variable SCREENSHOTS_ENABLED=<true|false> --variable LOGGING_LEVEL=[0-6] --save
      JS
  3. モバイルアプリケーションを構築します。

    ionic cordova build [android, ios]
    JS

PhoneGap アプリケーションのルートディレクトリから、次のコマンドを実行してプラグインをインストールします。詳細については、 PhoneGap プラグインのマニュアルを参照してください。

  1. カッコ内の値をアプリケーションの設定に置き換え、コマンドを実行して、設定されたプラグインを追加します。
    SaaS 展開の場合:

    phonegap cordova plugin add appd-plugin-eum-mobile --variable APP_KEY="<#EUM_APP_KEY#>" --variable SCREENSHOTS_ENABLED=<true|false> --variable LOGGING_LEVEL=[0-6] --save
    JS

    オンプレミス展開の場合は、変数 COLLECTOR_URL の値を EUM サーバの URL に置き換えて、SCREENSHOT_URL の値をオンプレミスのスクリーンショット サービスへの URL に置き換えます。

    phonegap cordova plugin add appd-plugin-eum-mobile --variable APP_KEY="<#EUM_APP_KEY#>" --variable SCREENSHOTS_ENABLED=<true|false> --variable LOGGING_LEVEL=[0-6] --variable COLLECTOR_URL="http(s)://<on-prem_eum-server_url>:<PORT>" --variable SCREENSHOT_URL="http(s)://<on-prem_screenshot_service-url>" --save
    JS
  2. (オプション)変数を設定し、ユーザ インタラクション キャプチャ モードiOS/Androidを有効にして、Cordova iOS アプリケーションのネットワーク接続をトラブルシューティングすることもできます。

    1. インタラクション キャプチャ モードはデフォルトでオンになっていますが、このモードを無効にするには、変数 INTERACTION_CAPTURE_MODE0 に設定するか、プラットフォームに必要なキャプチャモードを指定します(次の表の iOS および Android のインタラクションモード値を参照)。INTERACTION_CAPTURE_MODE を設定すると、WebView インタラクションのキャプチャのみを制御します。INTERACTION_CAPTURE_MODE0 に設定すると、WebView とのインタラクションはキャプチャされなくなります。ただし、iOS の UI ボタンなどのネイティブ UI 要素とのインタラクションは、各プラットフォームの基盤となるネイティブエージェントによって常にキャプチャされているため、引き続きキャプチャされます。

      phonegap cordova plugin add appd-plugin-eum-mobile --variable APP_KEY="<#EUM_APP_KEY#>" --variable INTERACTION_CAPTURE_MODE=<see modes in table below> --variable SCREENSHOTS_ENABLED=<true|false> --variable LOGGING_LEVEL=[0-6] --save
      JS
      Capture Mode説明
      キャプチャなし0ユーザのインタラクションはキャプチャされません。
      ボタンの押下1ボタンの押下がキャプチャされます。
      テーブルセルの選択2テーブルセルの選択がキャプチャされます。
      テキストフィールドの選択4テキストフィールドの選択がキャプチャされます。
      テキストビューの選択8テキストビューの選択がキャプチャされます。
      すべて-1すべてのユーザインタラクションがキャプチャされます。
      Capture Mode説明
      キャプチャなし0ユーザのインタラクションはキャプチャされません。
      ボタンの押下1ボタンの押下がキャプチャされます。
      編集テキストの選択2編集テキストの選択がキャプチャされます。
      リスト項目の選択4リスト項目の選択がキャプチャされます。
      すべて-1すべてのユーザインタラクションがキャプチャされます。
    2. デフォルトでは、Cordova プラグインは http://google.com を使用し、Cordova iOS アプリケーションの接続をテストします。ただし、変数 REACHABILITY_HOST を URL に設定することで、別の URL を使用して接続をテストできます。次の例では、Cordova プラグインは、Cordova iOS アプリケーションの接続をテストするために http://example.com を使用するように設定されています。

      phonegap cordova plugin add appd-plugin-eum-mobile --variable APP_KEY="<#EUM_APP_KEY#>" --variable REACHABILITY_HOST=http://example.com --variable SCREENSHOTS_ENABLED=<true|false> --variable LOGGING_LEVEL=[0-6] --save
      JS
  3. モバイルアプリケーションを構築します。

    phonegap cordova build [android, ios]
    JS

Cordova アプリケーション インストゥルメンテーションのカスタマイズ

Cordova アプリケーションのカスタマイズ」を参照してください。例と簡単な説明を通して Cordova SDK を使用する方法を示します。

Cordova エージェントの設定の更新

Cordova プラグインをアプリケーションに初めて追加したときに行った設定を更新する場合は、設定値の値を削除してから、新しい設定値を追加することを推奨します。

次の例を参照してください。

アプリケーションキーの変更

Ionic または PhoneGap アプリケーションのアプリケーションキーを変更するには、次の手順を実行します。

  1. remove コマンドを使用して変数 APP_KEY の古い値を削除します。

    cordova plugin remove --variable APP_KEY="old-app-key" appd-plugin-eum-mobile
    BASH
  2. add コマンドを使用して変数 APP_KEY の新しい値を追加します。最初にプラグインを追加したときに設定した変数が含まれていることを確認してください(以下の <variable_list> で表されます)。たとえば、最初にプラグインを追加したときに REACHABILITY_HOST=http://example.com を設定した場合は、add コマンドを再度実行するときに変数をリセットする必要があります。

    cordova plugin add --variable APP_KEY="new-app-key" <variable_list> appd-plugin-eum-mobile
    BASH

アプリケーション名の変更

Ionic または PhoneGap アプリケーションの名前を変更するには、次の手順を実行します。

  1. remove コマンドを使用して変数 APP_NAME の古い値を削除します。

    cordova plugin remove --variable APP_NAME="old-app-name" appd-plugin-eum-mobile
    BASH
  2. add コマンドを使用して変数 APP_NAME の新しい値を追加します。最初にプラグインを追加したときに設定した変数が含まれていることを確認してください(以下の <variable_list> で表されます)。たとえば、最初にプラグインを追加したときに REACHABILITY_HOST=http://example.com/ を設定した場合は、add コマンドを再度実行するときに変数をリセットする必要があります。

    cordova plugin add --variable APP_NAME="new-app-name" <variable_list> appd-plugin-eum-mobile
    BASH