アクションテーブルにデータを格納すると、KARTE/KARTE TALKの接客サービスからリアルタイムにデータを参照することができます。
本ページではそのやり方についてサンプルを使って説明します。

サンプルケース

  • 商品の購入数ランキングを週次で集計し、そのランキング結果を接客サービスとしてサイト上に表示したい

設定手順（例）

商品マスタデータを準備する

まず、商品のマスタ情報を準備します。
今回の例では、以下のフォーマットのCSVファイルを用意します。

フィールド名 型
item_id STRING
name STRING
image STRING
url STRING
  • 注意点
    • ※ buyイベントで計測しているitem_idとcsvファイルのitem_idが一致している必要があります

テーブルを作成する

  • グローバルメニューから[Datahub > データセット]画面を開きます
  • [作成 > データセットを作成]から、サンプルデータを格納するデータセットを新規作成します
    • データセット名: item_master_test
    • ※別の名前を設定した場合は、後述するクエリの中のデータセット名も合わせて変更して下さい
  • 作成したデータセットを開き、[テーブルを作成] からテーブルを新規作成します
    • テーブル名： item_master
      • ※別の名前を設定した場合は、後述するクエリの中のテーブル名も合わせて変更して下さい
    • スキーマを指定して作成: チェックを付ける
    • スキーマ（テキスト）: item_id:STRING,name:STRING,image:STRING,url:STRING

null

データセットにデータをインポートする

  • 作成したテーブルをクリック
  • csvファイルからインポートを選択し、csvファイルをアップロード

ランキングデータ抽出用のクエリを書く

KARTEのタグで取得した購入イベントデータとデータテーブルにインポートした商品のマスタデータを用いて、ランキングデータ集計用のクエリを書いていきます。

  • グローバルメニュー > Datahub > クエリ画面から「作成」→「クエリを作成」をクリック
  • 「SQLエディタ]に下記を入力
WITH analysis_data AS (
  SELECT
    user_id
    , JSON_QUERY(VALUES, '$.buy.items') AS items
  FROM {% karte_event period[0], period[1] %}
  WHERE
    event_name = 'buy'
    AND JSON_QUERY(VALUES, '$.buy.items') IS NOT NULL
)
, convert_to_array AS (
    SELECT
      user_id
      , SPLIT(SUBSTR(items, 2 , LENGTH(items) - 2), '},{') AS items
    FROM
      analysis_data
  )
, unnested AS (
    SELECT
      user_id
      , item
    FROM
      convert_to_array, UNNEST(items) AS item
)
, restored_to_json AS (
    SELECT
      user_id
      , CONCAT('{', REPLACE(REPLACE(item, '{', ''), '}', ''), '}') AS item
    FROM
      unnested
)
, dataset AS (
    SELECT
      JSON_VALUE(item, '$.item_id') AS item_id
      , JSON_VALUE(item, '$.quantity') AS quantity
    FROM
      restored_to_json
)
, aggregate_data AS (
    SELECT
      item_id
      , SUM(CAST(quantity AS INT64)) AS sum_quantity
      , COUNT(*) AS cv_count
    FROM
      dataset
    GROUP BY
      item_id
)
, item_master AS (
    SELECT
      item_id
      , name
      , image
      , url
    FROM `prd-karte-per-client.item_master_test_{{api_key|safe_param}}.item_master` --データセット名およびテーブル名は必要に応じて書き換えて下さい
)

SELECT
  a.item_id
  , i.name
  , i.image
  , i.url
  , RANK() OVER (ORDER BY a.sum_quantity DESC) AS ranking
  , a.sum_quantity AS cv_count
FROM aggregate_data AS a
INNER JOIN item_master AS i
  ON a.item_id = i.item_id
ORDER BY ranking
  • [パラメータエディタ]に下記を入力
period:
  type: period
  label: 抽出期間
  default: past 7 day
  • クエリ名を「商品ランキングデータ抽出」として保存
  • クエリを実行し、問題なく結果が返ってくることを確認

アクションテーブルを作成する

  • グローバルメニュー > アクション > アクションテーブル画面右上の「作成」→「空のテーブルを作成」をクリック
  • 以下の設定を行います
    • テーブル名：任意の名前を入力
      • 今回はranking_weeklyとしています
    • スキーマ設定：上記クエリ結果のスキーマを指定
    • 権限：今回は参照のみなので「ウィジェットからの参照」にチェック

null

アクションテーブルにクエリ結果を移行する

  • グローバルメニュー > データハブ > ジョブフロー画面右上の「作成」をクリック
  • ジョブ設定画面から以下を設定し、右上の「保存して完了」をクリック
    • ジョブの設定
      • ジョブ名：任意の名前を入力
        • 今回は「商品ランキングをアクションテーブルへ」
      • ジョブタイプ：データテーブルからエクスポート
      • エクスポート元：上記で作成したクエリ名を選択
      • エクスポート先：先程作成したアクションテーブルを選択
    • 実行方法を選択
      • 今回の例では週次でランキングデータを更新したいので、「繰り返し実行を有効にする」にチェックを入れ、実行頻度を「1週ごと」に設定
    • ジョブフローの設定
      • ジョブ実行後に対象のジョブをアーカイブしたい場合には「ジョブ実行終了後にアーカイブ」にチェックを入れます
      • ジョブフロー名：任意の名前を入力

null

アクションテーブルクエリを作成する

接客サービスからアクションテーブルのデータを取得するには以下の2種類の方法があります。

  • 主キーを指定してレコード取得する
  • アクションテーブルクエリを使ってレコード取得する

今回の場合はランキング上位のものを表示したいので、主キーの指定ではなくアクションテーブルクエリから参照する必要があります。

  • 参照したいアクションテーブルを選択し、画面右の「作成」をクリック
  • 以下の設定を行い、完了をクリック
    • クエリ名：任意ですが、今回はfind_allと設定
    • 抽出条件：今回の例ではランキングの上位3件のレコードを抽出したいので、以下の条件で設定します。
      • Limit:3
      • Sort：ranking 昇順

null

これでアクションテーブルクエリの作成は完了です。

接客サービスからデータを参照する

  • 接客サービス作成画面に遷移して「新規作成」
    • 今回は「Image List vertical 0」のテンプレートを利用しています
      • ユーザーに見せる -> 画像付きリスト（縦） -> Image List vertical 03

null

  • 接客サービス編集画面 -> カスタマイズ -> Script から以下のスクリプトを記載してアクションテーブルのデータを取得します。
var table = widget.collection('v2/ranking_weekly');
table.getByQuery('find_all', {}, function(err, items){
    widget.setVal('items', items);
    widget.show();
});
<!-- リンクリスト -->
<ul class="card-list _fit-card list-link">
    <li krt-for="item in items">
        <a krt-bind:href="item.url">
            <div class="rank-num">{{item.ranking}}位</div>
            <figure class="link-image radius-circle"
                    style="width:46px"
                >
                <img krt-bind:src="item.image" alt="">
            </figure>
            <div class="link-body">
                <h2 class="link-heading">{{item.name}}</h2>
            </div>
            <i class="link-arrow #{iconArrowRight}" aria-hidden="true"></i>
        </a>
    </li>
</ul>

このような形で表示することが可能です。

null

設定は以上で完了になります。
あとは従来の接客サービスと同じフローで配信設定を行ってください。