A4T での ID サービスの使用と Target のサーバーサイド実装

これらの手順は、Target、Analytics、ID サービスのサーバーサイドとクライアントサイドの実装が混在している A4T ユーザー向けのものです。 NodeJS または Rhino 環境で ID サービスを実行する必要があるユーザーも、この情報を確認する必要があります。 ID サービスのこのインスタンスでは、Node Package Manager （NPM）からダウンロードしてインストールできる短縮バージョンの VisitorAPI.js コードライブラリを使用します。 インストール手順およびその他の設定要件については、この節を参照してください。

はじめに

A4T （および他の顧客）は、以下が必要な場合に、このバージョンの ID サービスを使用できます。

  • web ページコンテンツをサーバー上でレンダリングして最終表示用にブラウザーに渡す。
  • サーバー側 Target 呼び出しをおこなう。
  • Analytics に対するクライアント側（ブラウザー内）呼び出しをおこなう。
  • 個別の Target および Analytics ID を同期して、あるソリューションで見られた訪問者が他のソリューションで見られた人物と同じかどうかを判定する。

コードのダウンロードと提供されたインターフェイス

ID サービスの NPM リポジトリを参照して、サーバーサイドのコードパッケージをダウンロードし、現在のビルドに含まれているインターフェイスを確認します。

ワークフロー

以下の図と節では、サーバーサイド実装プロセスの各手順で何が行われ、何を設定する必要があるかを説明します。

手順 1：リクエストページ

web ページを読み込む HTTP リクエストを訪問者が実行すると、サーバーサイドアクティビティが開始します。 このステップで、サーバーはこのリクエストを受け取り、AMCV cookie をチェックします。 AMCV cookie には、訪問者の Experience Cloud ID（MID）が含まれます。

手順 2：ID サービスペイロードの生成

次に、サーバー側 payload request を ID サービスにする必要があります。ペイロードリクエストは以下を行います。

  • AMCV cookie を ID サービスに渡す。
  • 以下に説明する後続の手順で Target と Analytics で必要になるデータをリクエストします。
メモ

このメソッドは、Target から 1 つの mbox をリクエストします。1 回の呼び出しで複数の mbox をリクエストする必要がある場合は、generateBatchPayload を参照してください。

ペイロードリクエストは、以下のコードサンプルのようになります。このコードサンプルでは、visitor.setCustomerIDs 関数はオプションです。詳しくは、顧客 ID および認証の状態を参照してください。

//Import the ID service server package
var Visitor = require("@adobe-mcid/visitor-js-server");

//Pass in your Organization ID to instantiate Visitor
var visitor = new Visitor("Insert Experience Cloud ID here");

//
<i>(Optional)</i> Set a custom customer ID
visitor.setCustomerIDs({
     userid:{
          id:"1234",
          authState: Visitor.AuthState.UNKNOWN //AuthState is a static property of the Visitor class
     }
});

//Parse the visitor's HTTP request for the AMCV cookie
var cookies = cookie.parse(req.headers.cookie || "");
var cookieName = visitor.getCookieName(); // Visitor API that returns the cookie name.
var amcvCookie = cookies[cookieName];

//Generate the payload request pass your mbox name and the AMCV cookie if present
var visitorPayload = visitor.generatePayload({
     mboxName: "bottom-banner-mbox",
     amcvCookie: amcvCookie
});

ID サービスは、以下の例のように、JSON オブジェクトでペイロードを返します。ペイロードデータは、Target で必要です。

{
    "marketingCloudVisitorId": "02111696918527575543455026275721941645",
    "mboxParameters": {
        "mboxAAMB": "abcd1234",
        "mboxMCGLH": "9",
        "mboxMCSDID": "56BE026543F7E211-1CC51BCAAE88F0D2",
        "vst.userid.id": "1234567890",
        "vst.userid.authState": 0
    }
}

訪問者が AMCV Cookie を持っていない場合、ペイロードは、これらのキーと値のペアを省略します。

  • marketingCloudvisitorId
  • mboxAAMB
  • mboxMCGLH

手順 3：Target 呼び出しへのペイロードの追加

サーバーが ID サービスからペイロードデータを受け取ったら、追加のコードをインスタンス化して、Target に渡したデータと結合する必要があります。Target に渡された最終的な JSON オブジェクトは、以下のようになります。

{
"mbox" : "target-global-mbox",
"marketingCloudVisitorId":"02111696918527575543455026275721941645",
"requestLocation" : {
     "pageURL" : "http://www.domain.com/test/demo.html",
     "host" : "localhost:3000"
     },
"mboxParameters" : {
     "mboxAAMB" : "abcd1234",
     "mboxMCGLH" : "9",
     "mboxMCSDID": "56BE026543F7E211-1CC51BCAAE88F0D2",
     "vst.userid.id": "1234567890",
     "vst.userid.authState": 0,
     }
}

手順 4：ID サービスのサーバー状態の取得

サーバー状態データには、サーバー上で行われた作業に関する情報が含まれています。 クライアントサイドの ID サービスコードには、この情報が必要です。 Dynamic Tag Manager（DTM）を使用して ID サービスを実装したお客様は、このツールを使用してサーバー状態データを渡すように DTM を設定できます。非標準のプロセスで ID サービスを設定した場合、独自のコードを使用してサーバー状態を返す必要があります。クライアント側 ID サービスおよび Analytics コードは、ページが読み込まれる際に Adobe に状態データを渡します。

DTM を使用したサーバー状態の取得

DTM を使用して ID サービスを実装した場合、ページにコードを追加して、DTM 設定に名前と値のペアを指定する必要があります。

ページコード

このコードを HTML ページの <head> タグに追加します。

//Get server state
var serverState = visitor.getState();

Response.send("
...
<head>
     <script>
          //Add 'serverState' as a stringified JSON global variable.
          "var serverState = "+ JSON.stringify(serverState) +";
     </script>
     <script src = "DTM script (satellite JS)">
     </script>
</head>
...

DTM 設定

これらを名前と値のペアとして ID サービスインスタンスの​一般／設定​セクションに追加します。

  • 名前： serverState

  • 値：%serverState%

    重要

    値の名前は、ページコードの serverState に設定した変数名に一致する必要があります。

設定は次のようになります。

DTM を使用しないサーバー状態の取得

ID サービスの非標準の実装をおこなった場合、このコードを設定して、リクエストされたページのアセンブル中に、サーバー上で実行する必要があります。

//Get server state
var serverState = visitor.getState();

Response.send("
...
<head>
     <script src="VisitorAPI.js"></script>
     <script>
          var visitor = Visitor.getInstance(orgID, {
          serverState: serverState
          ...
     </script>
</head>
...

手順 5：ページを提供して Experience Cloud データを返す

この時点で、Web サーバーは訪問者のブラウザーにページコンテンツを送信します。これ以降、（サーバーではなく）ブラウザーが残りのすべての ID サービスおよび Analytics の呼び出しをおこないます。例えば、ブラウザーでは次のようになります。

  • ID サービスがサーバーから状態データを受け取り、SDID を AppMeasurement に渡します。
  • AppMeasurement が、SDID を含むページヒットに関するデータを Analytics に送信します。
  • Analytics および Target は、この訪問者の SDID を比較します。同一の SDID の場合、Target および Analytics は、サーバー側呼び出しとクライアント側呼び出しを共に結合します。この時点で、両方のソリューションは、この訪問者を同じ人物として認識します。
関連記事

このページ