Web SDK移行のデバッグと検証
この演習では、web SDKに移行する際に、データをデバッグおよび検証する方法を説明します。 すべてが正しく動作していることを確認するのに役立つ、次の 2 つの異なる検証アクティビティを推奨します。
- 検証アクティビティ #1 は、ブラウザー拡張機能であるAdobe Experience Platform Debuggerを実行中で、Analytics にデータが正しく送信されているかどうかを途中で確認できます。 タグプロパティに変更を加えてその変更を開発ライブラリに公開する際には、このアクティビティを頻繁に行うことをお勧めします。
- 検証アクティビティ #2 がAdobe Analyticsに送信され、(新しく作成した移行レポートスイートを介して) web SDKからデータを受信する 1 つ以上のプロジェクトを設定し、サイトをクリックするなどして、データが実際に正しくレポートに入っていることを確認します。
Adobe Experience Platform Debugger
このデバッガーはブラウザー拡張機能で、Chrome ストアから入手できます。 デバッガーのダウンロード方法と使用方法について説明した ビデオチュートリアル があります。基本的な使用方法を知るには、まずそれを実行することをお勧めします。
デバッガーを起動して実行したら、それを使用して、サイトとEdge Networkからのデータのフローが正しいことを確認できます。 このチュートリアルは引き続きかなり基本的な用途で使用できますが、データを確認するにはデバッガーを最大限に使用してください。
想定(常に危険ですが、この場合は問題ありません): この例ではタグプロパティを web SDKに移行しているので、サイトに新しい埋め込みコードを配置する必要はありません。 それはもうそこにあったでしょう。 ただし、完全に新しいタグプロパティに対してさらに「リフト&シフト」アプローチを行う場合は、開発環境、ステージング環境および実稼動環境に配置する新しい埋め込みコードを使用します。 したがって、このチュートリアルの場合は、Web SDK拡張機能がインストールされ、データを送信するルールが設定されている限り、デバッガーにデータが表示されます。
デバッガーでの Web SDK データの表示
デフォルトのページルールを移行し(またはルールを移行した場合は)、開発環境のライブラリに公開したので、サイトを実行して、デバッガーに流入するデータを確認できます。
データを表示する手順:
-
ブラウザーでサイトの開発環境を開きます。
-
ブラウザーウィンドウ上部の拡張機能トレイにあるブラウザー拡張機能をクリックして、デバッガーを開きます。
note tip TIP デバッガーの右下隅には「ロック」アイコンとラベルがあり、その左側には、デバッグしているページが表示されます。 サイトでロックアイコンをクリックすると、デバッガーがサイトのウィンドウにロックされます。 そうしないと、別のブラウザータブやウィンドウをクリックしても、デバッガーはそのサイトに応答します。 サイトのデバッグ中は、デバッガーで常にサイトの情報を提供するようにすると、簡単です。 -
デバッガーの 概要 ページ(左上の「ホーム」アイコン)をクリックします。 ブラウザーウィンドウで サイトを更新 します。 サイト上でデバッガーによって埋め込みコードが取得されていて、Analytics コードを削除しなかった場合(このチュートリアルに従って)、Adobe Experience Platform タグに加えて、Adobe Experience Platform Web SDKとAdobe Analyticsの両方のコードが存在することが示されます。 その他はグレー表示されます。
-
Web SDKを使用して追加されたデータを表示するには、左側のレールの Experience PlatformWeb SDK リンクをクリックします
-
発生したヒットを削除するには、「イベントをクリア」をクリックします
-
サイトを再度更新し、デバッガーに戻ります
-
次に、テーブルの イベント の横にあるデータフィールドをクリックします
-
「値」フィールドで、0、data、__adobe および analytics まで展開します
-
デフォルトのページ読み込みルールや特別なルールなど、そのページで実行されるルールに設定した変数も表示されます。
-
タグプロパティの項目を変更し、開発に対して変更を公開したら、Analytics 実装に加えた変更の影響を確認できるように、これらの手順を実行します。
Analysis Workspaceでのデータの検証
この推奨事項の主な目的は、Adobe Analytics拡張機能を使用してタグ実装から取得した現在の分析データを取得し、Web SDKで入力されることになる同じレポートと比較することです。
これらの比較を設定する方法は複数ある可能性がありますが、その方法の例を 2 つ示します。
オプション 1:1 つのプロジェクトで 2 つのパネルを使用してデータを比較する
- Analysis Workspaceで新規プロジェクトを作成し、2 つのパネルを追加します
- パネル 1 のレポートスイートを、現在のAdobe Analytics実稼動レポートスイートに設定します。
- パネル 2 のレポートスイートを、新しい web SDK開発レポートスイートに設定します。
- 両方のレポートスイートにデータが送信された日のみを含む期間を使用して、同じレポートを両方のパネルに配置します
- データを比較
次のようになります(これらの空のデモレポートスイートにはデータがないことを理解しています)。
ご覧のように、レポートは両方のパネルで同じであり、カレンダーも同じです。 違いは、上記の手順で説明されているレポートスイートです。
このオプションの利点: レポートやディメンションを 1 つずつ選択して、実装を変更しながらテストしたいものを正確にテストできます。
オプション 2:2 つのプロジェクトを使用してデータを比較する
- 現在のAdobe Analytics extension データを使用する既存のプロジェクトを開きます
- 「名前を付けて保存」を実行して、そのプロジェクトのコピーを作成し、「Web SDK移行検証プロジェクト」のような名前を付けます
- コピーしたプロジェクトのレポートスイートを、Web SDK開発レポートスイートを指すように変更します。
- 各プロジェクトを別のウィンドウで開き、サイズを調整して、モニターで隣り合って表示できるようにします
- データを比較
各パネルが独自のプロジェクトと別のウィンドウにあることを除いて、これは上の画像によく似ています。
このオプションの利点: この場合、すべてのレポートを再度追加して設定する必要はありませんが、最小限の設定で新しい Web SDK拡張機能を使用して、現在のレポートがどのように表示されるかを確認できます。
両方を実行したい場合もあり、これも優れたオプションです。
確認いただきありがとうございます。