JavaScriptエラーページ:エラーの検知と分析

New Relic BrowserのJS Error UIページでは、JavaScriptエラーがどこで発生しているのかを示し、根本原因の特定に役立つツールを提供します。また、InsightsのJSエラーデータに関して問い合わせてダッシュボードを作成するか、Browser APIを利用して処理済みエラーを監視できます。

この機能を利用できるかは、 サブスクリプションレベルによります。

JavaScriptエラーを表示する

JavaScriptエラーを検証するには:

  1. rpm.newrelic.com/browser > (アプリケーションを選択) > Browser application > JS errorsに進みます。
  2. UIで利用可能なオプションを利用して、何がエラーの原因となっているかを検証します。
  3. オプション:UIでイベントログもしくはスタックトレースを見直します
  4. オプション:InsightsのJSエラーに関して問い合わせてダッシュボードを作成するか、APIを使用してエラーを監視もしくはログします。

UIで利用可能なオプションには、以下が含まれます:

以下を行う場合... 実行する操作
長いエラーリストを検索する

Search [search icon]ボックスを使用することで、キーワード、URL等でエラーをすぐに見つけて修正できます。

attributesをグループ化/フィルタリングする
  • エラーデータがグループ化される方法を変更するには、Group by関数を使用します。(Page loadsチャートは、グループ化で変更できません。)
  • 特定の属性を伴うエラーのみを表示してデータをフィルタリングするには、Filterドロップダウンを使用します。
注目すべき偏差とパターンを表示する

エラープロファイルテーブルは、通常よりも頻繁にエラーが発生するブラウザバージョンやデバイスなど、注目すべき統計的変動を示しています。

エラー詳細を検証する
  • メインページからエラーを選択して、エラーが発生した上位5つのブラウザ/デバイス、そして関連のURLなど、そのエラーに関する詳細を表示します。
  • Error instancesを選択して、イベントログスタックトレースが利用可能な場合はこれを表示します。
エラーにつながったイベントを検証する

イベントログには、エラーにつながったブラウザインタラクション、AJAXコール、そしてトレースが表示されます。

Minified版JavaScriptをデコードする

JavaScriptがMinified版の場合、JS errorsページのエラーはあまり役に立たない可能性があります。Minified版JavaScriptをデコードして、こうしたエラースタックトレースを活用するには、New RelicにJavaScriptソースマップをアップロードします。

New Relic Browser JS erros UIページ
rpm.newrelic.com/browser >(アプリケーションを選択) > Browser application > JS errors: このページを利用することで、エラーのグループ化とフィルタリング、スタックトレース詳細の調査、そして動向の検証が可能となります。(UIページの表示内容が異なる場合は、過去の非推奨UIを使用している可能性があります。)

JSデータの問い合わせと視覚化

New Relicは、JSエラーをイベントデータとして保存します。これによって、New Relic Insightsでエラーデータに関して問い合わせることが可能になります。NRQLクエリを実行して、表示もしくは共有するダッシュボードを作成するには、InsightsでJavaScriptErrorイベントタイプを問い合わせます。

APIを使用して処理済みエラーを監視する

New Relic Browser APIのnoticeErrorコールを使用すると、ご利用のアプリケーションが処理したエラーやその他のエラーを関知し、ログすることができます。

イベントログを見直す

ProサブスクリプションでSPA監視を有効にする必要があります。

イベントログには、JSエラーにつながったブラウザインタラクション、AJAXコール、そしてトレースが表示されます。これによって、エラーの根本原因をトラブルシューティングできます。

New Relic Browser JSエラーのイベントログ
rpm.newrelic.com/browser > (アプリケーションを選択) > Browser application > JS errors > エラーを選択 > Error instances: SPA監視を有効にすると、エラーにつながったアクティビティがイベントログで表示されます。

Event log(利用可能な場合)を表示するには:rpm.newrelic.com/browser > (アプリケーションを選択) > Browser application > JS errors > (エラーを選択) > Error instancesに進みます。イベントログにイベントが無い場合は、イベントログが表示されません。

たとえば、エラーメッセージを示すAJAXリクエスト後にJSエラーが発生している場合、AJAXリクエストに正しい情報が含まれていない可能性があります。この場合、AJAXコールの失敗が原因となってJSエラーにつながります。

イベントログの欠如をトラブルシューティングする

