React Native 集成文档

诸葛io移动统计支持React Native插件,以下为集成方法。

一、环境准备

1. iOS环境

  • iOS 8.0

    代码支持iOS8.0的系统

  • pod 1.0+

    iOS系统的集成依赖于cocoaPod工具

2. Android环境

  • Android SDK 16+

    代码支持Android 16+

3. React Native环境

  • react-native 0.50+
  • react-native-cli 2.0+

项目本身基于以上版本的React Native开发。目前不确定是否支持低版本的React Native。若集成不成功,请联系我们。

二、集成方法

打开终端,在React Native项目目录下执行:

$ npm install  react-native-plugin-zhugeio --save

$ react-native link

1. iOS集成

  • 若React Native项目的iOS文件夹下,没有Podfile文件,需要初始化Pod:

      $ pod init
    

    以上命令将在iOS目录下创建Podfile文件。

  • 编辑Podfile文件

      platform :ios, '8.0'
    
      target 'yourApp' do
          pod 'yoga', :path => '../node_modules/react-native/ReactCommon/yoga'
          pod 'React', path: '../node_modules/react-native',:subspecs => ['DevSupport']
          pod 'react-native-plugin-zhugeio', path: '../node_modules/react-native-plugin-zhugeio'
      end
    
  • 执行pod install

  • ios/youProjectName/AppDelegate.m文件中,找到application didFinishLaunchingWithOptions方法,在其中加入如下代码:
    #import <Zhugeio/Zhuge.h>

    - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
        [[Zhuge sharedInstance] startWithAppKey:@"Your App Key" launchOptions:launchOptions];
    }
  • 若是私有部署的用户,需要更改数据上传地址,请将上述代码更改为:
    #import <Zhugeio/Zhuge.h>

    - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
        //设置上传地址,一般用户无需更改
        [[Zhuge sharedInstance] setUploadURL:@"https://www.zhugeio.com" andBackupUrl:nil];
        [[Zhuge sharedInstance] startWithAppKey:@"Your App Key" launchOptions:launchOptions];
    }

2. Android集成

  • 检查android/setting.gradle配置是否包含如下内容:

       include ':react-native-plugin-zhugeio'
       project(':react-native-plugin-zhugeio').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-plugin-zhugeio/android')
    
  • 检查android/app/build.gradledependencies是否包含如下内容:

      compile project(':react-native-plugin-zhugeio')
    
  • 找到 android/youApp/src/main/java.../MainApplication.java 文件,添加如下代码:

      import com.zhuge.analysis.stat.ZhugeSDK;// <--导入SDK
      import com.zhuge.reactnativezhuge.RNZhugeioPackage;//<--导入react-native接口
    
      public class MainApplication extends Application implements ReactApplication {
          @Override
          public void onCreate(){
             Super.onCreate();
             ...
             //ZhugeSDK初始化
             ZhugeSDK.getInstance().init(this,"yourAppKey","youAppChannel");   
             ...
    
          }
    
          private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
    
            @Override
            protected List<ReactPackage> getPackages() {
              return Arrays.<ReactPackage>asList(
                 new MainReactPackage(),
                 //注册Zhugeio
                 new RNZhugeioPackage()
              );
            }
          };
      }
    
  • 若是私有部署的用户,需要更改数据上传地址,请将上述onCreate()里的代码更改为:

          @Override
          public void onCreate(){
             Super.onCreate();
             ...
             //设置上传地址,普通用户请勿更改。必须在调用init之前设置
             ZhugeSDK.getInstance().setUploadURL("https://www.zhugeio.com",null)
             //ZhugeSDK初始化
             ZhugeSDK.getInstance().init(this,"yourAppKey","youAppChannel");   
             ...
    
          }
    

3. 使用说明

  • 导入Zhugeio

     import Zhugeio from 'react-native-plugin-zhugeio'
    
  • track 追踪事件

      Zhugeio.track('事件名称',{'属性1':'值1','属性2':'值2'});
    
  • 自定义时长事件

    使用startTrack()开始一个事件的统计

      Zhugeio.startTrack('事件名称');
    

    使用相同的事件名称结束事件统计

      Zhugeio.endTrack('事件名称',{'属性1':'值1'});
    

    startTrack()endTrack()需成对出现,单独使用没有效果。

  • 识别用户

    使用identify()识别用户

      Zhugeio.identify('用户ID',{'用户属性':'用户值'})
    
  • 实时调试

      Zhugeio.openDebug();
    
  • 日志输出

    该方法仅对Android平台可用,iOS平台请参阅 iOS集成文档

      Zhugeio.openLog();
    
©zhugeio.com 京ICP备15049545号            文档更新时间 2018-07-12 18:38:04

results matching ""

    No results matching ""