The Sprocket Developer Hub

The Sprocket Developer Hub

Sprocket の developer hub にようこそ。このサイトでは API 仕様や JavaScript タグ仕様など、Sprocket を活用していただくうえでの技術情報が掲載されています。適宜参照しながら Sprocket をご活用ください。

    

カート内データタグ

EC サイトのカート内データの情報を Sprocket に連携して、接客のセグメント条件に活用するための JavaScript 形式のデータ連携タグです。

主な活用方法

・カートが空でないユーザーにお得なセール情報を表示して、アップセル訴求する
・送料無料が適用されていないユーザーに送料無料条件を表示して、アップセル訴求する
・カートの金額が一定金額に達していないユーザーにクロスセル商品をおすすめる

タグの設置場所

カートの最新状況を把握できるように、カートページや購入完了ページでタグを出力してください。購入完了ページでは、通常、カートデータが空のカート内データタグを出力します。

データ項目

フィールド名(Key)

概要

値(Value)のサンプル

セグメント条件での使用

totalAmount

購入金額
※送料、消費税を含む金額を推奨

7350

数値
※必須項目

quantity

購入商品数

2

数値

hasItems

カートに商品がある場合: true
カートに商品がない場合: false

true

ブーリアン

isFreeShipping

送料無料:true
送料無料でない:false

true

ブーリアン

items

itemsというキーに個別商品データの配列をセットしてください。

[
{
itemId: '4774192627',
name: 'Amazon Web Services負荷試験入門',
price: 3800,
quantity: 1,
category: 'book',
brand: '技術評論社'
},
{
itemId: '4295000159',
name: 'いちばんやさしいコンバージョン最適化の教本',
price: 1922,
quantity: 1,
category: 'book',
brand: 'インプレス'
}
]

配列

items[].itemId

アイテムに振られる任意のIDです。例として SKU ID などを想定しています。

'4295000159'

文字列

items[].name

商品名

'いちばんやさしいコンバージョン最適化の教本'

文字列

items[].price

商品価格
※税抜を推奨

1922

数値

items[].quantity

購入商品数

2

数値

items[].category

商品カテゴリ

'book'

文字列

items[].brand

商品ブランド

'インプレス'

文字列

🚧

バリデーション仕様(全タグ共通)

以下に該当する場合、エラーとなり全てのプロパティが送信されません。

  • フィールド名(Key)が不適切な場合

    • データ項目定義に存在しないフィールド名がある
  • 値(Value)が不適切な場合

    • 文字列(「ISO8601拡張形式」、「ISO8601拡張形式、日付のみ」を含む)/数値/論理型のデータ型が異なる(エラーの例: totalAmount: "1" ※数値型を期待しているが、文字列が出力されている)
      なお以下のケースでは Sprocket がキャスト処理を行うことによりデータが送信されます。(救済措置)

      文字列型の項目に数値型が入力された場合
      文字列型にキャストしてデータが送られます。
      ※ ただし、値(Value)が空文字列の場合は、フィールド名(Key)が無いものとして扱うためデータは送られません。

      数値型の項目に文字列型が入力された場合
      数値型にキャストした後、文字列型に戻して値が一致する場合のみ、数値型でデータが送られます。
      ※ ただし、値(Value)が空文字列の場合は、キャスト処理が行われずエラーとなるため、データは送られません。

      ブーリアンの項目に文字列型が入力された場合
      文字列で「true」、「false」と一致する場合は、ブーリアンとして解釈し、データが送られます。

    • 文字列(ISO8601拡張形式) の形式エラー

    • 文字列(ISO8601拡張形式、日付のみ) の形式エラー(エラーの例: birthday: '2019-01-01T12:00:00+09:00' ※時刻が含まれている)

    • 値に null が含まれる

    • 文字列長が64文字より大きい(ただし、 ユーザー属性タグuserId を除く。)

🚧

