当前位置: 首页 > news >正文

React Native 如何实现拉起App

概述

Xinstall 支持 React Native 应用接入,你可以使用 NPM 包管理器及 React Native 配套工具进行快速集成。 对应的 NPM 包名为:xinstall_react_native,你可以在 这里 找到 NPM 中对应的包页面。

xinstall_react_native 模块封装了 Xinstall 官方 SDK,是集智能传参、快速安装、一键拉起、客户来源统计等功能,帮您提高拉新转化率、安装率和多元化精确统计渠道效果的产品。为用户提供点击、安装、注册、留存、活跃等精准统计报表,并可实时排重,杜绝渠道流量猫腻,大大降低运营成本。 具体详细介绍可前往 Xinstall 官网 进行查看。

如何接入

下面我们介绍如何进行React Native接入:

【重要说明】:从 v1.5.0 版本(含)开始,调用 Xinstall 模块的任意方法前,必须先调用一次初始化方法(init 或者 initWithAd),否则将导致其他方法无法正常调用。

从 v1.5.0 以下升级到 v1.5.0 以上版本后,需要自行修改代码调用初始化方法,Xinstall 模块无法在升级后自动兼容。

1、在 React Native 工程中安装模块

在需要集成的 React Native 工程根目录下,执行:

npm install xinstall-react-native --save

如果该工程使用的 React Native 版本 < 0.60.0 那么需要执行 link 命令:

npx react-native link xinstall-react-native

接下来需要针对 iOS 端进行 pod 安装 xinstall 的包:

// 在 React Native 工程根目录下依次执行
cd ios
pod install
cd ..

【注意】如果 pod install 失败,或者您的 iOS 工程是通过 pod 集成 React Native,那么可以按照如下步骤进行 iOS 端集成:

  • 在 ios/Podfile 文件中添加本地 path:

    pod 'xinstall-react-native', :path => '../node_modules/xinstall-react-native'
    
  • 然后在 ios/ 目录下执行:

    pod install
    

2、创建 Xinstall 应用

进入 Xinstall 官网 注册账号,并在控制台中创建一个对应的应用,应用名字可以任意填写: 

 注意记录 Xinstall 中新创建应用的 appkey(后续配置需要用到): 

 接入过程中如有任何疑问或者困难,可以随时联系 Xinstall 官方客服 在线解决。

3、初始化配置

3.1、获取必要参数
  • appKey:从 Xinstall 平台获取的 AppKey,在上一步骤中可以获取到
  • scheme:详细获取位置:Xinstall 应用控制台-> Android下载配置 中获取
3.2、自动初始化 xinstall-react-native 模块

进入 React Native 工程根目录,执行:

npm run initxinstall <appKey> <scheme>

【注意】:appKey 和 scheme 分别替换成 3.1 中具体的值(两边的尖括号不需要,去掉即可)

如果执行这步时,终端中如果因为报错而导致自动初始化失败,那么可以参考这篇文章进行:手动初始化 xinstall-react-native 模块

Xinstall 通过 Universal links(iOS ≥ 9)技术,在 App 已安装的情况下,从各种浏览器(包括微信、QQ、新浪微博、钉钉等主流社交软件的内置浏览器)拉起 App 并传递动态参数,避免重复安装。

开启 Associated Domains 服务

对于 iOS,为确保能正常使用一键拉起功能,AppID 必须开启 Associated Domains 功能,请到苹果开发者网站,选择 “Certificate, Identifiers & Profiles”,选择 iOS 对应的 AppID,开启 Associated Domains:

开启 Associated Domains 服务

为刚才开发关联域名功能的 App ID 创建新的(或更新现有的)描述文件,下载并导入到 Xcode 中(通过 Xcode 自动生成的描述文件,可跳过这一步):

更新描述文件

配置 Universal links 关联域名

在 Xcode 中配置 Xinstall 为当前应用生成的关联域名(Associated Domains):applinks:xxxx.xinstall.top 和 applinks:xxxx.xinstall.net

具体的关联域名可在 Xinstall管理后台 - 对应的应用控制台 - iOS下载配置 页面中找到

