Guides

WebViewのトラッキングを行う

Suggest Edits

🚧

このドキュメントは古いバージョンのAndroid SDK v1について記載しています

Android SDK v1は 2021/05/11でサポート終了となります。
SDK v1 からのアップグレードについては、まず SDK v1からv2のアップグレード方法 をご覧ください。

WebView内のユーザーの行動をトラッキングする方法として、現在2種類方法を提供しております。

  • Webページ内に計測タグを設置してトラッキング（推奨）
  • ネイティブアプリSDKを利用してトラッキング

なお「Webページ内に計測タグを設置してトラッキング」の方が、実装の手間が少なく、取得できる情報量も多いため、こちらで実装することを推奨致します。

Webページ内に計測タグを設置してトラッキングを行う（WebView連携）

Webページ内に計測タグを設置してトラッキングを行う場合、以下のステップで実装を進めます。

  1. Webページ内に計測タグを設置する
  2. WebとAppのユーザーの紐付け処理を実装する
  3. 動作検証

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

計測タグの設置方法については こちら を参考にして下さい。

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

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

計測タグを設置しただけでは、ネイティブアプリSDKでトラッキングした情報と、計測タグでトラッキングした情報は、それぞれ別のユーザーの行動として扱われます。
そのため紐付け前後の WebView 内のユーザー行動と、ネイティブアプリ内の行動を統合するために、ユーザーの紐付け処理を実装する必要があります。

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

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

🚧

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

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

紐付け処理の実装方法
現在2つの紐付け方法を提供しており、いずれかの方法により実装を行なってください。

  • スクリプトを利用した紐付け（Android 4.4 以降で利用可能）
  • クエリパラメータを利用した紐付け

スクリプトを利用した紐付け

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
      TrackerJsUtil.setUserSyncScript(view.context, 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);
      TrackerJsUtil.setUserSyncScript(view.getContext(), view);
    }
  });
  ...
}

クエリパラメータを利用した紐付け

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

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

url = TrackerJsUtil.appendUserSyncQueryParameter(this, "YOUR_APP_KEY", url)
webView.loadUrl(url)

url = TrackerJsUtil.appendUserSyncQueryParameter(this, "YOUR_APP_KEY", url);
webView.loadUrl(url);

🚧

クエリパラメータの有効期限について

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

3. 動作検証

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

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

1158

ネイティブアプリSDKを利用してトラッキングを行う

ネイティブアプリSDKを利用してトラッキングを行う場合、基本的にはWebView内のページ遷移をトリガーにトラッキングを行います。

val url = "https://plaid.co.jp"
webView.loadUrl("$url?_karte_tracker_deactivate=true")
webView.webViewClient = object : WebViewClient() {
  override fun onPageFinished(view: WebView?, url: String?) {
    view?.let {
      try {
        Tracker.getInstance(it.context).view("webview", it.title, JSONObject().put("url", url))
      } catch (e: JSONException) {
        e.printStackTrace()
      }
    }
  }
}

String URL = "https://plaid.co.jp";
webView.loadUrl(URL + "?_karte_tracker_deactivate=true");
webView.setWebViewClient(new WebViewClient() {
  @Override
  public void onPageFinished(WebView view, String url) {
    try {
      Tracker.getInstance(view.getContext(), APP_KEY)
        .view("webview", view.getTitle(), new JSONObject().put("url", url));
    } catch (JSONException e) {
      e.printStackTrace();
    }
  }
});

なおWebページ内に計測タグが設置されている場合は、WebとAppで別々のユーザーの行動としてトラッキングが行われてしまいます。
これを防ぐために、Webページ内の計測タグを無効にする実装を追加する必要となります。

WebView で開くページの URL にクエリパラメータとして _karte_tracker_deactivate=true を付加してください。

Updated 12 months ago