スタックトレースの欠落したサードパーティJSエラー
スタックトレースの欠落したサードパーティJSエラー

スタックトレースの欠落したサードパーティJSエラー

問題点

JavaScriptエラーはサードパーティスクリプトが原因で発生した場合、このエラーはNew Relic Browser JSエラーページや紐づいたチャートで難読化されます。エラーメッセージは詳細なものではなく、エラーのタイトルはエラー:スタックトレースの欠落したエラーと表示されるだけでメッセージのコンテンツには詳細がありません。


New Relic Browser>JSエラー:JSエラーがサードパーティスクリプトが原因で発生した場合、エラーの詳細はNew Relic Browser上で難読化されます。クロスオリジンリソース共有(CORS)は問題を解決する1つの方法です。

解決方法

この問題の主な原因は同一オリジンポリシーにあります。これは、1つのWebリソースが同一のオリジン以外の別のリソースのデータを利用することを防止するセキュリティポリシーです。この場合のオリジンとはURIスキーマやホスト名、ポート番号などを組み合わせたものです。このポリシーを利用すると、悪意あるコードが他のWebリソースを利用するのを防げます。
このポリシーはインターネットのセキュリティのために重要ですが、Webリソースを連携して利用する障害となります。具体的な例で言うと、JSスクリプトをCDNまたは他の外部のロケーションで管理している場合、New Relicはこれらのスクリプトにより発生するエラーを確認できません。解決方法としてはクロスオリジンリソース共有(CORS)の利用が挙げられます。CORSを利用すると、JSエラーがアプリケーションから見えるようになります。つまり、New Relicでもこれらのエラーを確認できるようになります。CORSを有効にする方法を記載したオンラインリソースはたくさんあります。ここに1つ、さまざまなプラットフォームでCORSを有効にする方法を記載したWebサイトを載せておきます。New RelicはサードパーティWebサイトの正確性に関しては責任を負いません。

CORSを利用する場合、セキュリティ面での問題が発生する場合があります。CORSを実装するのが最適な選択かどうかは、利用しているシステムやセキュリティ面への配慮次第です。

このドキュメントはCORSを利用するための入門書として作成されているにすぎません。
以下に一般的なCORSの実装方法を記載します。

  1. JavaScriptをアプリに提供する全てのサードパーティアセットのリクエストヘッダーに『Access-Control-Allow-Origin』コードを追加します:

    ドメインまたは複数のドメインを設定すると、これらの特定のドメインがエラートレースの詳細やその他の利用可能なリソースにアクセスできるようになります。また代替的に、ドメインの代わりにアスタリスク(*)をワイルドカードとして利用できます。こうすると、全てのドメインがこのスクリプトにより利用可能になるリソースにアクセスできるようになります。

    ワイルドカード(*)オプションは、このスクリプトの適用されたリソースが全てのドメインから見えることを意味します。これらのリソースが機密データを含んでいる場合、データが悪用される可能性があります。
  2. アプリケーションでは、CORSの『crossorigin』属性を利用してブラウザーにJavaScriptファイルを読み込ませます:

関連情報

追加のドキュメンテーションリソースは次のとおりです。

  • JavaScriptエラー(New Relic BrowserでJSエラーページを利用)

New Relicのオンラインテクニカルコミュニティでブラウザーモニタリングについて議論しましょう!トラブルシューティングや質問をしたり、JavaScriptエラーレポートAJAXタイミングの詳細を話し合うことができます。