• /
  • EnglishEspañolFrançais日本語한국어Português
  • ログイン今すぐ開始

この機械翻訳は、参考として提供されています。

英語版と翻訳版に矛盾がある場合は、英語版が優先されます。詳細については、このページを参照してください。

問題を作成する

interaction (SPA API)

構文

newrelic.interaction([JSON object $options])

現在の SPA インタラクションにバインドされた新しいハンドル オブジェクトを返します。存在しない場合は新しいインタラクションを返します。

要件

  • .interaction() APIには、Browser Pro+SPAエージェント(v963以上)が必要です。
  • APIへの $options オブジェクトの提供は、バージョン v1.285.0 以降でのみサポートされています。
  • waitForEnd オプションは、v1.285.0 以降でのみサポートされています。
  • targetPageLoad オプションは v1.315.0 以降でのみサポートされています。

npm 経由で Browser エージェントをインストールし、選択した機能を使用してカスタム エージェントを構築する場合は、 Agentインスタンスの作成時にspa機能を有効にする必要があります。 features配列に以下を追加します。

import { Agent } from '@newrelic/browser-agent/loaders/agent'
import { Spa } from '@newrelic/browser-agent/features/spa';
const options = {
info: { ... },
loader_config: { ... },
init: { ... },
features: [
... other features ...
Spa
]
}
new Agent(options)

詳細については、 npm ブラウザのインストールに関するドキュメントを参照してください。

説明

SPA監視interaction() APIコールを使用すると、Browserエージェントによって追跡されるSPAインタラクションを制御およびカスタマイズできます。このAPIを使用して、次のことを行います:

  • Browserエージェントが自動的に検出しないパターンに対して、カスタムインタラクションを手動で作成します。
  • カスタムアトリビュートを追加したり、名前を付けたり、完了するタイミングを制御したりすることで、既存のインタラクションを変更します。

使い方

newrelic.interaction() を呼び出すと、BrowserInteraction イベントを参照するhandle [ハンドル](JavaScript オブジェクト)を取得します。このハンドルを使用すると、.save().ignore().setName().setAttribute() などのメソッドを呼び出して、インタラクションを制御できます。

インタラクション状態別のAPIの動作

APIは、インタラクションの現在の状態に応じて異なる動作をします:

ステート

行動

No interaction in progress

新しいカスタムインタラクションを作成します。

  • waitForEnd: true を設定しない限り、カスタムインタラクションは、次のソフトナビゲーションが完了したときに (デフォルトの SPA ヒューリスティックに従って) 自動的にクローズされます。
  • これを使用して、モーダルを開く、セクションを展開するなど、ルート変更をトリガーしないユーザーアクションを追跡します。

Interaction already in progress

現在アクティブなインタラクションを参照する新しいハンドルを返します。

  • 同じインタラクションに対して複数のハンドルを作成できます。これは、コードのさまざまな部分からインタラクションのさまざまな側面を制御したい場合に便利です。
  • 既存のインタラクションは継続します。このAPIは、すでに進行中のインタラクションを置き換えたり上書きしたりすることはできません。
  • ユーザーがトリガーするインタラクション(クリックなど)と、APIがトリガーするカスタムインタラクションの両方で機能します。

Targeting the initial page load

targetPageLoad: true オプションを使用すると、ハンドルは常に初期ページロードの BrowserInteraction イベントを参照します。

  • これが、初期ページロードのインタラクションにアクセスして変更する唯一の方法です。
  • このオプション以前は、初期ページの読み込みにAPI経由でアクセスできませんでした。

重要な行動

行動

説明

複数のハンドルは独立しています

newrelic.interaction()を呼び出すたびに、基盤となる同じインタラクションを参照している場合であっても、個別のハンドルオブジェクトが作成されます。1つのハンドルで呼び出されたメソッドは他のハンドルに影響を与えませんが、すべて同じBrowserInteractionイベントを変更します。

インタラクションを上書きできません

ユーザーがボタンをクリックし(インタラクションを開始)、その後コードが newrelic.interaction() を呼び出した場合、API はクリックインタラクションへのハンドルを返します。新しいインタラクションを作成することはありません。Browserエージェントは、実際のユーザーインタラクションを優先します。

ハンドルが非アクティブになる

インタラクションが完了すると、それを参照するハンドルはすべて非アクティブになります。非アクティブなハンドルに対するメソッド呼び出しは何も影響を与えず、エラーもスローしません。

正確な制御には waitForEnd を使用します。

デフォルトでは、インタラクションはSPAヒューリスティック(ルート変更、AJAXの完了、DOMの安定化)に基づいてクローズします。waitForEnd: true を設定すると、ハンドルで明示的に .end() を呼び出すまで、インタラクションは開いたままになります。

注意

waitForEnd: truetargetPageLoad: trueを併用すると、.end()が呼び出されるまで初期ページロードのBrowserInteractionイベントが無期限に開いたままになり、初期ページロードのBrowserInteractionイベントのデフォルト定義が変更されます。これは高度なユースケースであり、注意して使用する必要があります。

パラメーター

パラメータ

説明

$options

JSONオブジェクト

オプション: インタラクションの動作に影響するオプションを指定します。

  • waitForEnd - (v1.285.0+)デフォルトはfalseです。そのハンドルで .end メソッドが呼び出されるまでインタラクションを強制的に開いたままにするには、それを true に設定します。インタラクションがこれでマークされた後は、元に戻すことはできません。
  • targetPageLoad - (v1.315.0+)デフォルトはfalseです。true に設定した場合、返されるハンドルは、ソフトナビゲーションのインタラクションを作成またはターゲットにするのではなく、初期ページロードのインタラクションにバインドされます。これは、initialPageLoadインタラクションをターゲットにする唯一の方法です。

戻り値

このメソッドは、潜在的なBrowserInteractionイベントを指すネイティブ JS オブジェクトを返します。このメソッドは、まだ終了していない間に同じBrowserInteractionに対して呼び出されるたびに、新しいオブジェクトが作成されますが、同じインタラクションを参照し続けます。

SPA APIメソッドは、newrelic.interaction()から返された出力に適用できます。後で使用するために、戻り値またはハンドルを別の変数に代入できます。例を以下に示します。

let myInteraction = newrelic.interaction();
...
myInteraction.save();

インタラクションAPIの一覧については、シングルページアプリの追跡を参照してください。

名前付きハンドルは保存してインタラクションの外部から使用できますが、インタラクションが終了した後は SPA メソッドは効果がないことに注意してください。

インタラクションの持続時間は次の方法でカスタマイズすることもできます。

// Say an interaction is already open from a user click.
const userInteraction = newrelic.interaction({ waitForEnd: true }); // grabs the current interaction in-progress & keep it open
// URL changes & DOM is modified. Because of those condition being met, interaction will be saved but is kept open.
fetch('myurl.com/endpoint').then(() => userInteraction.end()) // associate this request to the interaction before completing this BrowserInteraction
const myCustomIxn = newrelic.interaction({ waitForEnd: true }) // create a new api-triggered interaction
// This interaction will be kept open indefinitely until `.end` is called, and no new interaction will start, custom or otherwise. AjaxRequest will continue to buffer under this interaction until it is closed.
Copyright © 2026 New Relic株式会社。

This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.