# H5 and APP SDK Get Through
# I. Introduction to the Program
In APP, there may be some pages consisting of H5 pages. At this time, APP SDK can not collect data from H5 pages. It is necessary to use JavaScript SDK to collect user's behavior on H5 pages. In order to ensure data consistency between JavaScript SDK and APP SDK, data connection function is added into the new version of SDK:
The H5 page uses JavaScript SDK for data collection. After collecting the data, it is not sent directly, but sent to the server through the APP SDK (that is, Android SDK and iOS SDK). The APP SDK will adjust the data collected by the JavaScript SDK. The rules are as follows:
- Retains the
#time
passed in by the JavaScript SDK, that is, the time of the event is based on the time that triggered event tracking. - Use the APP SDK
#account_id
and#distinct_id
, subject to the user maintained by the APP SDK. - Add the preset attribute of the APP SDK. If it conflicts with the preset attribute of JavaScript, the preset attribute of the APP SDK will override the conflicting value, such as the
#lib
field, and the value of the APP SDK will override the value of the JavaScript SDK. - Public property of the APP SDK: If it conflicts with the property passed in JavaScript, the native public property value is discarded; if the JavaScript SDK does not have the property, it is added to the reported data
- The
timeEvent
interface in the APP SDK can take effect on events collected by the JavaScript SDK. - The login, logout, and identify interfaces in the JavaScript SDK cannot modify the user ID in the APP SDK. In the case of H5 and the APP SDK, the user ID of the data cannot be modified through the above interface in the JavaScript SDK.
- When the switch between H5 and APP SDK is turned on, if the APP SDK does not exist in the running environment, the JavaScript SDK will directly report the data, which is equivalent to the state of not turning on and turning on.
# II. Usage
If you need to turn on the H5 and APP SDK connection function, you need to configure the JavaScript SDK and APP SDK as follows. **Please pay attention to the applicable version of the SDK **, and please use the historical version to upgrade to the latest version.
# 2.1 Use of Android SDK
Android SDK requires 1.2.0 and later versions
Call setJsBridge
when initializing WebView
:
ThinkingAnalyticsSDK.sharedInstance(getApplicationContext()).setJsBridge(WebView webView);
If you need to support Tencent's X5Webview
, you need the Android SDK to use 2.0.1 and later versions, call setJsBridgeForX5WebView
:
ThinkingAnalyticsSDK.sharedInstance(context, appId).setJsBridgeForX5WebView(webView);
# 2.2 Use of iOS SDK
iOS SDK requires 1.1.1 and later versions
- After initializing the SDK, call the
addWebViewUserAgent
:
[[ThinkingAnalyticsSDK sharedInstance] addWebViewUserAgent];
- When initializing
WebView
, make the following call based on the type ofWebView
:
- If it is
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;
}
- If it is
WKWebView
Set the customUserAgent property of WKWebView as follows:
_wkWebView.customUserAgent = @" /td-sdk-ios";
If there is a self-contained UA, please splice the " /td-sdk-ios" and add the following code in decidePolicyForNavigationAction
- (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 Use of JavaScript SDK
JavaScript SDK requires 1.0.6 and later versions
- Add
useAppTrack: true
to the initialization parameter configuration, as follows:
(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", //System Assigned APPID
name: "ta", //The global call variable name can be set at will and used for subsequent calls
sdkUrl: "http://www.a.com/thinkingdata.js", //Statistical script URL
serverUrl: "http://receiver.ta.thinkingdata.cn:9080/sync_js", //URL for data upload
send_method: "image", //Data upload mode
useAppTrack: true, // Get through APP and H5
});