以下のケースごとに、設定内容を確認してください。

閲覧しているページが録画されていない

配信設定しているはずのページが録画されていない時、次のチェックリストをご確認ください。

1-a: Live用のスクリプト接客設定の確認

次の各項目の設定が正しいかどうかを確認してください。

  • 対象ユーザー・対象イベントの確認

配信対象セグメント、配信対象ページの条件に合致しているかどうかを確認します。
例えばTOPページのみ等、特定ページだけ指定した場合は、他のページではスクリプトが配信されず他のページの閲覧動画は見られない状態となります。

  • 同時配信設定の確認

「同時配信を有効にする」にチェックを入れておく必要があります。これが設定されていない場合、他の接客配信の影響を受けるため正しく配信されない可能性があります。
同時配信設定の詳細についてはこちらの記事もご確認ください。

※本来、KARTEのスクリプトタイプの接客サービスは仕様により「アクセス毎」「同時配信OK」設定が固定されていますが、旧タイプのLive用のスクリプトでは上記固定がされていない場合があります。

1-b: 対象ユーザーのブラウザが古くLive解析対象になっていない

KARTE Liveにはエンドユーザーのブラウザ・環境にとって対象とならないケースがあります。
詳細はこちらのサポート記事をご確認ください。

1-c: Liveの閲覧権限がない

KARTE Liveではアカウントが管理者、またはLiveの管理/閲覧権限を持っている場合のみ動画閲覧が可能となります。

Live動画再生のアイコン上で「閲覧権限がありません」表示が出ている場合、アカウントが動画を閲覧できる権限になっていません。管理者メンバーに問合せていただき、権限を変更する必要があります。

1-d: 動画の保存期限が過ぎている

KARTE Liveでは保存した動画データに保存期限があります。保存期限を超えた動画データを閲覧することはできません。

  • 無償版: 1日(24時間)
  • 有償版: 60日

期間はご契約のプランによって上記の通り変動しますが、期間を超えると動画データは自動的に削除されます。

その場合、
Live動画再生のアイコン上で「保存期間が終了しました」と表示されます。

1-e: 配信上限を超過して動画データ生成が止まっている

KARTE Liveの無償版では1,000PV/1日の上限値が設定されています。
※有償版の場合はご契約ごとにPV上限数が異なります。
配信したLiveスクリプトがこの上限を超えると、その時点で動画データの生成は停止します。

データ生成が停止しているかどうかについては、
ライブリプレイ画面・ライブ設定画面それぞれで確認が可能です。

詳細の方法はこちらのFAQ：ライブ動画のデータ容量上限に至って動画生成が停止しているかどうかはどこで確認できますか？もご参照ください。

1-f: trackerの変数名を別のものに変更している

KARTEを導入いただく際に、個社個別の理由でオブジェクトの名称を変更することがあります。
（詳細についてはこちらをご確認ください: 計測タグのtracker名を変更する ）

変数名を別のものに変更している場合は、KARTE Liveのスクリプト編集画面上でもtracker名称を揃える必要があります（デフォルトのtrackerのままでは作動しません）。

tracler名称が揃っていない状態でスクリプトを配信すると_live_script_errorイベントが発生します。api_key is undefined のエラーメッセージが出るので原因特定用にお使いください。

null

1-g: KARTEの計測タグの設置確認

KARTEの計測タグが埋め込まれていないページにはLive用のスクリプトも配信されないため、録画されません。

1-h: Web-Appの両プラットフォームでKARTEを導入しているケース

Webサイトとスマホアプリの両プラットフォームでKARTE, KARTE for Appを導入いただいている場合、
ユーザーが両プラットフォームをまたいで行動することが発生するケースもあり得ると思います。

上記KARTEプロジェクトの場合、通常KARTE Live用スクリプトの配信トリガーをWEBと設定しているため、
アプリ利用時の閲覧行動は一切録画されません。
※KARTE Liveは現状スマホアプリ未対応の機能です。

null

1-i: Liveスクリプトで設定しているCSSセレクタに間違いがある（エラーが起きている）

KARTE Liveではサイト上の要素に追加でマスキングを設定したり、デフォルトのマスキング要素を解除することができます（詳細はこちら）。

但し、設定したCSSセレクタの記述が間違っている場合、Liveスクリプトは配信されません
Liveの動画も当然作成されないため動画が見れない状態となります。

この場合、該当ユーザーにKARTE上で下記のイベント・値が発生することの確認ができた場合は、CSSセレクタの設定を見直してください。

  • イベント名: _live_script_error
  • フィールド名: error_message
  • 値: Failed to execute 'matches' on 'Element'　または、The string did not match the expected pattern.
    後者はsafari固有のエラーメッセージですが状態としては同じものです。

1-j: 古いバージョンのKARTE Liveスクリプトを使っている

2019年以前のKARTE Liveスクリプトを活用すると、サイト上で以下のエラーが発生します。
Uncaught Error: invalid parameter

配信するスクリプトを最新のものにすることでエラーが解消され、動画が生成されるようになります。
最新のスクリプトは以下どちらかの方法で選択できます。

  • 接客サービス作成 > スクリプトを実行する > KARTE Live用スクリプト(v2)を選択

再生開始後、すぐに動画が止まる

2-a: 対象イベント設定がアクセス毎になっていない

