阅读 155

React Native 更新实践(非热更新)

前言

这周完成了公司 React Native app 更新(非热更新)功能,在这里总结一下。

1.首先,提出一个问题

我们的 app(基于RN)已经有 热更新 功能了,为什么还要一个更新的功能?

因为热更新只会更新非 Native 的代码和资源(图片、JS)。而有些功能必须调用 Native 代码和资源(如:微信支付等)。
一开始,我们的 app 一开始是没有 通知推送 这个功能的,app 要添加这个功能,需要引入第三方的 Native 代码,这个时候,就需要用户自己去 App Store(安卓 app 放在蒲公英)下载然后安装软件来进行软件的更新。
即 app 需要更新 Native 的代码和资源时,需要有这个更新的功能。

2.更新功能的实现思路(非原生实现)

目前我们暂时采用的方案是在我们的 app 中有一个通知的功能(非独立的功能,是和业务相关的,且通知内容是后台管理进行自定义的),当 app 有更新时,用户就可以在 app 内收到这条通知,点进去之后,会有一个更新按钮。点击按钮之后,在 ios 下,会跳转到 App Store 的应用下载页;在 Android 下,会使用默认的浏览器跳转到 app 的下载页面。这样的话,用户可以通过进入 app 的下载页,来进行 app 的更新。

3.具体代码实现

// 判断手机系统,从而得到 app 的下载地址(iosDownloadUrl 和 androidDownloadUrl 是变量)
const downloadUrl = Platform.OS === 'ios' ? iosDownloadUrl : androidDownloadUrl;
// 打开下载地址
// ios 打开下载地址会跳转到 app store 的 app 的下载页面
// ios app 的下载地址怎么获得?请看下面👇
// android 会打开默认浏览器,然后进入该地址
Linking
  .openURL(downloadUrl)
  .catch(err => {
    // 出错时执行
    // ...
  });复制代码

4.其他

(1)怎么获取 ios app 的下载地址?

打开电脑上的 iTunes,点击右上角的搜索,搜索你的 app 名字,然后点击“获取”右边的下拉箭头,就可以看到复制链接,点击复制链接即可。

(2)这种方案的缺点

  • 更新功能很依赖我们 app 的通知这个功能,且用户没有登录的话,收不到通知,则不能进行更新
  • 用户会一直看到这个通知消息,我们也无法根据用户是否更新了 app 来不给该用户发送该通知消息,因为我们无法判断用户是否对 app 进行了更新

5.目前方案的不足与以后的改进方案

不足

  • 这个更新的功能依赖于业务功能(通知功能),和通知功能严重耦合
  • 只有登录的用户才能收到通知功能,才能进行 app 的更新

改进方案

  • 思路:利用 app 本地版本号与服务器(app store 服务器或自己的服务器)的版本号对比,来判断用户是否需要更新