# H5 と APP SDK の連携
# 紹介
APPでは、一部のページがH5で構成されている場合があります。現時点では、APP SDKはH5ページのデータを収集できませんが、JavaScript SDKを経由して、H5ページでのユーザーの行動を収集できます。JavaScript SDK と APP のデータは一貫させるために、新しいバージョンの SDK にはデータ接続機能が追加されています。
H5 ページはデータ収集に JavaScript SDK を使用し、収集されたデータは直接送信されず、APP SDK (Android SDK および iOS SDK) を介してサーバーに送信されます。 APP SDK は、JavaScript SDK によって収集されたデータを調整します：
- JavaScript SDK によって渡された
#timeを保持します。イベントの時間は、トラッキングがトリガーされた時間に基づいています。 - APP SDK によって使用されているユーザー体系に従って、APP SDK の
#account_idおよび#distinct_idを使用します。 - APP SDK のプリセット プロパティを追加する時に、JavaScript のプリセット プロパティと異なる場合は、APP SDK のプリセット プロパティは
#libフィールドなどの値を上書きし、APP SDK の値は JavaScript SDK の値を上書きします。 - APP SDK の共通プロパティ: JavaScript によって送信したプロパティと異なる場合、元の共通プロパティの値は破棄されます; JavaScript SDK にこのプロパティがない場合は、送信されたデータに追加されます。
- APP SDK の
timeEventインターフェイスは、JavaScript SDK によって収集されたイベントに影響を与えることができます。 - JavaScript SDK のlogin、logout、identifyのインターフェイスは、APP SDK のユーザー ID を変更できません。H5 と APP SDK が接続されている場合、JavaScript SDK の上記のインターフェイスを介してデータのユーザー ID を変更することはできません。
- H5 と APP SDK の連携できていると、動作環境に APP SDK が存在しない場合、JavaScript SDK が直接データを送信します。これは、連携されていない状態と同じです。
# 使用方法
H5 と APP SDK を接続する機能を有効にしたい場合は、JavaScript SDK と APP SDK を次のように設定する必要があります。SDK のバージョンに注意してください。古いバージョンを使用しているユーザーは、最新バージョンにアップグレードしてください。
# 2.1 Android SDK 使用方法
Android SDK は 1.2.0以上のバージョンに対応
WebViewを初期設定する時にsetJsBridgeを呼び出す：
ThinkingAnalyticsSDK.sharedInstance(getApplicationContext()).setJsBridge(WebView webView);
テンセントのX5Webviewを対応するために、Android SDK 2.0.1以降のバージョンが必要で、setJsBridgeForX5WebViewを呼び出してください。
ThinkingAnalyticsSDK.sharedInstance(context, appId).setJsBridgeForX5WebView(webView);
# 2.2 iOS SDK 使用方法
iOSSDK は1.1.1以上のバージョンに対応
1.SDKを初期設定したあとでaddWebViewUserAgentを呼び出す：
[[ThinkingAnalyticsSDK sharedInstance] addWebViewUserAgent];
2.WebViewを初期設定するとき、WebViewのタイプに基づいて以下の設定を行なってください。
UIWebView
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType {
if ([[ThinkingAnalyticsSDK sharedInstance] showUpWebView:webView WithRequest:request]) {
return NO;
}
// add your logic code here
return YES;
}
WKWebView
WKWebViewのcustomUserAgentプロパティは：
_wkWebView.customUserAgent = @" /td-sdk-ios";
独自の UA をお持ちの場合は、"/td-sdk-ios" をつなぎ合わせて、decisionPolicyForNavigationAction に次のコードを追加してください。
- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler {
if ([[ThinkingAnalyticsSDK sharedInstance] showUpWebView:webView WithRequest:navigationAction.request]) {
decisionHandler(WKNavigationActionPolicyCancel);
return;
}
// add your logic code here
decisionHandler(WKNavigationActionPolicyAllow);
}
# 2.3 JavaScript SDK 使用方法
JavaScript SDK は1.0.6以上のバージョンに対応
- 初期化パラメーター構成に useAppTrack: true を追加します：
(function(param) {
var p = param.sdkUrl,
n = param.name,
w = window,
d = document,
s = "script",
x = null,
y = null;
w["ThinkingDataAnalyticalTool"] = n;
w[n] =
w[n] ""
function(a) {
return function() {
(w[n]._q = w[n]._q "" []).push([a, arguments]);
};
};
var methods = [
"track",
"quick",
"login",
"logout",
"trackLink",
"userSet",
"userSetOnce",
"userAdd",
"userDel",
"setPageProperty"
];
for (var i = 0; i < methods.length; i++) {
w[n][methods[i]] = w[n].call(null, methods[i]);
}
if (!w[n]._t) {
(x = d.createElement(s)), (y = d.getElementsByTagName(s)[0]);
x.async = 1;
x.src = p;
y.parentNode.insertBefore(x, y);
w[n].param = param;
}
})({
appId: "APP_ID", //APPID allocated by the system ID
name: "ta", //The global call variable name can be set arbitrarily and used in subsequent calls.
sdkUrl: "http://www.a.com/thinkingdata.js", //record script URL
serverUrl: "https://global-receiver-ta.thinkingdata.cn:9080/sync_js", //data upload URL
send_method: "image", //data upload URL
useAppTrack: true // connect APP and H5
});