イベントログ内のイベントが存在しない理由として、以下が挙げられます:

  • エージェントのバージョン。 イベントログデータをキャプチャするには、SPA監視を有効にする必要があります(Browserエージェントバージョン1071以降)。
  • ブラウザインタラクションの一部ではないJSエラー。 JSエラーがインタラクション外で発生した場合、これに関連したブラウザインタラクションの詳細はキャプチャーできません(例:非同期JSファイルでエラーが起きた場合)。
  • クリックによってJSエラーが引き起こされた。 一部のケースでは、クリックの直接的な結果としてエラーが起きた場合、関連のインタラクションはキャプチャーされません。

イベントログもしくはスタックトレースが無い場合は、エラー詳細チャートを利用して、エラーがブラウザタイプ、デバイスタイプ、そしてURLに及ぼす影響を分析できます。

スタックトレースを表示する

スタックトレースでは、エラーが重要な機能性を損ねているか、そのエラーの重要性が低いかを示すことができます。エラーのスタックトレース(利用可能な場合)を表示するには:rpm.newrelic.com/browser > (アプリケーションを選択) > Browser application > JS errors > (エラーを選択) > Error instancesに進みます。

スタックトレースの欠如をトラブルシューティングする

エラーに関するスタックトレースが表示されない場合、以下の理由が挙げられます:

  • エラーが投げられていない場合、スタックトレースは生成されません。
  • JSスクリプトはCDNもしくは他の外部ロケーションでホスティングされており、New Relicはこれらのスクリプトに起因するエラーを確認できません。これは、オリジン間リソース共有(CORS)を利用することで、解決できる場合があります。
  • AngularJSエラーです。この詳細に関してはAngularエラーの欠如を参照してください。
  • エラーがSyntaxErrorもしくはScript errorである:これらは、スクリプトの読み込み中に発生するため、スタックトレースを生成しません。
  • 一部の古いブラウザでは、スタックトレースの無いエラーを生成するか、利用できないスタックトレースを提供する可能性があります。
  • New Relicエージェントが見つける前に、エラーをキャプチャーしています。

以下に示すのは、スタックトレースのレポートにおける一部のソリューションになります:

グローバルおよび一般的エラー

New Relicは、JavaScript関数をラップすることで、スタックトレース経由で投げられるエラー情報を取得します。エラーが投げられていなければ、これらを利用することはできません。たとえば、AngularJSアプリケーションでAngularJSエラーがUIに表示されない際は、トラブルシューティング手順に従います。

利用不可能なエラーには、以下が含まれます:

  • SyntaxErrorもしくはScript error: これらは、スクリプトの読み込み中に発生するため、スタックトレースを生成しません。
  • インラインのJavaScriptもしくはイベントハンドラエラー:これらはラップされていません。
  • 別ドメインに存在するサードパーティースクリプトが投げたエラーは、利用できません。
  • 古いブラウザで発生しているエラー:これらは、利用可能なスタックトレースを提供できない可能性があります。一部のケースでは、スタックトレースが一切提供されない場合もあります。

エラー収集はJavaScript関数をラップすることで行われるため、ブラウザによって下位で投げられるエラー(オリジン間リソース共有エラー等)も利用できません。

非推奨のJSエラーUI

JS errors UIページの古いバージョンは非推奨となったものの、期間限定で引き続き利用可能となっています。このビューに切り替えるには:メインのJS errorsページから、You're using the new JS errorsを選択して、Go back to classic versionを選択します。

非推奨のJSエラーUIを使用する

クラシックJS errors UIは、JSエラーを主ににそのスタックトレースごとにグループ化します。これは、同一のスタックを有するエラーはコード内の同じ場所から発生しているため、同一の原因を抱えている可能性が高いためです。

スタックトレースの詳細は、開発中に使用していないブラウザのエラースタックを含め、特定のブラウザタイプに関して発生したエラーを切り分ける上で役立ちます。スタックトレースには、URLのほか、Webページ上とコード内の短縮ロケーションが含まれます。

スタックトレースはブラウザ間で異なる可能性があるため、Browserエージェントは収取した各スタックトレースを「カノニカルスタックトレース」に変換してから、合わせてグループ化します。詳細なグループ化に関する追加のスタック情報が手に入らないため、スタックトレースを利用できないエラーも合わせてグループ化されます。

表示されるエラーメッセージには、アジア言語の文字もしくはその他のラテン以外の文字が使用されている場合があります。これは、ブラウザ内のメッセージが現地の言語で表示され、このテキストがNew Relic Browserによって取得されることが原因です。New Relic Browserは、そのスタックトレース向けに最も一般的なエラーメッセージを時間枠から選択して、追加の詳細を提供します。

その他のヘルプ

推奨する詳細情報: