Hybrid集成指南

一、获取SDK

登录灯塔首页，创建应用，填入基本应用信息，即可获取独一无二的AppKey，并下载SDK；

iOS SDK：点此下载SDK for iOS

Android SDK：点此下载SDK for Android

二、使用iOS Hybrid功能

1. 导入 SDK

Hybrid 统计是在Native统计基础上进行的，在开始之前，请确保已按照iOS集成指南正常接入灯塔iOS SDK

SDK包功能介绍：

BeaconAPI_Base.framework ---基础统计功能，必选

BeaconAPI_Hybrid.framework ---Hybrid功能，可选

添加系统库和相关配置（具体代码参考Demo工程）

2.添加相关的代码

2.1.UIWebView控件

• 当JavaScript调用灯塔上报事件，需在UIWebView的Delegate实现中添加代码：

- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType {
    // 处理Beacon混合统计请求的代码
    if ([BeaconHybrid handleRequest:request fromWebView:webView]) {
        return NO;
    }

    // 原有的代码
    return YES;
}

• 开启Native和JavaScript的通信，需在UIWebView的Delegate实现中添加代码：

- (void)webViewDidFinishLoad:(UIWebView *)webView {
    // 开启Native和JS通信的开关
    [BeaconHybridInterface enableHybrid:webView enable:YES];

    // 原有的代码
}

2.2.WKWebView控件

当JavaScript调用灯塔上报事件，需在WKWebView的Delegate实现中添加代码：

- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler {
    // 处理Beacon混合统计请求的代码
    if ([BeaconHybridInterface handleRequest:navigationAction.request webView:webView]) {
        decisionHandler(WKNavigationActionPolicyCancel);
        return;
    }

    // 原有的代码
    decisionHandler(WKNavigationActionPolicyAllow);
}

• 开启Native和JavaScript的通信，需在WKWebView的Delegate实现中添加代码：

- (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation {
    // 开启Native和JS通信的开关
    [BeaconHybridInterface enableHybrid:webView enable:YES];

    // 原有的代码
}

2.3.HTML页面引用JS文件

<script type="text/javascript" src="http://3gimg.qq.com/mig_op/beacon/js/hybrid/beacon_hybrid.js"></script>

2.4.HTML页面调用Native接口

• 获取设备ID

var display = function(qimei) {
    alert(qimei);
}
function getQIMEI() {;
    BeaconHybrid.getQIMEI(display);
}
<input type="button" class="btn" value="获取设备ID" id="test1" onclick="getQIMEI();" />

• 非实时事件

function onUserAction() {
    BeaconHybrid.onUserAction("testName1");
}
<input type="button" class="btn" value="实时事件" id="test2" onclick="onUserAction();" />

• 实时事件

function onDirectUserAction() {
    BeaconHybrid.onDirectUserAction("testName2", {"city":"shenzhen", "country":"china"});
}
<input type="button" class="btn" value="非实时事件" id="test3" onclick="onDirectUserAction();" />

• 页面统计

function onPage() {
    BeaconHybrid.onPage();
    window.location = "index2.html";
}
<input type="button" class="btn" value="页面统计" id="test4" onclick="onPage();" />

还有疑问？欢迎反馈给[e-mail]，会有专人为您服务。