Apache を使用したインジェクション

このページでは、JavaScript エージェントを自動的に挿入するために Apache を使用してブラウザアプリケーションをインストゥルメント化する方法について説明します。Apache を Web コンテナとして使用している場合、または Apache をリバースプロキシとして現在使用しているか使用する予定の場合、コンテナ置換モジュールを使用して、JavaScript エージェントをページに自動挿入できます。モジュールは、返された応答オブジェクトをインターセプトし、文字列置換を行います。

注: この方法では、2 つの Apache モジュール mod_substitutemod_filter を使用します。

エージェントのダウンロード

最初に、[Browser Monitoring] 構成ペインから JavaScript エージェントをダウンロードする必要があります。

  1. 対象のブラウザアプリケーションを開きます。
  2. 左ナビゲーションメニューから、Configuration の順に選択します。
  3. Configure and download JavaScript Agentをクリックします。
  4. JavaScript ホスティングオプションで、[I will host all the JavaScript agent files] を選択します。
  5. [Download] をクリックして、JavaScript エージェントをダウンロードします。
  6. Apache インスタンスにアクセス可能な場所にファイルを配置します。保存されたファイルの名前は、adrum.js である必要があります。

モジュールがロードされていることの確認

グローバル Apache httpd.conf ファイルをチェックし、次の 2 つの LoadModule コマンドがファイルに含まれていることを確認してください。

LoadModule substitute_module modules/mod_substitute.so
LoadModule filter_module modules/mod_filter.so

Adrum 構成ファイルの作成

Apache のバージョンに基づいて、次の例のようなコンテンツを含む、adrum.conf という名前のファイルを作成します(詳細については、「Stack Overflow」記事を参照してください)。この場合、置換ルールはサイト全体の場所(Location /)に適用されますが、/somedirectory を使用して特定のディレクトリとそのサブディレクトリを再帰的に選択することもできます。

Apache 2.2 の adrum.conf の例

次のサンプルコードを独自の JavaScript エージェントスクリプトに置き換えます。

<Location "/">
    SetOutputFilter INFLATE;SUBSTITUTE;DEFLATE 
    AddOutputFilterByType SUBSTITUTE text/html
    Substitute "s#<head>#<head><script>window['adrum-start-time'] = new Date().getTime();</script><script>(function(config){config.appKey='<EUM_APP_KEY>';})(window['adrum-config'] || (window['adrum-config'] = {}));</script><script src='./adrum.js'></script>#inq"
</Location>
注: <meta> タグを使用する場合は、<head> タグのすぐ後ろに配置し、JavaScript エージェントは最後の <meta> タグの直後、他の <script> タグの前に配置する必要があります。これにより、一部のバージョンの IE で問題が発生しなくなり、リソースタイミングの精度が向上します。

Apache 2.4 の adrum.conf の例

次のサンプルコードを独自の JavaScript エージェントスクリプトに置き換えます。

<Location "/">
    AddOutputFilterByType SUBSTITUTE text/html
    Substitute "s#<head>#<head><script>window['adrum-start-time'] = new Date().getTime();</script><script>(function(config){config.appKey='<EUM_APP_KEY>';})(window['adrum-config'] || (window['adrum-config'] = {}));</script><script src='./adrum.js'></script>#inq"
</Location>

ここで、./adrum.js はサーバーにアクセス可能な adrum ファイルのコピーへのパスです。# の後のフラグは次のとおりです。

  • i:マッチングは大文字と小文字を区別する
  • n:パターンは固定文字列として扱われます( を削除すると、パターンは正規表現として扱われます)。
  • q:モジュールは、各置換の後にバケットを平坦化することはありません。これによりパフォーマンスが向上します。

詳細については、ここの Apache モジュールのドキュメントを参照してください。

<head> タグに <head lang="en"> のような属性が含まれる場合は、置換文字列に正規表現を使用し、n フラグを省略できます。次のサンプルコードを独自の JavaScript エージェントスクリプトに置き換えます。

Substitute "s#(<head[^>]*>)#$1<script>window['adrum-start-time'] = new Date().getTime();</script><script>(function(config){config.appKey='<EUM_APP_KEY>';})(window['adrum-config'] || (window['adrum-config'] = {}));</script><script src='./adrum.js'></script>#iq"
注:

