WebView内の行動をトラッキングする

WebView内の行動(ページ遷移など)をトラッキングしたい場合に、WebViewトラッキングの機能を利用することで実現可能です。

導入手順

coreモジュールの導入が必要です。
導入手順の詳細については SDKを導入する をご覧ください。

実装方法

WebViewトラッキングを行うためには、Webページ内に 計測タグ を設置する必要があります。

👍

WebViewトラッキングを行う上での考え方

Webページ側にKARTEの計測タグを設置してトラッキングを行う方が取得できる情報量が多いため、基本的には計測タグを設置してトラッキングを行う方法を推奨しております。

Webページ側に手を入れることが難しいなどの場合に限り、SDKを利用してトラッキングを行う方法をご利用ください。

1. Webページ内に計測タグを設置する

計測タグの設置方法については、セットアップしよう(ウェブ) をご覧ください。

なお、既にKARTEをご契約中でWebページに計測タグが設置されている場合は、このステップは不要です。

2. WebとAppのユーザーの紐付け処理を実装する

Webページに計測タグを設置することでページロードに合わせてトラッキングが行われるようになりますが、このままではネイティブSDKでトラッキングした情報(ネイティブアプリ内のユーザー行動)と、計測タグでトラッキングした情報(WebView内のユーザー行動)が、別のユーザー行動としてトラッキングされます。

ネイティブアプリ上の行動とWebページ上での行動を同一のユーザー行動としてトラッキングするために、それぞれのユーザーの紐付け処理を行う必要があります。

📘

紐付け処理によってできること

  • 紐付け前後のネイティブアプリ内のユーザー行動と、WebView内のユーザー行動が紐付く(紐付け後WebView内・ネイティブアプリ内のユーザー行動は同一セッションとして扱われます)
  • 計測タグが発行する全イベントの _source フィールドの値が native_app_webview となる
  • 計測タグが発行する全イベントのmetadataフィールド内に app_info フィールドが付与される

🚧

マルチドメインオプション利用時の注意点

WebとAppのユーザー紐付け処理はマルチドメインオプションによるクロスドメインでのユーザ統合機能の対象外となります

紐付け処理の実装について

JavaScriptを利用した紐付けの実装方法(推奨)

URLに余計なクエリパラメータを付与したくない場合は、JavaScriptを利用して紐付けを行うことが可能です。
SDKが用意しているヘルパーメソッドに WebView インスタンスを渡すことで、スクリプトの設定が行われます。

onPageStarted が呼び出されたタイミングでスクリプトを設定することで、紐付けが行われた状態でトラッキングが行われます。

override fun onCreate(savedInstanceState: Bundle?) {
  ...
  webView.webViewClient = object : WebViewClient() {
    override fun onPageStarted(view: WebView?, url: String?, favicon: Bitmap?) {
      super.onPageStarted(view, url, favicon)
      if (view == null) return
      UserSync.setUserSyncScript(view)
    }
  }
  ...
}
@Override
public void onCreate(Bundle savedInstanceState) {
  ...
  webView.setWebViewClient(new WebViewClient() {
    @Override
    public void onPageStarted(WebView view, String url, Bitmap favicon) {
      super.onPageStarted(view, url, favicon);
      UserSync.setUserSyncScript(view);
    }
  });
  ...
}

クエリパラメータを利用した紐付けの実装方法

SDKが用意しているヘルパーメソッドにロードするページのURLを渡すことで、紐付け処理に必要となるクエリパラメータを付加することができます。

紐付け用のクエリパラメータが付加されたURLをWebViewでロードすることにより、紐付けが行われた状態でトラッキングが行われます。

url = UserSync.appendUserSyncQueryParameter(url)
webView.loadUrl(url)
url = UserSync.appendUserSyncQueryParameter(url);
webView.loadUrl(url);

🚧

クエリパラメータの有効期限とリンクの扱いの注意点

クエリパラメータには1分の有効期限を設けており、有効期限が切れている場合は紐付けが行われません。
そのためページをロードする際は、URLに都度クエリパラメータを付与するようにしてください。

又、有効期限内のクエリパラメータつきのリンクを Safari や PC の Chrome などで開くと _source が意図せず native_app_webview で計測されます。
そのため、アプリ外でリンクを利用する場合は連携パラメータがついていないことを確認してください。
参考: https://support.karte.io/post/5p11ldZv1FiG7KAGtuO8y1#2-0

🚧

CustomChromeTabs等でのユーザ連携について

CustomChromeTabs等の外部ブラウザの機能をアプリ内WebViewのように使うことができますが、その際にはKARTEのユーザーの紐付けを行うことを推奨しません。
紐づけてしまった場合、Cookieが共有されてしまうことによりChrome等のブラウザからのKARTEイベントがアプリユーザのものと区別ができなくなってしまうためです。

外部ブラウザのユーザーとアプリのユーザーの紐付けはidentifyイベント等を用いて行ってください。
参考: https://support.karte.io/post/5p11ldZv1FiG7KAGtuO8y1#2-0

検証方法

管理画面のユーザーストーリー画面で、Webページ上での行動がネイティブアプリ上での行動として扱われているか確認してください。

計測タグ経由でトラッキングされた閲覧イベントに APP アイコンが付いていれば、ネイティブアプリ上での行動として扱われております。

📘

Webページ上での「閲覧(view)」以外のイベント計測について

計測タグを設置したWebページでは、デフォルトで「閲覧(view)」イベントが発生します。

それ以外のイベントをWebページ上から取得したい場合は、Webページ内にカスタムイベントタグを設置してください。「WebとAppのユーザーの紐付け処理」が実装されていれば、Webページ内での「閲覧(view)」以外のイベントもAppのユーザーに紐付きます。

詳細: カスタムイベントタグの設置 | KARTEサポートサイト

トラブルシューティング

WebViewの紐付け処理やWebView内に表示した接客で問題が起きた場合は以下ページをご確認ください。
WebView内の接客やWebView連携で問題が発生した時のチェックリスト

Updated 15 days ago

WebView内の行動をトラッキングする


Suggested Edits are limited on API Reference Pages

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