ionic cordova热更新 react native 热更新

1.需求

因公司业务需要，需要更新本地游戏html文件以及rn文件。

2.实现原理 

加载app 比较本地版本和远程版本 如果远程版本高于本地版本

第一次更新

则下载一个zip包 里边包含最新的html和rn文件

第二次更新

通过比较本地的map文件(list文件包含所有的文件信息)和远程的map文件 比较差异来下载不同的文件

更新完成

写入成功文件 并且写入版本号

重启app

下次启动app就通过写入的版本号进行对比

3.实现细节

我们的html资源安卓需要放在asset目录下ios需要新建一个目录 都是包内资源 无法进行更改 并且android和ios目录不统一

经过我一顿百度可以新建一个bundle文件（mac系统下这是一个文件夹）

修改android asset目录 RN项目/android/app/buidle.gradle 文件

ios需要将这个公共文件拖拽进去 勾选如图所示

rn加载代码 需要引入react-native-fs 插件来获取ios根目录 bundle路径为自己的路径 这块需要写一个方法来获取 因为热跟新完之后路径会变化

说一下react-native-webview这个组件

这些属性都需要有否则无法正常加载本地文件（热更新完后下载的文件目录 ）

ios 需要添加属性 allowingReadAccessToURL

ios真机必须添加这个属性 否则无法正常加载本地文件（目录需要指定为当前加载的bundle目录 ）

具体信息请查阅文档 https://github.com/react-native-community/react-native-webview

然后是rn的热更新 

rn需要生成一个bundle文件 通过bundle命令 以下为android打包bundle命令 会将图片资源一并打包 ios自行修改参数

react-native bundle --platform android --dev false --entry-file index.js --bundle-output bundle/index.jsbundle --assets-dest bundle

同时需要对加载bundle入口文件进行修改

android主要就是修改getJSBundleFile这个入口方法 需要进行一些版本对比然后将新版本地址返回 

RN项目/android/src/main/java/com/you_fish/MainApplication.java

ios 需要修改AppDelegate.m文件 sourceURLForBridge 方法 同样比较一下版本来加载

然后就是关于重启插件了 这里我用的是 react-native-restart 但是不太合适无法重新加载bundle我对它进行了一些改动 可以查看我的fork  https://github.com/gaokaikai/react-native-restart  重启需要重新调用以下入口的方法 具体看下图

android 图中的红框为我自己热更的目录

ios 

 js方面的话比较简单 就是进行了一些文件操作 下载 删除 写入 

android需要整包更新的时候 需要下载apk 并打开apk进行安装 RN自带的Linking并不能完成 这里使用的是 RNFetchBlob库

android.actionViewIntent(targetPath,"application/vnd.android.package-archive");

即可将下载好的app进行安装了 

整个热更新就到此结束了。