at.js カスタムイベント
mbox リクエストまたはオファーの失敗や成功を把握するための at.js custom events
について説明します。
以前は、mbox.js(現在は非推奨)を使用している場合、バックグラウンドでの処理内容を、ページ上で実行される他の JavaScript コードが把握することはできませんでした。 at.js の改良により、この問題を独自の方法で解決することができました。
当社のお客様によれば、次のような場合に通知が必要になります。
- タイムアウト、ステータスコードの誤り、JSON 解析エラーなどの理由で mbox リクエストが失敗した。
- mbox リクエストが成功した。
- ラッピング mbox 要素が欠落している、セレクターがないなどの理由でオファーのレンダリングが失敗した。
- オファーのレンダリングが成功した。DOM の変更が適用されました。
事前定義されたイベントの構造は、イベントのタイプに基づいて必要なデータを抽出できるようになっています。
イベントを様々なシナリオで使用できるようにするため、カスタムイベントにはペイロードオブジェクトがあります。このオブジェクトは(ハンドラーに渡される)イベントオブジェクトの詳細プロパティに割り当てられます。また、文字列をイベント名として渡さないようにするため、イベントは adobe.target.event
名前空間を使用して定数として公開されます。
構造
at.js とのインタラクションの追跡、デバッグ、カスタマイズに役立つ通知を受け取るシナリオには、様々なものが考えられます。
以下の各カスタムイベントには、「定数」と「文字列値」の 2 つの形式があります。
- 定数: 先頭に
adobe.target.event.
が追加されます。すべて大文字で記述され、アンダースコア文字が含まれます。at.js の読み込みの 後 から、mbox の応答の 前 までの間にカスタムイベントをサブスクライブする場合は、定数を使用します。 - 文字列値: 小文字で記述され、ダッシュが含まれます。at.js の読み込みの 前 にカスタムイベントをサブスクライブする場合は、文字列値を使用します。
Request Failed
定数: adobe.target.event.REQUEST_FAILED
文字列値: at-request-failed
説明: タイムアウト、ステータスコードの誤り、JSON 解析エラーなどの理由で mbox リクエストが失敗しました。
Request Succeeded
定数: adobe.target.event.REQUEST_SUCCEEDED
文字列値: at-request-succeeded
説明: mbox リクエストが成功しました。
Content Rendering Failed
定数: adobe.target.event.CONTENT_RENDERING_FAILED
文字列値: at-content-rendering-failed
説明: ラッピング mbox 要素が欠落している、セレクターがないなどの理由で、オファーのレンダリングが失敗しました。
Content Rendering Succeeded
定数: adobe.target.event.CONTENT_RENDERING_SUCCEEDED
文字列値: at-content-rendering-succeeded
説明: オファーのレンダリングが成功しました。DOM の変更が適用されました。
Library Loaded
定数: adobe.target.event.LIBRARY_LOADED
文字列値: at-library-loaded
説明: このイベントは、at.js が完全に読み込まれたタイミングを追跡する場合に最適です。このイベントを使用してグローバル mbox の実行をカスタマイズできます。グローバル mbox を無効にしてから、このイベントをリッスンして後でグローバル mbox を呼び出すこともできます。
Request Start
定数: adobe.target.event.REQUEST_START
文字列値: at-request-start
説明: このイベントは、HTTP リクエストの実行前に発生します。このイベントは、Resource Timing API によるパフォーマンス計測に使用できます。
Content Rendering Start
定数: adobe.target.event.CONTENT_RENDERING_START
文字列値: at-content-rendering-start
説明: このイベントは、セレクターポーリングが開始され、コンテンツがページにレンダリングされる前に発生します。このイベントを使用して、コンテンツのレンダリングの進捗状況を追跡できます。
Content Rendering No Offers
定数: adobe.target.event.CONTENT_RENDERING_NO_OFFERS
文字列値: at-content-rendering-no-offers
説明: このイベントは、オファーが返されなかったときに発生します。
Content Rendering Redirect
定数: adobe.target.event.CONTENT_RENDERING_REDIRECT
文字列値: at-content-rendering-redirect
説明:このイベントは、オファーがリダイレクトであり、 Target は別の URL にリダイレクトされます。
sessionId
と deviceId
が格納されます。場合によっては、deviceId
が Target を取得できないため、この値が欠落することがあります。オンデバイス判定アーティファクトが成功しました
定数:
adobe.target.event.ARTIFACT_DOWNLOAD_SUCCEEDED
文字列値: artifactDownloadSucceeded
説明:オンデバイス判定アーティファクトが正常にダウンロードされたときに呼び出されます。
オンデバイス判定アーティファクトが失敗しました
定数: adobe.target.event.ARTIFACT_DOWNLOAD_FAILED
文字列値: artifactDownloadFailed
説明:オンデバイス判定アーティファクトのダウンロードに失敗した場合に呼び出されます。
使用方法
document.addEventListener(adobe.target.event.REQUEST_SUCCEEDED, function(event) {
console.log('Event', event);
});
トレーニングビデオ:レスポンストークンと at.js カスタムイベント
![チュートリアルバッジ](./media_17535bd0cf88bd78f34db63b540a59562d8c35b64.png?width=750&format=png&optimize=medium)
次のビデオでは、レスポンストークンと at.js カスタムイベントを使用してからプロファイル情報を共有する方法について説明します。 Target をサードパーティ製システムに追加する必要があります。