手動連携

はじめに

この連携方法では、FanplayrがそのJavaScriptを介してユーザー識別子を保存および取得できるように、ドメイン上に小さなHTTPS APIを作成します。

サーバー側ユーザーIDクッキーに保存された値の読み取り。

FanplayrがユーザーIDクッキーを読み取る必要がある場合、ウェブサーバーにリクエストを実行します。上記の図の各ポイントについて以下に説明します。

• クッキー読み取りリクエスト (1) — FanplayrのJavaScriptは、Fanplayr JavaScript設定の connect.endpoint プロパティで定義された場所にあるあなたのウェブサーバーへ、ブラウザからGETリクエストを実行します。
  
  ユーザーのIDが以前にクッキーに保存されており、それがまだ存在する場合、ブラウザはリクエストにクッキーを含めてサーバーに送信します。
• クッキー読み取りレスポンス (2) — クッキーが利用可能な場合、ウェブサーバーはクッキー値を読み取り、デコードされた値をブラウザに応答として返す必要があります。この値はJSONオブジェクトになります。

サーバー側ユーザーIDクッキーに保存された値の更新。

FanplayrがユーザーIDクッキーに保存された値を更新する必要がある場合、保存する値を持つ data パラメータを含むGETリクエストを実行します。上記の図の番号付きの各ポイントについて以下に説明します。

• クッキー書き込みリクエスト (3) — FanplayrのJavaScriptは、Fanplayr JavaScript設定の connect.endpoint プロパティで定義された場所にあるあなたのウェブサーバーへ、ブラウザからGETリクエストを実行します。
• クッキー書き込みレスポンス (4) — サーバーは、ブラウザに新しい値をウェブサイトのベースパスで最大1年間クッキーに保存するよう指示する Set-Cookie ヘッダーでリクエストに応答します。実装の詳細は、このドキュメントの後半に含まれています。最後に、サーバーはデコードされたクッキー値をレスポンスボディとして含めます。

仕組み

あなたのサーバー上に、ドメインのセキュアなクッキーを読み書きする小さなHTTPS APIを定義する必要があります。FanplayrのJavaScriptライブラリは、ユーザー識別子を取得または更新する必要があるときに、ブラウザからこのAPIを呼び出します。

ページトラッキングスニペットでのAPI URLの定義
ページトラッキングと注文トラッキングの両方のコードで、connect プロパティを以下の値を持つオブジェクトとして定義します。

• endpoint
  • タイプ: string
  • 必須
  • 詳細: 実装したカスタムAPIの完全なURL
• baseDomain
  • タイプ: string
  • 詳細: クッキーを保存する必要がある場合

{
  accountKey: '...',
  connect: {
    endpoint: 'https://store.com/api/connect.php',
    baseDomain: 'store.com'
  }
}

ユーザー識別子の保存
Fanplayrがユーザー識別子を保存する必要がある場合、保存する値を含む data クエリパラメータをAPIに含めてリクエストを行います。この値はURLエンコードされたJSON文字列です。例：

https://store.com/api/connect.php?data=%7B%22value%22%3A%221234%22%7D

• あなたのAPIは、選択した名前のセキュアなクッキーに以下の属性で値を書き込む必要があります。
  • Expires: (現在時刻から1年間)
  • HttpOnly
  • Secure
  • SameSite: Strict
  • Path: /
• あなたのAPIは、デコードされたJSON値を次のように返す必要があります。

{"value":"1234"}

ユーザー識別子の取得
Fanplayrがユーザー識別子を取得する必要がある場合、data クエリパラメータなしで同じAPIリクエストを行います。例： https://store.com/api/connect.php

• あなたのAPIは、前のステップで定義したクッキーから値を読み取り、デコードされたJSON値を次のように返す必要があります。

{"value":"1234"}

コード例

以下のコード例は、_fphu という名前のクッキーを使用してユーザー識別子を保存および取得する方法を示しています。

WARNING

Fanplayrのトラッキングコードがあるドメインとは別のサブドメインでこのAPIをホストしている場合、APIがCORSリクエストと互換性があることを確認する必要があります。

これは通常、APIレスポンスで以下のヘッダーを出力することで実現できます。

• Access-Control-Allow-Origin: https://store.com
  注：「https://store.com」をあなたのドメインに置き換えるか、その値が着信Originリクエストヘッダーの値と同じであることを確認する必要があります。
• Access-Control-Allow-Methods: OPTIONS, GET
• Access-Control-Allow-Headers: Origin
• Access-Control-Allow-Credentials: true