Cordova热更新（二、更新遇到的问题）

今天打开app发现，app热更新遇到问题了：

问题描述：

1，使用的是自动更新的方式，热更新在app的config.xml里面配置如下：

<chcp>
        <auto-download enabled="true" />
        <auto-install enabled="true" />
        <native-interface version="2" />
        <config-file url="http://app.xiaoyu.cn" />
    </chcp>

app中dist文件夹里面的html和js是用vue开发然后打包构建出来的，所以vue里面的main.js中有执行热更新的回调事件比如：

chcp_updateLoadFailed，

chcp_updateIsReadyToInstall，

chcp_beforeInstall，

chcp_updateInstalled，

chcp_updateInstallFailed

然后main.js里面要做一些逻辑与热更新的时间有冲突了，导致了下面表现出来的问题：

卡在了启动页面转圈（用的是cordova-plugin-splashscreen插件）

解决方案：不要使用自动更新，而在main.js中去主动请求

如下：

  <chcp>
        <auto-download enabled="false" />
        <auto-install enabled="false" />
        <native-interface version="2" />
        <config-file url="" />
    </chcp>

然后需要开始更新的地方去开启更新，

chcp.configure(
        {
          "auto-download": true,
          "auto-install": true,
          "config-file": "http://app.xiaoyu.cn"
        },

这样的好处是可以控制开启更新的时机。

然后我们就可以监听chcpConfigureCallback了，

  chcpConfigureCallback: function(error, data) {
    chcp.isUpdateAvailableForInstallation(
      app.isUpdateAvailableForInstallationCallback
    );
  },

在chcpConfigureCallback里面通过chcp.isUpdateAvailableForInstallation方法判断现在有没有取到远程要热更新的内容（所以这里一种是取新内容失败了，但是不知道远程有没有新内容，另一种是请求接口成功了，而且取到内容或者取到空内容，空内容代表远程没有新的页面，不需要热更新）

 isUpdateAvailableForInstallationCallback: function(error, data) {
    if (error) {//如果接口请求失败了，就直接去再次取远程的内容了
      console.log("Nothing to install. Executing fetch.");
      chcp.fetchUpdate(function(error, data) {
      });
      return;
    }

    console.log("Current version: " + data.currentVersion);
    console.log("About to install: " + data.readyToInstallVersion);
    if (data.currentVersion == data.readyToInstallVersion) {
       //这里版本号相等就代表没有要更新的内容，所以这里没有取到要更新的内容，就正常处理逻辑，该干嘛干嘛，这里代码省略
         ... 
        return;
    } 

//走到这里说明需要热更新，而且已经取到热更新的内容了

chcp.installUpdate(function(error, data) {
      if (error) {
        console.log("自动更新失败:" + error.description);
      }
      app.getAppStatus(pjid, pfc_code, v_code);
    });
  },

2，发现日志热更新的文件比较多，而且还很大，这个应该从vue这边来解决问题了，根源

    在于vue打包出的dist文件比较大，而且热更新的文件比较多。

解决方案：vue工程里面发现占空间比较大的是vue本身的库文件，需要将库文件与开发的文件分离，每次热更新应该只更新开发变动的文件，而这个库文件可以在app首次发版时就放入apk和ipa包中去，这样每次只更新变动的js文件，发现占用空间并不大，首次发app版时要和远程的前端页面保持一致，这样用户首次安装时就不需要热更新了。