第二步：集成 热力引擎 SDK ReactNative模块

对于 React Native 开发的应用，推荐使用 npm 或 yarn 方式集成热力引擎 SDK ReactNative 模块，在您项目的根目录下执行以下命令:  ( 请在您项目的根目录执行下述命令, 且命令完成后, 记得需要在原生项目里更新对远程库的依赖)

如果您创建的产品数据存储区域是中国大陆

//使用npm
npm install solarengine-analysis-react-native-cn

//使用yarn
yarn add    solarengine-analysis-react-native-cn

 如果您创建的产品数据存储区域是非中国大陆

//使用npm
npm install solarengine-analysis-react-native

//使用yarn
yarn add    solarengine-analysis-react-native

注意：React Native 0.60 及以上版本会 autolinking，不需要执行下边的 react-native link 命令。

react-native link solarengine-analysis-react-native

 若需要使用指定版本的原生SDK

(示例为海外版; 国内版本请将路径中的solarengine-analysis-react-native 改为solarengine-analysis-react-native-cn)

//未指定platform时,同时修改iOS & Android 的SDK版本
node node_modules/solarengine-analysis-react-native/cli.js   set-config  --sdkVersion=1.3.1.0

//指定修改iOS SDK版本
node node_modules/solarengine-analysis-react-native/cli.js   set-config  --sdkVersion=1.3.1.2   --platform=ios

//指定修改Android SDK的版本
node node_modules/solarengine-analysis-react-native/cli.js   set-config  --sdkVersion=1.3.1.4   --platform=android

Android 配置

在您项目根目录的build.gradle添加 maven 仓库配置，具体配置如下：

maven {
       url "https://maven-android.solar-engine.com/repository/se_sdk_for_android/"
 }
maven {
       url "https://developer.huawei.com/repo/"
}
maven { 
        url "https://developer.hihonor.com/repo"
}

Android 

在项目 AndroidManifest.xml 文件中，加入如下权限：

<uses-permission android:name="android.permission.READ_PHONE_STATE" />

注：android.permission.READ_PHONE_STATE 为非必要权限。如果开发者使用了数据存储区域是中国大陆的 SDK，热力引擎 SDK 并不会要求开发者强制获取此权限。如果开发者获取了此权限且 Android 系统在 6.0 以上，需要动态申请此权限。

iOS 

支持Xcode版本：14.0或更高

适用范围：适用于 iOS 11.0 及以上的操作系统。

HarmonyOS

参考文档 集成 SolarEngine HarmonyOS SDK：SolarEngine 快速集成文档

SolarEngine React Native 插件 v1.7.1 及以上，支持 HarmonyOS 埋点

集成 SolarEngine React Native 插件的 HarmonyOS 实现

将组件 solarengine-analysis-react-native-cn 中 harmony 目录下 cpp 和 ets 下的 solarengine 文件夹

分别拖拽到 RN 生成的鸿蒙项目中 src/main/cpp 和 src/main/ets 目录中

配置修改

在 entry/src/main/cpp/CMakeLists.txt 中定义 cpp 的 solarengine 路径，并添加到编译构建中：

cmake_minimum_required(VERSION 3.4.1)
set(CMAKE_SKIP_BUILD_RPATH TRUE)
set(OH_MODULE_DIR "${CMAKE_CURRENT_SOURCE_DIR}/../../../oh_modules")
set(RNOH_APP_DIR "${CMAKE_CURRENT_SOURCE_DIR}")

set(RNOH_CPP_DIR "${OH_MODULE_DIR}/@rnoh/react-native-openharmony/src/main/cpp")
set(RNOH_GENERATED_DIR "${CMAKE_CURRENT_SOURCE_DIR}/generated")
set(CMAKE_ASM_FLAGS "-Wno-error=unused-command-line-argument -Qunused-arguments")
set(CMAKE_CXX_FLAGS "-fstack-protector-strong -Wl,-z,relro,-z,now,-z,noexecstack -s -fPIE -pie")
add_compile_definitions(WITH_HITRACE_SYSTRACE)
set(WITH_HITRACE_SYSTRACE 1) # for other CMakeLists.txt files to use

add_subdirectory("${RNOH_CPP_DIR}" ./rn)

add_library(rnoh_app SHARED
    "./PackageProvider.cpp"
    "${RNOH_CPP_DIR}/RNOHAppNapiBridge.cpp"
    "./solarengine/SolarengineAnalysisReactNative.cpp" # 手动添加
)

target_link_libraries(rnoh_app PUBLIC rnoh)

2. 在 entry/src/main/cpp/PackageProvider.cpp 中创建 cpp 侧的 package 对象：SolarEnginePackage

#include "RNOH/PackageProvider.h"
#include "solarengine/SolarEnginePackage.h" // 手动添加

using namespace rnoh;

std::vector<std::shared_ptr<Package>> PackageProvider::getPackages(Package::Context ctx) {
    return {
        std::make_shared<SolarEnginePackage>(ctx) // 手动添加
    };
}

3. 在 entry/src/main/ets/RNPackagesFactory.ets 中添加创建 SolarEnginePackage 的方法

