React Native 集成openinstall-react-native

韦叶秋

2023-12-01

概述
openinstall-react-native是openinstall官方开发的 React Native 版本插件，可以快速集成免填邀请码，渠道统计等功能。更值得一提的是现在openinstall官方提供免费开放拉起功能和快速下载功能。

我没有 mac 设备，所以只说 Android 的配置。

一：安装
1、打开终端，进入项目根目录文件夹下，执行以下命令：

npm install openinstall-react-native --save

2、自动关联部分

react-native link

注意:link的时候如果出现Error: Cannot find module 'asap/raw'则先执行npm install再react-native link就好了。

3、使用自动集成脚本集成代码和部分配置

npm run openinstall <yourAppKey> <yourScheme>

备注：

yourAppKey指的是你在openinstall官方账号后台，创建应用后分配的AppKey
yourScheme指的是你在openinstall官方账号后台，创建应用后分配的scheme

检查android 检查相关配置
（1） settings.gradle
检查 android 项目下的 settings.gradle 配置有没有包含以下内容：

include ':app', ':openinstall-react-native', ':openinstall-react-native'
project(':openinstall-react-native').projectDir = new File(rootProject.projectDir, '../node_modules/openinstall-react-native/android')

（2）检查build.gradle配置
dependencies 中有没有添加 openinstall-react-native 依赖

dependencies {
   ...
   implementation project(':openinstall-react-native')  
}

（3）检查 app 下的 AndroidManifest 配置
在AndroidManifest.xml的application标签有没有AppKey

 <meta-data android:name="com.openinstall.APP_KEY" android:value="OPENINSTALL_APPKEY"/>

在AndroidManifest.xml的拉起页面activity标签中是否添加intent-filter（一般为MainActivity），配置scheme，用于浏览器中拉起

<activity
    android:name=".MainActivity"
    android:launchMode="singleTask">
    <intent-filter>
        <action android:name="android.intent.action.VIEW"/>
        <category android:name="android.intent.category.DEFAULT"/>
        <category android:name="android.intent.category.BROWSABLE"/>
        <data android:scheme="OPENINSTALL_SCHEME"/>
    </intent-filter>
</activity>

OPENINSTALL_APPKEY为openinstall官方分配的appKey，OPENINSTALL_SCHEME为官方分配的scheme。

现在重新 sync 一下项目，应该能看到 openinstall-react-native作为 android Library 项目导进来了。

二：使用指南

（1）快速下载（免费）
如果只需要快速下载功能，无需其它功能（携带参数安装、渠道统计、一键拉起），完成sdk初始化即可。

（2）一键拉起（免费）
导入插件,请react native端入口js文件中（例如App.js文件）导入：

import OpeninstallModule from 'openinstall-react-native'

获取拉起参数（通常在componentDidMount中监听）

componentDidMount() {
  //该方法用于监听app通过univeral link或scheme拉起后获取唤醒参数
  this.receiveWakeupListener = map => {
     if (map) {
    //do your work here
     }        
   Alert.alert('拉起回调',JSON.stringify(map)) 
  } 
  OpeninstallModule.addWakeUpListener(this.receiveWakeupListener)  
}

componentWillUnMount() {
  openinstall.removeWakeUpListener(this.receiveWakeupListener)//移除监听
}

第二个函数返回的是map或字典，包含动态安装参数（data）和渠道参数（channel），注意：只有通过渠道二维码或链接安装app后，才会有渠道参数
如果动态安装参数（data）和渠道参数（channel）同时为空，则map返回null

（3）携带参数安装（高级版功能）
在需要获取安装参数的位置，导入插件：

import OpeninstallModule from 'openinstall-react-native'

调用如下方法，可重复获取（理论上可在任意位置获取安装参数）：

OpeninstallModule.getInstall(10, map => {
  if (map) {
    //do your work here
  }        
  Alert.alert('安装回调',JSON.stringify(map))     
})

第一个传入的参数为超时时长，一般为10s左右，如果只是在后台默默统计或使用，可以设置更长时间；第二个函数返回的是map或字典，包含动态安装参数（data）和渠道参数（channel），注意：只有通过渠道二维码或链接安装app后，才会有渠道参数
如果动态安装参数（data）和渠道参数（channel）同时为空，则map返回null

（4）渠道统计（高级版功能）
SDK 会自动完成访问量、点击量、安装量、活跃量、留存率等统计工作。

（a）上报注册事件
在用户注册成功时，可调用该方法上报注册事件，需要导入’openinstall-react-native’

OpeninstallModule.reportRegister()

（b）上报效果点
两个参数分别为效果点的ID，string类型，以及效果点的值，为整型，示例：

OpeninstallModule.reportEffectPoint('effect_test',1)

ok，以上集成完成，可以打包提交到openinstall后台托管测试。可参阅官方文档

React Native 集成openinstall-react-native

相关阅读

相关文章

相关问答

相关文档