メインコンテンツまでスキップ

Rokt

RoktのUniversal Module Definition(UMD)バンドルは、ウィンドウオブジェクトに公開され、ページにRoktのソリューションを読み込んだ後に利用可能になります。

概要

Roktのスクリプトをページに読み込んだ後、Rokt UMDバンドルはwindow.Roktとしてウィンドウオブジェクトに利用可能になります。スクリプトの読み込みが非同期である場合は、スクリプトの読み込みが完了するまでに追加の処理が必要になる場合があります。

同期読み込みの例

<script
crossorigin="anonymous"
src="https://apps.rokt.com/wsdk/integrations/launcher.js"
></script>
const launcher = await window.Rokt.createLauncher({
accountId: "rokt-account-id",
});

上記の引数リストで重要なパラメータは次のとおりです:

  • https://apps.rokt.com/wsdk/integrations/launcher.js — Rokt Launcherの最新バージョンを指すURLです。
  • rokt-account-id — ユニークなRoktアカウントIDで、正しい値に置き換える必要があります。アカウントIDがわからない場合は、RoktアカウントIDはどこで見つけられますか?を参照してください。

非同期読み込みの例

<script
async
crossorigin="anonymous"
id="rokt-launcher"
fetchpriority="high"
src="https://apps.rokt.com/wsdk/integrations/launcher.js"
type="module"
></script>
await new Promise((resolve) =>
window.Rokt
? resolve()
: (document.getElementById("rokt-launcher").onload = resolve)
);

const launcher = await window.Rokt.createLauncher({
accountId: "rokt-account-id",
});

スクリプトタグに追加の属性があることに注意してください:

  • async - スクリプトの非同期読み込みを有効にします
  • id="rokt-launcher" - スクリプト要素のIDです。document.getElementById('rokt-launcher')に渡されるIDと一致する必要があります。
  • type="module" - 読み込まれるリソースの優先度を上げます。詳細についてはベストプラクティスを参照してください。

さらに、Rokt UMDバンドルの取得は、非同期に読み込まれたRoktスクリプトが利用可能になった後にのみコードが実行されるように、Promiseでラップする必要があります(例のように)。

メソッド

createLauncher

createLauncher: (options: IntegrationLauncherOptions): Promise<IntegrationLauncher>

IntegrationLauncherのインスタンスを作成します。これはRoktとの統合のエントリーポイントです。作成されたオブジェクトへの参照をインテグレータが保持する責任があります。

同時に、単一のインスタンスしか存在できません。前のインスタンスが終了されていない限り、別のインスタンスを作成しようとするとエラーが発生します。

パラメータ:

名前タイプ説明
optionsIntegrationLauncherOptions統合をカスタマイズするオプション

戻り値: _IntegrationLauncher

この記事は役に立ちましたか?