KARTE Liveでは、録画用スクリプトの読み込みと実行をするための接客サービスを配信します。
こちらの記事ではその機能詳細について記載しております。
配信までの初期セットアップの流れについてはこちらの記事をご確認ください。

ユーザー行動録画の方法について

概要

録画用スクリプト（JavaScript）をエンドユーザーのブラウザ上で実行すると、HTMLの変更やマウスのイベントを検知してその情報が保存用のサーバーに送信されるようになります。再生する際にはその情報を元に、管理画面上の再生画面で同じHTMLを生成し再現します。

従って、現状の仕様では外部リソース（htmlからリンクで呼んでいるもの）は保存していないため、元のリンクが切れたら表示がなされません。リンク画像がなくなったり、リンクされているcssに変更があるとスタイルが崩れる可能性があります。

仕様の詳細・個別シーンについてご質問がある場合には担当者までお問合せください。

録画の対象

前述の通り、KARTE Liveでは接客サービスとしてスクリプト配信（以下KARTE Live用スクリプト)を行います。
従って、通常の接客サービスと同様にセグメントや配信トリガーを指定することで、特定のページや特定のユーザーのみを録画の対象とすることができます。

録画セッション

KARTE Liveで表示される動画はセッションの単位です。
Live_sessionという独自のセッションを用いており、下記の条件発生時に新しいセッションに切り替わります。

  • 2分間、該当ユーザーに新たなイベントがまったく発生しなかったタイミング
  • 録画開始から3時間(180分)経過したタイミング

録画の保存期間

録画は過去60日分(※)のみ保存されます。60日を超えると録画が実行されていても再生ができなくなりますので、ご注意ください。

※2020/2/12以降に保存されたデータが対象です。
それ以前に保存されたデータは以前同様、28日間（4週間）の保存期間です。

マスキングについて

前提

KARTE Liveでは個人情報保護の観点からページ情報をマスキングすることが可能です。
また、マスキングの箇所を部分的に解除する(unhiddenSelectoreの活用)ことも可能です。
仕様として、お客様任意で設定いただく箇所(hiddenSelectorの活用)とデフォルトでマスキングがかかる箇所があります。

ページ情報のマスキング（お客様任意で設定の箇所）

マスキングの設定方法

読み込んだKARTE Live用スクリプトを実行する際にマスキング用のCSSセレクタを１つ設定します。
具体的にはスクリプトのマスキング対象要素(hiddenSelector: '',)部分にCSSセレクタを記述します。

複数セレクタを指定したい場合はカンマ区切りのセレクタを使用することになります。

null

マスキングの内部動作

KARTE Live用スクリプト内部で、セレクタにマッチする要素の中身（子要素含む）と、その要素のvalue, placeholder, checked, src, data, alt属性の値をサーバに送信しない、というロジックとなっています。

推奨する方法

マスキング対象を明示的にするため、マスキング用のclassを1つ決め、隠したい要素に対してそのclassを指定し、KARTE Live用スクリプトにそのclassだけ設定することを推奨しています。
（:nth-child(n)（n番目の要素）など、サイトの構造を変更したときにずれてしまう可能性があるようなセレクタは非推奨としています。）

ページ情報のマスキング（デフォルトで設定の箇所）

該当箇所

ユーザーのセキュリティ保護の観点からフォームへの入力情報(input[type="xx"]の大部分がデフォルトのマスキングの対象となります。

具体的には下記のセレクタに該当するものが対象です。

'.krt-hidden',
"input:not([type='submit']):not([type='button'])",
'textarea',
'select',
`.krt-hidden`に関しては**上記のインプット系のセレクタに該当するもの以外でデフォルトでマスキングをかけておきたいケース**でWebサイト側の該当要素に`.krt-hidden`を追加して活用するものです。別途Webサイト側に修正が必要となるため、その点ご注意ください。    
"input:not([type='submit']):not([type='button'])" は input要素でもsubmitやbutton typeのものは除いていることを示しています。
ユーザーがフォームに入力する情報(パスワード/クレジットカード情報等)であっても、input要素にマッチしない場合はマスキング対象とはなりませんのでご注意ください。
従って、事前のテスト配信による挙動確認を行ってください。またマスキングされない場合の対処としては、対象のセレクタ自体をマスキングの対象として任意で指定いただく、対象の情報が含まれるページを配信対象外とする、などの方法があります。

ページ情報のマスキング解除

マスキングがかかるフォーム入力情報の箇所のユーザー行動をKARTE Liveで見たい場合、マスキングを解除することが可能です。

具体的にはKARTE Live用スクリプトのマスキング除外要素(unhiddenSelector: '',) 部分にマスキングを解除したいCSSセレクタを記述します。

複数セレクタを指定したい場合は任意の箇所にマスキングを設定する時と同様に、カンマ区切りのセレクタを使用することになります。

null