旧タイプのLive用のスクリプト配信接客サービスの設定において、対象イベントの設定が「セッション毎」「ユーザー毎」となっている可能性があります。
「アクセス毎」を選択しなかった場合、そのセッションの最初のアクセスページしかスクリプトが配信されず、以降のページ遷移時は録画されません。

2-b: 同時配信設定がNGになっている

「同時配信を有効にする」にチェックを入れておく必要があります。これが設定されていない場合、他の接客配信の影響を受けるため正しく配信されない可能性があります。

2-c: 特定のエラーが発生している

エラーの確認時には、
Google Chrome上で右クリックから「検証」もしくは「要素の検証」を開いた状態で、「Console」タブを開きます。

そこでe.replaceAll is not a functionのエラーが出ている場合、お使いのChromeブラウザが最新ではなく、それが原因となっている可能性があります。

対応策としては、一度Chromeのバージョンを最新版までアップデートしてください。
アップデート後に、再生できない事象が引き続き発生するかをご確認ください。

Liveで再生した動画が崩れて表示される

前提

KARTE Liveでは、ユーザーの行動を再現するときに、cssやimgなど、ページ内でロードしているデータについては、録画時に取得せず、再生時にKARTEサーバからクライアント側のサーバに直接アクセスすることで取得しています。
従って、クライアント側のサーバでアクセス拒否が行われると、cssやimgを取得できないままLiveが表示されます(ページのhtmlのみが表示され崩れたように見えます)。

したがって、開発環境/ステージング環境でKARTE Liveを試す時は多くの場合、cssやimgは取得できずにページのhtmlのみが表示されます。

対応方法

まずはConsoleの確認を行ってください。
Google Chrome上で右クリックから「検証」もしくは「要素の検証」を開いた状態で、「Console」タブを開きます。

3-a: 下記いずれかのエラーが出ている場合

  • 403 (Forbidden)
  • 504 (GATEWAY_TIMEOUT)

前提部分に記載した事象発生の可能性が高いです。
解決策としては以下の2つがあります。

  1. 企業様サーバ側での処理を行う
  2. KARTE上での通信設定を変更する

1. 企業様サーバ側での処理
システムを担当されている部署や企業様側にてKARTEサーバからのアクセス疎通処理を行う必要があります。下記の文章を参考に依頼をお願いします。

KARTEサーバーからの接続を許可する設定をお願いします。
具体的には、KARTEサーバーからのアクセスはUserAgentに「KarteBot」という文字列が含まれるものが対象です。

また、アクセス元のIPアドレスは以下のドキュメントに記載の範囲に固定している為IPアドレスによる制限がある場合は許可リストへの登録をお願いします。
https://developers.karte.io/docs/static-server

2. proxyを通さずに通信する設定について
システム部門側でのサーバー設定変更対応が難しい場合、
KARTE Live側の設定でproxyを経由せずにcssやimageの情報を取得することが可能です。

具体的な設定方法についてはこちらの記事をご参照ください。

3-b: proxyを通さずに通信する設定を行っても動画が再生されないケースについて

こちらのケースでも同様にconsoleの確認を行ってください。

404エラーが出ている場合、再生対象動画の当時の外部リソース（CSSファイル)が現在時点で既にクライアント(貴社)Webサイトのサーバーに存在していない可能性が考えられます。
例えば、新しいCSSファイルのリリースにより古いファイルが更新されて消えてしまった場合などが該当します。

KARTE Liveではこの問題に対処するために自動でCSSルールのキャプチャリングを行なっており、ファイルが参照できない状態でもスタイルの再現を可能にする仕様があります。
ただし、1ファイルあたりのCSSルール数が多すぎる場合クライアントサイドでの負荷を考慮して処理を停止する様になっております。

その為対応策としては、

  • 1CSSファイルあたりのルール数を分割し減少させる（目安は最大3,000ルール程度）
  • サーバー側で古いCSSファイルも保持し続けるように処理を変更する

などが必要になります。

また、サイトの実装でCSS in JSライブラリを使用している場合に、エラー等は出ずに表示崩れが起きているケースもあります。
styled-componentsなどをはじめとする代表的なCSS in JSライブラリについては、プレイヤー上でのスタイル再現をサポートしていますが、CSS in JSライブラリをご利用されていてプレイヤー上で正常にCSSが適用されない場合はサポートまでお問い合わせ下さい。

3-d: それ以外のエラーやワーニングが出ている場合

該当のConsoleをキャプチャしていただき、弊社サポートにご連絡ください。
追加の調査を行います。

Liveの画面が真っ白になる

対応方法

サイトで利用されている Prototype.js というライブラリのバグに起因している可能性があります。
Prototype.jsのバージョンが1.7.0未満ですと本事象は発生し得ます。

確認方法は下記です。

  • サイト上でconsoleを開いて、console上でPrototypeと入力します
    ↓
  • バージョン情報が表示されるため、そこで確認します

解決方法としては下記があります。

なおPrototype.jsのバグについては、こちらをご参照ください。
https://github.com/prototypejs/prototype/issues/327

ブラウザのコンソール画面にエラーが表示される

ネットワーク状況によってまれに上記のエラーがコンソール画面に表示されますが、録画には影響がございません。

live config fetch Error: Timeout of 500ms exceeded

関連ドキュメント