最近在学React Native,学到了CodePush热更新。

老师讲了两种实现的方法,现将其记录一下。

相比较原生开发,使用React Native开发App不仅能节约开发成本,还能做原生开发不能实现的热更新功能。

使用原生技术开发App时,每次代码做了改动后,都需要提交到应用商店进行审核,审核通过后,需要等用户重新下载安装后才会生效。而如果使用React Native开发App,开发者可随时发布新版本,不用经过应用商店的审核,用户即可使用到新版本,并且还可做到不用经过用户的同意就强制安装新版本。

CodePush是微软的技术,因为服务器在国外,所以不太稳定。如果开发的App是针对国内市场的,应该使用CodePush中国

要使用CodePush,需安装cpcn-react-native依赖包。可使用官方提供的工具cpcn-client来安装依赖包。cpcn-client的下载地址是:http://code-push.cn/docs/1010.htm 。

代码实现比较简单。第一种方法是直接改变App.js组件:

import cpcn from 'cpcn-react-native';

class App  extends Component {

}

App = cpcn(App);

export default App;

这种方法在有新版本更新时,会使用默认的提示框,提示框中的文字也是默认的。灵活性不够。

第二种方法比较灵活,可以自定义对话框和进度条。这种方法使用 cpcn.check() 方法。

import cpcn from "cpcn-react-native";

class App extends Component {
componentDidMount(){
cpcn.check({
checkCallback: (remotePackage, agreeContinueFun) => {
if(remotePackage){ }
},
downloadProgressCallback: (downloadProgress) => { },
installedCallback: (restartFun) => { }
});
}
} export default App;

将 cpcn.check() 方法写在 App.js 的 componentDidMount 方法内,当 App 组件加载后调用此依法。

cpcn.check() 方法的参数:

checkCallback: 在检查是否有可更新的版本后调用这个方法,如果 remotePackage 不是 null,表示有可更新的版本。如果要继续更新,就调用 agreeContinueFun(true),如果不想继续更新,就调用 agreeContinueFun(false)。

downloadProgressCallback: 在下载新版本的过程中调用这个方法。可用它的参数 downloadProgress 做进度条。downloadProgress.receivedBytes 是已经下载的字节数,downloadProgress.totalBytes 是总字节数。

installedCallback: 当新版本安装完成后调用这个方法。需调用 restartFun(true) 重启App,重启后新版本就生效了。

用CodePush在React Native App中做热更新的更多相关文章

  1. React Native App设置&Android版发布

    React Native系列 <逻辑性最强的React Native环境搭建与调试> <ReactNative开发工具有这一篇足矣> <解决React Native un ...

  2. [译] Facebook:我们是如何构建第一个跨平台的 React Native APP

    英文原文(需FQ):https://code.facebook.com/posts/1189117404435352/ 早些时候,我们介绍过iOS版的React Native. React Nativ ...

  3. React Native APP结构探索

    APP结构探索 我在Github上找到了一个有登陆界面,能从网上获取新闻信息的开源APP,想来研究一下APP的结构. 附上原网址:我的第一个React Native App 具体来讲,就是研究一个复杂 ...

  4. 利用 Create React Native App 快速创建 React Native 应用

    本文介绍的 Create-React-Native-App 是非常 Awesome 的工具,而其背后的 Expo 整个平台也让笔者感觉非常的不错.笔者目前公司是采用 APICloud 进行移动应用开发 ...

  5. React Native & app demos

    React Native & app demos https://github.com/ReactNativeNews/React-Native-Apps https://github.com ...

  6. React Native工程中TSLint静态检查工具的探索之路

    建立的代码规范没人遵守,项目中遍地风格迥异的代码,你会不会抓狂? 通过测试用例的程序还会出现Bug,而原因仅仅是自己犯下的低级错误,你会不会抓狂? 某种代码写法存在问题导致崩溃时,只能全工程检查代码, ...

  7. React Native开发中自动打包脚本

    React Native开发中自动打包脚本 在日常的RN开发中,我们避免不了需要将我们编写的代码编译成安装包,然后生成二维码,供需要测试的人员扫描下载.但是对于非原生的开发人员来说,可能不知如何使用X ...

  8. 在React Native中集成热更新

    最近,在项目DYTT集成了热更新,简单来说,就是不用重新下载安装包即可达到更新应用的目的,也不算教程吧,这里记录一下. 1.热更新方案 目前网上大概有两个比较广泛的方式,分别是 react-nativ ...

  9. 我的第一个React Native App

    我用了三天时间实现了一个相对比较完整的React Native 新闻发布类型的示例.应用做得很简单,但大多React Native的组件都有用到,今天做一个分享(由于我电脑是Windows系统,所以只 ...

随机推荐

  1. Golang的安装和编译

    一.下载安装(Ubuntu16.04) 1.下载地址:https://golang.google.cn/dl/ 2.下载Linux版本的安装包go1.10.3.linux-amd64.tar.gz并复 ...

  2. 数据结构(三十二)图的遍历(DFS、BFS)

    图的遍历和树的遍历类似.图的遍历是指从图中的某个顶点出发,对图中的所有顶点访问且仅访问一次的过程.通常有两种遍历次序方案:深度优先遍历和广度优先遍历. 一.深度优先遍历 深度优先遍历(Depth_Fi ...

  3. 快速学习ggplot2

    R语言里面一个比较重要的绘图包——ggplot2,是由Hadley Wickham于2005年创建,于2012年四月进行了重大更新,作者目前的工作是重写代码,简化语法,方便用户开发和使用.ggplot ...

  4. 构建企业级数据湖?Azure Data Lake Storage Gen2实战体验(下)

    相较传统的重量级OLAP数据仓库,“数据湖”以其数据体量大.综合成本低.支持非结构化数据.查询灵活多变等特点,受到越来越多企业的青睐,逐渐成为了现代数据平台的核心和架构范式. 作为微软Azure上最新 ...

  5. 再整理:Visual Studio Code(vscode)下的通用C语言环境搭建

    版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明. 本文链接:https://www.cnblogs.com/czlhxm/p/11794743.ht ...

  6. 2019 年容器生态统计报告发布 | 云原生生态周报 Vol. 26

    作者 | 酒祝.天元.元毅.心水.衷源 业界要闻 1.2019 年容器生态统计报告发布  据报告显示,Kubernetes 占据 77% 的容器编排产品份额,Docker 占据 79% 的容器引擎产品 ...

  7. 百度NLP预训练模型ERNIE2.0最强实操课程来袭!【附教程】

    2019年3月,百度正式发布NLP模型ERNIE,其在中文任务中全面超越BERT一度引发业界广泛关注和探讨.经过短短几个月时间,百度ERNIE再升级,发布持续学习的语义理解框架ERNIE 2.0,及基 ...

  8. golang 包依赖管理 godep 使用

    介绍: godep是解决包依赖的管理工具,目前最主流的一种,原理是扫描记录版本控制的信息,并在go命令前加壳来做到依赖管理. 1.安装: go get github.com/tools/godep 2 ...

  9. [2018-03-08] virtualenv

    virtualenv 的有点 1.使不同应用开发环境独立 2.环境升级不影响其他应用,也不会影响全局的python环境 3.它可以防止系统中出现包管理混乱和版本的冲突 新建    virtualenv ...

  10. javascript采用Broadway实现安卓视频自动播放的方法(这种坑比较多 不建议使用)

    javascript采用Broadway实现安卓视频自动播放的方法Broadway 是一个 H.264 解码器, 比jsmpge清晰度要高 使用 Emscripten 工具从 Android 的 H. ...