変更履歴ガイドご利用ガイドコーポレートサイト

JavaScript SDK フローチャート

JavaScript SDK の内部処理およびイベント関数の実行順序について説明します。

Suggest Edits

概要

JavaScript SDK (以下 JS SDK) を実行すると、既定の順序で多くの内部処理およびイベント関数が実行されます。このページでは、これらの内部処理およびイベント関数について説明し、それらがどのように実行シーケンスに収まるかを説明します。

スクリプトライフサイクルのフローチャート

以下の図は、JS SDK がスクリプトの生存期間中にイベント関数を順序付け、逐次的に実行する方法をまとめたものです。

凡例

1007

スクリプトライフサイクル

1000

シーケンスの解説

各シーケンスでの処理内容を解説します。
イベントハンドラーの使用方法については JavaScript SDK のセクションを参照してください。

JS SDK 初期化

このシーケンスでは JS SDK の内部処理を含む関数の準備を行います。
Sprocket タグがページに埋め込まれると初期化が開始して内部イベントの登録等が行われ、完了すると JS SDK が動作可能な状態になります。

カスタム JavaScript タグが読み込まれるタイミングでは、グローバル変数 SPSDK および JS SDK API が使用可能な状態になっています。カスタム JavaScript 内部でグローバル変数 SPSDK を通してJS SDK にイベントハンドラーを登録することで、自由なカスタマイズを行うことができます。

イベント

  • SPSDK.ready(event, handler)
    初期化が完了し、JS SDK の内部処理が利用可能になった時点で呼び出されます。

🚧

Sprocket ユーザーID, Consumer ID を用いた処理

JS SDK の初期化が完了した時点ではまだ［Sprocket ユーザーID］と［Consumer ID］がセットされていません。
これらの ID を利用する一部の JS SDK API は、ユーザー ID 制御の完了時以降に実行される必要があります。ID を使用するイベントハンドラーは SPSDK.userReady(event, handler) より後に発生するイベントへ登録してください。
なお、カスタム JavaScript 内のイベントハンドラー内部で 上記 ID を使用する処理を使用することは問題ありません。

ユーザー ID 制御

このシーケンスでは、［Consumer ID］および［Sprocket ユーザーID］をセットします。

シーケンス内では、まず［ユーザー作成率］に沿って、UU制限対象かの判定が行われます。具体的な処理として、ブラウザーごとに発番される［ゲスト ID］を使って XX.XX 形式（小数点第二桁までの数字）のハッシュ値を作り、UU制限対象かの判定が行われます。

JS SDK 初期化のたびに（ページロードのたびに）この処理が行われますので、［ユーザー作成率］を変えると、既に［Sprocket ユーザーID］が発番済みだったとしても接客対象から外れる可能性があります。

ユーザー ID と［ユーザー作成率］の詳細はご利用ガイドよりご確認ください。

本シーケンスが完了すると上記 ID が確定し、［Sprocket ユーザーID］を用いる全ての JS SDK API が実行可能になります。

イベント

  • SPSDK.userReady(event, handler)
    ユーザー ID がセットされ、利用できる様になった時点で呼び出されます。イベントハンドラーの中で全ての JS SDK の関数を使用することができます。

セッション制御

このシーケンスではセッションの開始を行います。

Sprocket では、30分以上行動データが送信されない場合にセッションが切り替わります。

すでにセッションが開始している場合、シーケンス内では何も起こりません。

イベント

  • beforeSessionStart
    セッション開始直前に SPSDK.registerHook('beforeSessionStart', handler) によって登録したイベントハンドラーがコールされます。

  • afterSessionStart
    セッション開始直後に SPSDK.registerHook('afterSessionStart', handler) によって登録したイベントハンドラーがコールされます。

行動データ制御

このシーケンスでは行動データの計測を開始します。

イベント

  • beforePageViewTracker
    行動データ計測開始直前に SPSDK.registerHook('beforePageViewTracker', handler) によって登録したイベントハンドラーがコールされます。

  • afterPageViewTracker
    行動データ計測開始直後に SPSDK.registerHook('afterPageViewTracker', handler) によって登録したイベントハンドラーがコールされます。

Updated about 1 year ago