SPAエージェントでルート変更ができない

問題

Pro + SPAエージェントを使用していますが、期待していた route change ブラウザのインタラクションがすべて表示されていません。

このような状況は非常に残念でなりません。2021年の目標は、SPAの機能を見直し、よりシンプルで信頼性の高いものにすることです。まず、経路の変更を検出して取り込むための方法を見直します。また、皆様からのフィードバックや事例に基づいて、新しいフレームワークやユースケースをテストスイートに追加する予定です。この作業には、新しいAPIや、フレームワークに特化したプラグインが含まれることになるでしょう。最新のアップデートについては、 リリースノート をご確認ください。

解決策

短期的なソリューション

すべてのルート変更がキャプチャされていることを確認するには、弊社の SPA interaction() API を使用することができます。インタラクション API を使用すると、 BrowserInteraction イベント（ category 属性）は、実際にルートの変更が検出されなかった場合、 ルート の変更ではなく、 カスタム として分類されます。

フレームワークがルーターのアクティビティを表すイベントを公開している場合、これらのイベントでカスタムインスツルメンテーションを使用することができます。ここでは、Angularのルーターで当社のAPIを使用する例を示します。

router.events.subscribe( (event: Event) => {
 if (event instanceof NavigationStart) {
 let i = newrelic.interaction()
 i.setName(event.url)
 i.save()
 }
});

この例では、 router オブジェクトは、Angular router のインスタンスです（ @angular/router モジュールから）。 setName 呼び出しは、 BrowserInteraction イベントの name 属性を新しい URL に設定し、 save 呼び出しは、インタラクションがキャプチャされていることを確認します。アプリケーションのフレームワークのニーズに合わせて、これを調整する必要があります。

お使いのフレームワークがルーティングイベントを提供していない場合は、 click などの元々のインタラクションイベントのイベントハンドラにこのコードを追加することができます）。

myButton.addEventListener('click', function () {
 let i = newrelic.interaction()
 i.setName(‘new URL')
 i.save()
});

推奨： ルーターイベントにもインタラクションイベントハンドラーにもアクセスできない場合は、ユーザーのインタラクションの結果であることがわかっているコードにできるだけ早く実装してください。

SPA API を使用する代わりに、ルートを PageAction イベントとしてキャプチャすることもできます。 PageAction イベント を使用して、任意のカスタム データをキャプチャすることができます。このオプションは、SPA インタラクション API を使用しても期待通りに動作しない場合の代替手段として、また、カスタム インスツルメンテーションを組み込みの BrowserInteraction イベントから完全に分離するためにお勧めします。

これらのソリューションはいずれも、 BrowserInteraction イベントとして、または PageAction イベントとして、これらのイベントを確実に捕捉することができます。しかし、これらのソリューションでは、正しい継続時間と関連するAJAXコールの記録には対応していません。

サポート

この方法で問題が解決しない場合は、サポートチケットを提出していただき、以下の情報をご用意ください。

• ほとんどのルートの変更が表示され、期待していた特定のルートの変更が表示されない場合は、その特定のルートのコードの実装の違いを評価してみてください。そのルートについて、サポートチームに提供できるような非標準的な、あるいはユニークなものはありますか？
• フレームワークや興味のありそうなライブラリを文書化してください。これが新しい問題である場合、これらのインタラクションが突然トラッキングされなくなるような環境の変化はありましたか？
• 使用しているブラウザエージェントのバージョンに注意してください。数リリース以上遅れている場合は、同様の問題が既に解決されている可能性があるため、最新のリリースに更新することをお勧めします。
• これらの問題の診断は複雑なため、チームはテストや研究のために問題を実証する環境やコードへのアクセスを必要とする可能性が高いことに注意してください。

原因

ブラウザエージェントは、フレームワークにとらわれず、コーディングのベストプラクティスをサポートしようとしています。しかし、期待したルート変更を収集できないようなエッジケースを見逃すこともしばしばあります。この実装は、最も一般的な非同期ブラウザAPIのインストゥルメントに基づいています。ウェブアプリケーションが非同期APIを使用していたり、カスタムコードやサードパーティコードを使用していても、インストルメント化されていない場合があり、その結果、不正確な経路変更や見逃しが発生することがあります。