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

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

導入手順

KarteCoreモジュールの導入が必要です。
導入手順の詳細については 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のユーザー紐付け処理はマルチドメインオプションによるクロスドメインでのユーザ統合機能の対象外となります

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

SDKでは2つの紐付け方法を提供しています。
なお利用しているWebViewにより利用可能な紐付け方法が異なりますので、ご注意ください。

ユーザースクリプトを利用した紐付けの実装方法(推奨)(WKWebView)

WKWebViewを利用している場合は、 WKUserScript を利用した紐付け処理が可能です。
SDKが用意しているヘルパーメソッドに WKWebView インスタンスを渡すことで、ユーザースクリプトの設定が行われます。

ユーザースクリプトの設定が行われたWebViewでページをロードすることにより、紐付けが行われた状態でトラッキングが行われます。

override func viewDidLoad() {
  super.viewDidLoad()
  let webView = WKWebView(frame: .zero)
  ...
  // 連携用のユーザースクリプトをWebViewに設定する
  UserSync.setUserSyncScript(webView)
  
  // ユーザースクリプトを設定した後で、ページのロード処理を行う
  if let url = URL(string: "https://example.com") {
    let request = URLRequest(url: url)
    webView.load(request)
  }
}
- (void)viewDidLoad {
  [super viewDidLoad];
  WKWebView *webView = [[WKWebView alloc] initWithFrame:CGRectZero];
  ...
  // 連携用のユーザースクリプトをWebViewに設定する
  [KRTUserSync setUserSyncScriptWithWebView:webView];
  
  // ユーザースクリプトを設定した後で、ページのロード処理を行う
  NSURL *URL = [NSURL URLWithString:@"https://example.com"];
  NSURLRequest *request = [NSURLRequest requestWithURL:URL];
  [webView loadRequest:request];
}

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

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

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

if let baseUrl = URL(string: "https://example.com") {
  // 連携用のパラメータを付与したURLを取得
  let url = UserSync.appendingQueryParameter(baseUrl)
  
  // 連携用パラメータが付与されたURLを利用して、ページのロード処理を行う
  webView.loadRequest(URLRequest(url: url))
}
NSURL *baseURL = [NSURL URLWithString:@"https://example.com"];

// 連携用のパラメータを付与したURLを取得
NSURL *URL = [KRTUserSync appendingQueryParameterWithURL:baseURL];

// 連携用パラメータが付与されたURLを利用して、ページのロード処理を行う
NSURLRequest *request = [NSURLRequest requestWithURL:URL];
[webView loadRequest:request];

🚧

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

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

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

🚧

WebView内で発生したイベントをトリガーに接客を配信する際の注意点

WebView内で発生したイベント(_sourcenative_app_webview のイベント)をトリガーに配信される接客サービスはSDKではなくアプリが管理するWebViewにアクションが表示されます。
WebViewがWKWebViewの場合、そのままではアクション内のURLスキームが自動で処理されません。URLスキームを処理するためにはWKWebViewのnavigationDelegateの実装が必要となります。

検証方法

管理画面のユーザーストーリー画面で、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.