配置 Universal links 关联域名

4、导出包上传 Xinstall

代码集成完毕后,需要通过 React Native 导出 iOS 和 Android 离线包(.ipa 和 .apk),并上传 Xinstall 控制台里对应的 App:

示例图片(iOS 端): 

示例图片(Android 端): 

上传完包后,需要进入「iOS下载配置」和「Android下载配置」中选择下载的包的版本

示例图片(iOS 端): 

示例图片(Android 端): 

注意:每次上传完新的 ipa 或者 apk 包后,均需要进入「iOS下载配置」和「Android下载配置」中重新选择下载的包的版本

三、如何使用

1、快速下载和一键拉起

如果只需要快速下载功能和一键拉起,无需其它功能(携带参数安装、渠道统计),完成初始化配置即可。其他影响因素如下图 

2、初始化 Xinstall 模块

注意:从 v1.5.0 版本开始,在调用 Xinstall 插件的任意方法之前,必须调用一次初始化方法,只需要调用一次即可,不需要反复调用。

v1.5.0 之前的版本会在启动时自动初始化,无需调用,也无法调用。

init

初始化方法。在调用 Xinstall 插件其他方法之前必须调用一次该方法,否则其他方法均无法正常执行。

示例代码

init()

入参说明:无需主动传入参数

回调说明:无需传入回调函数

调用示例

// 在文件头部导入 xinstall 模块
import xinstall from 'xinstall-react-native'
// 在代码中调用 init 方法初始化
xinstall.init();

可用性

Android系统,iOS系统

可提供的 1.5.0 及更高版本


更高级的 携带参数安装/唤起、高级数据统计、场景定制统计、广告平台渠道功能、苹果搜索广告(ASA)渠道功能可以看集成文档

三、导出apk/ipa包并上传

参考官网文档

iOS集成-导出ipa包并上传

Android-集成

四、如何测试

参考官方文档 测试集成效果

http://www.lqws.cn/news/541801.html

相关文章:

  • PHP在做爬虫时的解决方案
  • Franka 机器人在配置空间距离场实验中的突破性应用:从算法优化到动态场景适配
  • 无人机防护装置技术解析
  • 基于 Spring Boot + Vue 3的现代化社区团购系统
  • element-plus table合并列、合计行、表格填报添加验证
  • redisTemplate简单实现幂等性校验
  • fishbot随身系统安装nvidia显卡驱动
  • Rust交互式编程环境Jupyter Lab搭建
  • 【unitrix】 4.10 数字类型的按位异或运算实现(bitxor.rs)
  • 同样是synthesis(综合) HLS和Vivado里面是有什么区别
  • 【git学习】学习目标及课程安排
  • Java 大视界 -- Java 大数据在智能教育学习社群知识共享与协同学习促进中的应用(326)
  • 【HTML】
  • 中国科技术语杂志中国科技术语杂志社中国科技术语编辑部2025年第3期目录
  • 算法第55天|冗余连接、冗余连接II
  • C++ 第三阶段 并发与异步 - 第二节:异步任务(std::async)
  • 在docker容器中安装docker服务,基于fuse-overlayfs进行overlay挂载,而不是vfs
  • HarmonyOS NEXT仓颉开发语言实现画板案例
  • MySQL 离线安装MariaDB
  • SYSCFG 时钟在 GD32F4 系列微控制器中的作用
  • Layer by Layer: Uncovering Hidden Representations in Language Models
  • 当前最好的0样本文本转语音是哪个模型?
  • SpringCloud系列(38)--SpringCloud Gateway实现动态路由
  • 2024百度之星:BD202404 110串
  • JDY-23蓝牙模块与电脑的连接方式
  • 从0开始学习计算机视觉--Day04--损失函数
  • 杭州西湖断桥不断:3D扫描还原‘残雪‘视觉骗局
  • 在反向代理环境下精准获取客户端真实 IP 的最佳实践
  • Linux journal 日志大小限制与管理详解
  • vue-27(实践练习:将现有组件重构为使用组合式 API)