カート内データタグについての補足説明

  • データ連携タグは Sprocket タグより後に発火するように設置してください
  • totalAmount は必須項目です。項目が存在しない場合はエラーとなり、データが送信されません。
  • totalAmountitems[].price は値が 0 でもバリデーションエラーにはならず、データが送信されます
  • サポートしている文字コードは UTF-8 です

JavaScript サンプル

個別商品データはサンプルの様に配列として変数にセットしてください。ファンクション SPSDK.record() の第1パラメータに固定文字列 'cart' を、第2パラメータに配列でデータ項目を設定します。

カート内に商品がない場合

<script type="text/javascript">
(function() {
  var items = [];
  var props = {
    totalAmount: 0,
    quantity: 0,
    hasItems: false,
    isFreeShipping: false,
    items: items
  };
  console.log('Sprocket: Cart props:\n' + JSON.stringify(props, null, '  '));
  SPSDK.record('cart', props);
})();
</script>

カート内に商品がある場合

<script type="text/javascript">
(function() {
  var items = [
    {
      itemId: '4774192627',
      name: 'Amazon Web Services負荷試験入門',
      price: 3800,
      quantity: 1,
      category: 'book',
      brand: '技術評論社'
    },
    {
      itemId: '4295000159',
      name: 'いちばんやさしいコンバージョン最適化の教本',
      price: 1922,
      quantity: 1,
      category: 'book',
      brand: 'インプレス'
    }];
  var props = {
    totalAmount: 7350,
    quantity: 2,
    hasItems: true,
    isFreeShipping: false,
    items: items
  };
  console.log('Sprocket: Cart props:\n' + JSON.stringify(props, null, '  '));
  SPSDK.record('cart', props);
})();
</script>

🚧

注意事項

  • 必ず Sprocket タグの読込みより後にデータ連携タグが実行されるように実装してください。
    Sprocket タグの読み込みが完了していない状態でデータ連携を実行した場合、データが送信されません。タグマネージャなどで非同期に Sprocket タグを読み込んでいる場合は特にご注意ください。

データ連携タグの実行順が保証できない場合

Sprocket タグが読み込まれてからデータ連携を実行する処理を組み込んでください。コード例は下記です。

カート内に商品がない場合

<script type="text/javascript">
(function() {
  var count = 0;
  setTimeout(function wait() {
    if (++count > 10) return;
    if (typeof SPSDK === 'undefined') return setTimeout(wait, 500);
    var items = [];
    var props = {
      totalAmount: 0,
      quantity: 0,
      hasItems: false,
      isFreeShipping: false,
      items: items
    };
      console.log('Sprocket: Cart props:\n' + JSON.stringify(props, null, '  '));
    SPSDK.record('cart', props);
  }, 500);
})();
</script>

カート内に商品がある場合

<script type="text/javascript">
(function() {
  var count = 0;
  setTimeout(function wait() {
    if (++count > 10) return;
    if (typeof SPSDK === 'undefined') return setTimeout(wait, 500);
    var items = [
      {
        itemId: '4774192627',
        name: 'Amazon Web Services負荷試験入門',
        price: 3800,
        quantity: 1,
        category: 'book',
        brand: '技術評論社'
      },
      {
        itemId: '4295000159',
        name: 'いちばんやさしいコンバージョン最適化の教本',
        price: 1922,
        quantity: 1
        category: 'book',
        brand: 'インプレス'
      }];
    var props = {
      totalAmount: 7350,
      quantity: 2,
      hasItems: true,
      isFreeShipping: false,
      items: items
    };
    console.log('Sprocket: Cart props:\n' + JSON.stringify(props, null, '  '));
    SPSDK.record('cart', props);
  }, 500);
})();
</script>

Updated 5 months ago

カート内データタグ


EC サイトのカート内データの情報を Sprocket に連携して、接客のセグメント条件に活用するための JavaScript 形式のデータ連携タグです。

Suggested Edits are limited on API Reference Pages

You can only suggest edits to Markdown body content, but not to the API spec.