Download PDF
Download page インジェクションの問題.
インジェクションの問題
モニタするすべてのページにブラウザ RUM の JavaScript エージェントを挿入する必要があります。
インジェクションの確認
Web ページのソースを表示します。自動または補助インジェクションが使用されている場合は、Web ページに JavaScript エージェントのスクリプトがインラインで表示されます。手動インジェクションを使用すると、次のように表示されます。
<script src="/path_to_adrum.js"/>
手動インジェクションを使用した場合は、Web ページで他のタイプのコード変更を確認するために使用する通常の手順を使用します。サーバページ、CDN、またはブラウザのキャッシュなど、さまざまなキャッシュによってページが実際にはリロードされないようにできることに注意してください。手動インジェクションを使用できないときは、ご使用のプラットフォームで可能な場合は他のインジェクション方式のいずれかを試します。さまざまなインジェクション方式については、「Inject the JavaScript Agent」を参照してください。
自動インジェクションが有効になっていることの確認
自動インジェクションが有効になっていることを確認するには、次を実行します。
- JavaScript エージェントを挿入するビジネスアプリケーションを開きます。
- [Configuration > User Experience App Integration > JavaScript Agent Injection] をクリックします。
- [Inject the JavaScript Agent configured for this Browser App] から、自動インジェクションを受け取るブラウザアプリケーションが選択されていることを確認します。
- [Automatic Injection] タブを選択します。
- [Enable Automatic Injection of JavaScript] チェックボックスがオンになっていることを確認します。
- モニタ対象のビジネストランザクションすべてで自動インジェクションが有効になっていることを確認します。これらのビジネストランザクションの一部が [Automatic injection possible, but not enabled list] に含まれている場合は、それらを [Automatic injection enabled] リストに移動します。モニタ対象のビジネストランザクションがいずれのリストにも表示されない場合、そのビジネストランザクションに対して自動インジェクションは実行できません。
- 変更を行った場合は、[Save] をクリックします。
インジェクションルールの作成と有効化の詳細については、「Automatic Injection of the JavaScript Agent」を参照してください。
補助インジェクションが有効になっていることの確認
補助属性インジェクションが有効になっていることを確認するには、次を実行します。
- JavaScript エージェントを挿入するビジネスアプリケーションを開きます。
- [Configuration > User Experience App Integration > JavaScript Agent Injection] をクリックします。
- [Inject the JavaScript Agent configured for this Browser App] から、自動インジェクションを受け取るブラウザアプリケーションが選択されていることを確認します。
- [Configure JavaScript Injection] タブを選択します。
- [Request Attribute Injection] チェックボックスがオンになっていることを確認します。
- 変更を行った場合は、[Save] をクリックします。
インジェクションルールを使用した補助インジェクションが有効になっていることを確認するには、次を実行します。
- JavaScript エージェントを挿入するビジネスアプリケーションを開きます。
- [Configuration > User Experience App Integration > JavaScript Agent Injection] をクリックします。
- [Inject the JavaScript Agent configured for this Browser App] から、自動インジェクションを受け取るブラウザアプリケーションが選択されていることを確認します。
- [Configure JavaScript Injection] タブを選択します。
- [Create Injection Rules] の表でインジェクションルールが有効になっていることを確認します。
- [Where to Inject JavaScript] タブで、ルールが正しいことを確認します。
- [Inject for these Business Transactions] タブで、目的のビジネストランザクションにルールが適用されていることを確認します。
- 変更を行った場合は、[Save] をクリックします。
インジェクションルールの作成と有効化の詳細については、「補助インジェクション」を参照してください。
インジェクション方式の変更
JavaScript エージェントを挿入するために、ある方法を試しても機能しない場合は、別の方法を実装する前に現在のインジェクション構成を元に戻すことをお勧めします。
- 自動インジェクションを元に戻すには、[Enable Automatic Injection of JavaScript] チェックボックスをオフにします。
- 属性インジェクションを使用する補助インジェクションを元に戻すには、[Request Attribute Injection] チェックボックスをオフにして、コードスニペットを手動で削除します。
- 手動インジェクションを元に戻すには、Web ページから JavaScript エージェントコードを手動で削除します。
- インジェクションルールを使用する補助インジェクションを元に戻すには、インジェクション ルール リストの各インジェクションルールの [Enable] チェックボックスをオフにします。
エージェントの複数のコピーがページに存在する場合、2 番目のコピーは実行されません。
ページレンダリングの問題の修正
一部のブラウザ(特に Internet Explorer(IE))のページレンダリングは、JavaScript エージェントのインジェクションによって悪影響を受ける可能性があります。
JavaScript エージェントのインジェクションによって問題が発生していることを確認したら、次の操作を試します。
自動インジェクションを使用している場合は、「自動インジェクションのトラブルシューティング」を参照してください。
JavaScript エージェントは、これより前にロードされるリソースのリソース タイミング メトリックをキャプチャしないため、終了タグ <head>
の直前に JavaScript エージェントを挿入することは推奨されません。したがって、これは最後の試みとしてのみ実行してください。
Inject After Last Meta Element
レンダリングの問題を回避し、リソース タイミング メトリックをキャプチャするには、次に示すように 、<head>
の最後の <meta>
エレメント直後に JavaScript インジェクションを挿入することをお勧めします。
<head>
<meta charset="UTF-8">
<meta name="description" content="Fancy Web Page">
<meta name="keywords" content="HTML,CSS,XML,JavaScript">
<meta name="author" content="John Doe">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
// Injection of the JavaScript Agent after the last <meta> tag
<script charset='UTF-8'>
window['adrum-start-time'] = new Date().getTime();
(function(config){
config.appKey = 'SH-AAB-AAC-XAR';
config.adrumExtUrlHttp = 'http://cdn.appdynamics.com';
config.adrumExtUrlHttps = 'https://cdn.appdynamics.com';
config.beaconUrlHttp = 'http://eum-col.appdynamics.com';
config.beaconUrlHttps = 'https://eum-col.appdynamics.com';
config.xd = {enable : false};
})(window['adrum-config'] || (window['adrum-config'] = {}));
</script>
<script src='//cdn.appdynamics.com/adrum/adrum-latest.js' type='text/javascript' charset='UTF-8'/>
// The rest of the JS and CSS files
<script src="https://code.jquery.com/jquery-<version>.js" integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE=" crossorigin="anonymous"></script>
<script src="js/custom-script.js"></script>
<link type="text/css" rel="stylesheet" href="css/custom-style.css" />
...
</head>
Inject Before the Closing Head Element
まれに、一部のブラウザ(特に Internet Explorer(IE))では、JavaScript エージェントが挿入されているため、ページが誤って表示されることがあります。このような場合、最後の手段として、クローズ <head>
エレメントの直前に JavaScript エージェントを挿入してみてください。
<head>
<meta charset="UTF-8">
<meta name="description" content="Fancy Web Page">
<meta name="keywords" content="HTML,CSS,XML,JavaScript">
<meta name="author" content="John Doe">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://code.jquery.com/jquery-<version>.js" integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE=" crossorigin="anonymous"></script>
<script src="js/custom-script.js"></script>
<link type="text/css" rel="stylesheet" href="css/custom-style.css" />
...
// Injection of the JavaScript Agent before the closing <head> tag
<script charset='UTF-8'>
window['adrum-start-time'] = new Date().getTime();
(function(config){
config.appKey = 'SH-AAB-AAC-XAR';
config.adrumExtUrlHttp = 'http://cdn.appdynamics.com';
config.adrumExtUrlHttps = 'https://cdn.appdynamics.com';
config.beaconUrlHttp = 'http://eum-col.appdynamics.com';
config.beaconUrlHttps = 'https://eum-col.appdynamics.com';
config.xd = {enable : false};
})(window['adrum-config'] || (window['adrum-config'] = {}));
</script>
<script src='//cdn.appdynamics.com/adrum/adrum-latest.js' type='text/javascript' charset='UTF-8'/>
</head>
Troubleshoot Automatic Injection Issues
.NET エージェントを使用して JavaScript エージェントをページに自動的に挿入し、ページが正しくレンダリングされない場合は、次を試します。
- 手動インジェクションを使用して、JavaScript エージェントが最後の <meta> エレメントの後に挿入されていることを確認します。
- 手動インジェクションを使用できない場合は、登録されたノードのプロパティ
eum-header-beforeendofheadtag
を Web ティアまたは特定のノードに追加します。このノードプロパティは、指定されたティアまたはノードの .NET エージェントが、クローズ<head>
タグの直前に JavaScript エージェントを挿入するように構成します。