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

Nginx を Web コンテナとして使用している場合、または Nginx をリバースプロキシとして使用する場合、コンテナ置換モジュールを使用して、JavaScript エージェントをページに自動挿入できます。モジュールは、返された応答オブジェクトをインターセプトし、文字列置換を行います。

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

最初に、[Configuration] 画面から JavaScript エージェントをダウンロードする必要があります。

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

ngx_http_sub_module を使用して Nginx を設定する

ngx_http_sub_module モジュールは、指定された 1 つの文字列を別の文字列に置き換えることで応答を変更するフィルタです。この機能を使用すると、サーバーは JavaScript エージェントのヘッダー部分を、処理されるページに自動挿入します。このプロセスの詳細については、Nginx のドキュメント、「Module ngx_http_sub_module」を参照してください。

たとえば、<head> タグを <head> タグと JavaScript エージェントスクリプトに置き換えるには、ロケーションコンテキストを変更します。

Nginx のサンプル構成

location / {
    sub_filter      <head>
        '<head><script>window["adrum-app-key"]="<EUM_APP_KEY>";window["adrum-start-time"]=new Date().getTime();</script><script type="text/javascript" src="//cdn.appdynamics.com/adrum/adrum-latest.js"></script>';
    sub_filter_once on;
}

前述のサンプルで、/adrum-latest.js はサーバーにアクセス可能な adrum ファイルのコピーへのパスです。また、タイマーの初期化 <script>window['adrum-start-time'] = new Date().getTime();</script> に注意してください。これらをドキュメントの一番上に近いところに配置します。<head> タグの直後に配置すると最適なタイミングを取得できます。

注: <meta> タグを使用する場合は、 <head> タグのすぐ後ろに配置し、JavaScript エージェントは最後 <meta> タグの直後に配置する必要があります。これにより、一部のバージョンの IE で問題が発生するのを回避できます。

プラットフォームによっては、一部の文字をエスケープする必要があります。たとえば、Mac OS の場合は次のようになります。

location / {
    sub_filter      <head>
        '<head><script>window[\'adrum-start-time\'] = new Date().getTime();</script><script src="/adrum.js"></script>';
    sub_filter_once on;
}

注: この Nginx モジュールは、多くの場合 Google Analytics スクリプトを追加するために使用されます。これを実行する場合は、既存の GA スクリプトを上書きしないように注意してください。

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

ngx_http_sub_module を使用せずに Ngnix を設定する

必要に応じて、ngx_http_sub_module モジュールを使用せずに Ngnix を設定できます。必要なスクリプトを conf.d/default.conf の場所に挿入します。

Nginx のサンプル構成

location / {
    sub_filter 		<head> 
		'<head><script>window["adrum-app-key"]="<EUM_APP_KEY>";window["adrum-start-time"]=new Date().getTime();</script><script type="text/javascript" src="//cdn.appdynamics.com/adrum/adrum-latest.js"></script>';
    sub_filter_once on;
}