タイマーの初期化 <script>window['adrum-start-time'] = new Date().getTime();</script>. に注意してください。これらのスクリプトをドキュメントの一番上に近いところに挿入します。<head> タグの直後に配置すると最適なタイミングを取得できます。

<meta> タグを使用する場合は、<head> タグのすぐ後ろに配置し、JavaScript エージェントは最後の <meta> タグの直後、他の <script> タグの前に配置する必要があります。これにより、一部のバージョンの IE で問題が発生しなくなり、リソースタイミングの精度が再び向上します。

(オプション)gzip で圧縮したリソースの調整

ページが圧縮されている場合、コンテンツが INFLATE されて、置換が実行されてから、コンテンツが DEFLATE されない限り、置換は機能しません。これにはいくつかの方法があります。たとえば、FilterProvider 行に次のように入力します。

FilterProvider AdrumFilter INFLATE;SUBSTITUTE;DEFLATE resp=Content-Type $text/html

詳細については、「Stack Overflow」の記事を参照してください。Apache をプロキシとして使用している場合は、gzip でエンコードされたコンテンツを受け入れないように指示することもできます。

Adrum 構成ファイルの場所を httpd.conf に追加

グローバル Apache httpd.conf ファイルに次の行を追加します。

Include [absolutePathTo]/adrum.conf

または、別の adrum ファイルを作成するのではなく、直接 httpd.conf ファイルにディレクティブを追加することもできます。

Web サーバの再起動

新しい構成を有効にするには、次のように再起動します。

sudo apchectl -k restart
注: 警告「Useless use of AllowOverride in line 2 of [absolutePathTo]/adrum.conf」が表示されても無視できます。この警告は、AllowOverride が冗長であることを示しているだけです。必要に応じて削除できます。

スクリプト文字列に使用できるバリエーションについては、「JavaScript エージェントの設定」を参照してください。

その他の方法

リバースプロキシとして構成された Apache インスタンスを使用して自動インジェクションを設定する場合は、前述の Location ディレクティブベースのメソッドを使用する必要があります。また、Location ディレクティブには、ProxyPass または ProxyPassReverse も使用できます。プライマリ Web コンテナである Apache インスタンスを使用している場合は、実際の置換手順を記述する 2 つの追加オプションがあります。

Directory ディレクティブの使用

Location ディレクティブの代わりに Directory ディレクティブを使用できます。

.htaccess の使用

次のような行を、サイトのベース ドキュメント ディレクトリ内の .htaccess ファイルに追加し、<MyFilter> のフィルタ名を置き換えます。.htaccess ファイルがない場合は、作成します。

Apache 2.2

次のサンプルコードを独自の JavaScript エージェントスクリプトに置き換えます。

Substitute "s#<head>#<head><script>window['adrum-start-time'] = new Date().getTime();</script><script>(function(config){config.appKey='<EUM_APP_KEY>';})(window['adrum-config'] || (window['adrum-config'] = {}));</script><script src='./adrum.js'></script>#inq"
AllowOverride Options
FilterDeclare <MyFilter>
FilterProvider <MyFilter> SUBSTITUTE resp=Content-Type $text/html
FilterChain <MyFilter>
Substitute "s#<head>#<head><script>window['adrum-start-time'] = new Date().getTime();</script><script>(function(config){config.appKey='<EUM_APP_KEY>';})(window['adrum-config'] || (window['adrum-config'] = {}));</script><script src='./adrum.js'></script>#inq"

Apache 2.4

次のサンプルコードを独自の JavaScript エージェントスクリプトに置き換えます。

Substitute "s#<head>#<head><script>window['adrum-start-time'] = new Date().getTime();</script><script>(function(config){config.appKey='<EUM_APP_KEY>';})(window['adrum-config'] || (window['adrum-config'] = {}));</script><script src='./adrum.js'></script>#inq"
AddOutputFilterByType SUBSTITUTE text/html
Substitute "s#<head>#<head><script>window['adrum-start-time'] = new Date().getTime();</script><script>(function(config){config.appKey='<EUM_APP_KEY>';})(window['adrum-config'] || (window['adrum-config'] = {}));</script><script src='./adrum.js'></script>#inq"

ここで、./adrum.js はサーバーにアクセス可能な adrum ファイルのコピーへのパスです。.htaccess がすべてのユーザーに読み取り可能であることを確認します。