import { RNPackageContext, RNPackage } from '@rnoh/react-native-openharmony/ts';
import { SolarEnginePackage } from './solarengine/SolarEnginePackage'; // 手动添加

export function createRNPackages(ctx: RNPackageContext): RNPackage[] {
  return [
    new SolarEnginePackage(ctx) // 手动添加
  ];
}

Example

Example in Github

export function preInit(appKey: string)

import SolarEngine from 'solarengine-analysis-react-native'; //如果您创建的产品数据存储区域不是中国大陆
//import SolarEngine from 'solarengine-analysis-react-native-cn'; //如果您创建的产品数据存储区域是中国大陆

let appKey = ""; 
if (Platform.OS === 'ios') {
   appKey = "your_iOS_appkey";// 替换为您为iOS App申请的appkey
} else if (Platform.OS === 'android') {
   appKey = "your_Android_appkey";// 替换为您为Android App申请的appkey
}    
SolarEngine.preInit(appKey);

export function initialize(appKey:string,options:SolarEngineInitiateOptions,completion: (result: InitiateCompletionInfo) => void) 

type attribution = (code:number,attribution?:Object) => void;

type deeplink = (code:number,deepLinkInfo?:DeepLinkInfo) => void;

type deferredDeeplink = (code:number,deferredDeepLinkInfo?:DeferredDeepLinkInfo) => void;

async function Initiate(){
  log("Initiate" );

  let appKey = "";
  if (Platform.OS === 'ios') {
     appKey = "your_iOS_appKey";
  } else if (Platform.OS === 'android') {
     appKey = "your_Android_appKey";
  }    
  let config:se_initial_config = buildInitialConfig();
  let remoteConfig:RemoteConfig = buildRemoteConfig();
  let attribution:attribution = buildAttribution();
  let deeplink:deeplink = buildDeeplinkResponse();
  let deferredDeeplink:deferredDeeplink = buildDeferredDeeplinkResponse();

  let initiateOptions:SolarEngineInitiateOptions = {
    config:config,
    remoteConfig:remoteConfig,
    attribution:attribution,
    deeplink:deeplink,
    deferredDeeplink:deferredDeeplink
  }
  SolarEngine.initialize(appKey,initiateOptions,(result:InitiateCompletionInfo) => {
    if (result.success) {
      Alert.alert('SolarEngine SDK Initiate Complete!')
    }
  });

}

function buildInitialConfig():se_initial_config{
  let config:se_initial_config = {
    enableLog: true,
    enableDebug: false,
...
  };
  return config;
}

function buildRemoteConfig():RemoteConfig{
  let remoteConfig:RemoteConfig = {
    enabled:true,
    mergeType:RemoteConfigMergeType.Cache, 
    customIDProperties:{"name":"name_value"},
    customIDEventProperties:{"age":28},
    customIDUserProperties:{"key":"value"},
  }
  return remoteConfig;
}

function buildAttribution():attribution{

  const handleAttribution:attribution = (code:number,attributionInfo?:Object) => {
    console.log("attribution code: " + code);
    if (code === 0){
        console.log("attributionInfo: " + JSON.stringify(attributionInfo));
        const typedValue = attributionInfo as {channel_name : string,
        attribution_time:string, 
        re_data: object};
        console.log("channel_name: " + typedValue.channel_name)
        console.log("attribution_time: " + typedValue.attribution_time)
        const re_dataValue = typedValue.re_data as {install_time:string,
        report_time:string
      }
      if(typedValue.re_data != null){
        console.log("re_data.install_time: " + re_dataValue.install_time)
        console.log("re_data.report_time: " + re_dataValue.report_time)
      }else{
        console.log("re_data: is null" )
      }
    }
  }
  return handleAttribution;
}

function buildDeeplinkResponse():deeplink{
  const handleDeepLink: deeplink = (code:number,deepLinkInfo?: DeepLinkInfo) => {
    if(code === 0){
      if(deepLinkInfo){
        console.log("deepLinkInfo.sedpLink: " + deepLinkInfo.sedpLink);
      }
    }else{
      console.log("code: " + code);
    }
  };
  return handleDeepLink;
}

function buildDeferredDeeplinkResponse(): deferredDeeplink {
  const handleDeferredDeeplink: deferredDeeplink = (
    code: number,
    deferreddeeplink?: DeferredDeepLinkInfo
  ) => {
    if (code === 0) {
      if (deferreddeeplink) {
        log('deferreddeeplink.sedpLink: ' + deferreddeeplink.sedpLink);
      }
    } else {
      log('code: ' + code);
    }
  };
  return handleDeferredDeeplink;
}

export function retrieveAttribution(): Object|null;

function retrieveAttribution(){

  let attribution:Object|null = SolarEngine.retrieveAttribution();
  if (attribution != null) {
    log('attribution: ' + JSON.stringify(attribution));

    const object = attribution as { channel_name: string; attribution_time: string};
    log("channel_name:" + object.channel_name);  
    log("attribution_time:" + object.attribution_time);  
  }else{
    log("attribution is null");
  }
}