これは、New Relic セッション リプレイの問題を自分で診断するための最初のステップです。
問題がここにリストされていない場合は、いつでもNew Relic サポートにお問い合わせください。
リプレイがUIに表示されない
問題
セッションリプレイ機能は有効になっていますが、リプレイを表示できません。
解決
以下に考えられる修正をいくつか示します。
サンプリングレートを確認してください。 リプレイとエラーの両方にサンプリングがあります。
リプレイを表示する権限があることを確認してください。
ブラウザ エージェントの Pro または Pro+SPA バージョンを使用していることを確認してください。 セッション リプレイは、Lite ブラウザ エージェントでは機能しません。
ブラウザ エージェントが次の要件を満たしていることを確認してください。
- エージェントバージョン v1.260.0 以降。 改善を継続的に行っていくため、最新のエージェント バージョンにアップグレードすることをお勧めします。
- エージェントのタイプ: Pro または Pro+SPA。 セッション リプレイは、Lite ブラウザ エージェントでは機能しません。
- セッション トレースが有効になっています。
エンドユーザーのbrowserセッションリプレイを記録するために必要なbrowserレベルのAPIをサポートしています ( MutationObserverで互換性を確認してください)。
エラー受信トレイで、常に再生できるようにビューをフィルターします。 デフォルトでは、 browserイベント データは 8 日間保存されますが、実際のデータ保持期間はアカウントによって異なります。
コピー/ペーストの展開方法を使用している場合は、エージェント コードを更新していることを確認してください。
APMデプロイメント方式を使用する場合は、セッションリプレイが自動的に有効になるまで待つ必要がある場合があります。 それでもデータが表示されない場合は、エージェントを再起動してみてください。
PageView イベント データを削除している場合、セッション リプレイがUIに表示されない場合があります。
リプレイが正しく表示されない
問題
リプレイは見ることができますが、正しく表示されません。
これは、CSS ファイルが別のドメインでホストされており、Cross-Origin Resource Sharing (CORS) セキュリティ対策によってエージェントが CSS ファイルにアクセスできないことが考えられます。 これにより、重要なスタイル情報が欠落している可能性があるため、リプレイが不完全または不正確になる可能性があります。
舞台裏で何が起こっているかは次のとおりです。
セッションリプレイはユーザーの DOM を再構築し、Web サイトの構造と視覚要素をキャプチャします。 これを実現するために、エージェントは CSS ファイルにアクセスして、スタイル情報を正確に取得します。 これらのスタイルはリプレイ録画に直接埋め込まれるため、再生中に元の CSS ファイルを参照する必要がなくなります。
CSS ファイルが別のドメインでホストされている場合、CORS によりエージェントがそれらにアクセスできなくなる可能性があります。
解決
CSS ファイルにアクセスできるようにするには、HTML コード内の<link rel="stylesheet">要素にcrossorigin="anonymous"属性を追加します。 この属性は、ブラウザーに特定の CSS ファイルへのクロスオリジン アクセスを許可するよう指示し、ブラウザー エージェントがスタイル情報を記録および統合できるようにします。
crossorigin="anonymous"属性を追加する例を次に示します。
<link rel="stylesheet" href="assets.yoursite.com/styles.css" crossorigin="anonymous">リプレイはiframeでは表示されません
問題
セッションリプレイ機能は有効になっていますが、iframe コンテンツのリプレイ データを表示することはできません。
解決
iframe シナリオでのセッション リプレイの動作は、iframe の起源とブラウザ エージェントの配置によって異なります。
Web ページが子 iframe を持つトップレベル ウィンドウで構成されていると仮定すると、次のような修正方法が考えられます。
同じオリジンの iframe :
- ブラウザエージェントをトップレベルウィンドウに配置すると、セッションリプレイはウィンドウと iframe の両方をキャプチャします。
- ブラウザエージェントを iframe 内に配置すると、セッションリプレイは iframe 内の内容のみをキャプチャします。
- ブラウザエージェントをトップレベルのウィンドウと iframe の両方に配置すると、セッションリプレイはウィンドウと iframe の両方で独立して何が起こっているかをキャプチャし、結果として 2 つの別々のセッションが作成されます。
クロスオリジン iframe :
- ブラウザエージェントをトップレベルウィンドウに配置すると、セッションリプレイはウィンドウ内の内容のみをキャプチャします。 セッションリプレイでは iframe が空白で表示されます。
- ブラウザエージェントを最上位の iframe に配置すると、セッションリプレイは iframe 内の内容のみをキャプチャします。
セッションリプレイは<frame>要素と互換性がありません。