ユーザー操作の追跡¶

ブラウザモニタリングは、ユーザーのインタラクションを自動的に検出し、アプリケーション内のクリックを手動で検出しなくても、ユーザーの行動を詳しく把握できます。

次のことを実現できます。

• 重要なインタラクションのパフォーマンスを把握する（例：操作ボタンのクリック）
• 機能の採用状況を定量化する
• 特定のブラウザエラーの発生手順を特定する

Action 収集の有効化を制御する¶

初期化パラメータ trackUserInteractions は、アプリケーション内でのユーザークリックを収集します。つまり、ユーザーが操作した要素を特定するために、ページに含まれる機密データやプライベートデータが収集対象に含まれる可能性があります。

window.DATAFLUX_RUM &&
  window.DATAFLUX_RUM.init({
    // その他の初期化設定
    trackUserInteractions: true
  })

ユーザーインタラクションの追跡¶

RUM SDK はクリックを自動的に追跡します。以下のすべての条件を満たす場合、クリックアクションが作成されます。

• クリック後にアクティビティが検出されること。つまりページアクティビティ状態であること。
• クリックによって新しいページがロードされないこと。この場合、RUM SDK は別の RUM View イベントを生成します。
• Action 名を取得できること。

Action メトリクス¶

RUM SDK は、クリックごとのページアクティビティを監視してアクションのロード時間を計算します。ページにアクティビティがなくなると、アクションは完了したと見なされます。

Action 属性¶

Action 名¶

RUM SDK は、クリック可能な要素とその親要素に基づいて Action 名を推測します。自動生成された名前が不安定な場合は、組み込み属性を使用して明示的に名前を付けることができます。

クリック可能な要素またはその親要素に data-guance-action-name を追加します：

<button type="button" data-guance-action-name="提交订单">提交订单</button>

初期化パラメータ actionNameAttribute を使用すると、要素にカスタム属性を追加してアクション名を指定できます。

初期化時に属性名を指定します：

window.DATAFLUX_RUM &&
  window.DATAFLUX_RUM.init({
    // その他の初期化設定
    trackUserInteractions: true,
    actionNameAttribute: "data-custom-name"
  })

クリック可能な要素またはその親要素に対応する属性を設定します：

<button type="button" data-custom-name="提交订单">提交订单</button>

要素に組み込み属性と actionNameAttribute で設定したカスタム属性の両方が存在する場合は、組み込み属性が優先されます。

自動 Action 名の保護¶

RUM SDK 3.3.14 以降では、enablePrivacyForActionName: true を使用して、DOM プライバシーレベルを自動的に推測された Action 名に適用できます：

window.DATAFLUX_RUM &&
  window.DATAFLUX_RUM.init({
    // その他の初期化設定
    trackUserInteractions: true,
    enablePrivacyForActionName: true,
    defaultPrivacyLevel: "mask-user-input"
  })

このスイッチはデフォルトで false に設定されており、既存アプリケーションの Action 命名動作を維持します。有効にすると、SDK は defaultPrivacyLevel と祖先要素の data-gc-privacy 属性または gc-privacy-* クラス名を組み合わせて、実際のプライバシーレベルを計算します。

前述の組み込み属性または actionNameAttribute で明示的に指定された名前は、アプリケーションが意図的に提供するビジネスメタデータと見なされ、mask および mask-user-input でも引き続き使用できます。hidden サブツリーでは自動 Action は生成されません。このスイッチは自動収集された Action 名にのみ影響し、addAction() で渡された名前は引き続きアプリケーション側で制御されます。

Shadow DOM での Action¶

RUM SDK は、オープン Shadow DOM（mode: "open"）内部のクリック操作の自動収集をサポートしています：

• イベントの実際のクリック要素に基づいて、Action 名と Shadow 境界を含む位置情報を生成します。
• iframe の JavaScript レルムで作成され、ShadowRoot にマウントされた要素（例：无界マイクロフロントエンドがレンダリングしたボタン）をサポートします。
• 同じ ShadowRoot 内の aria-labelledby に関連付けられた要素から名前を取得できます。
• 単層および多層にネストされたオープン ShadowRoot をサポートします。

Shadow DOM の境界をまたぐ場合、自動 Action 名には明示的な命名属性、またはボタン、リンク、ARIA など明確なセマンティクスを持つインタラクティブ要素のみが使用されます。任意のテキストノード、テーブル行、カードコンテナの集約テキストは名前として使用されません。ネイティブなインタラクションセマンティクスを持たないカスタムコンテナの場合は、クリック要素またはその祖先に data-guance-action-name を追加するか、actionNameAttribute でカスタム命名属性を設定してください：

<div data-guance-action-name="打开付款单" role="button">
  <!-- 支払い伝票の内容 -->
</div>

この制限は Shadow DOM の境界をまたぐ自動 Action の命名にのみ適用され、通常の DOM では既存の命名ポリシーが維持されます。

Closed Shadow DOM（mode: "closed"）は外部スクリプトに内部ノードを公開しないため、ブラウザイベントが提供する Shadow Host 情報に基づいてのみ収集でき、内部要素の名前や位置情報を取得できるとは限りません。

カスタム Action¶

クリックでは表現できないビジネス操作は、addAction API を使用してカスタム Actionを作成してください。

導入の確認¶

1. 明確な名前のボタンをクリックします。
2. ブラウザの Network で /v1/write/rum への送信リクエストを確認します。
3. 対応する Web アプリケーションの Action エクスプローラーで、Action 名、所要時間、関連する Resource と Error の数を確認します。

Action が表示されない場合は、trackUserInteractions が true であるか、現在の Session がサンプリング対象であるか、クリック後に帰属可能なページアクティビティが発生したかを順に確認してください。