美文网首页Cordova
Cordova热更新插件使用

Cordova热更新插件使用

作者: 山东菏泽朱志强 | 来源:发表于2017-11-26 22:06 被阅读13次

    新建工程并添加热更新插件

    • 新建Cordova项目

    • cordova create <path> <app id> <name>

    • 添加android平台

      • cordova platform add android
    • 添加iOS平台

    • cordova platform add ios

    • 添加自动更新插件

    • cordova plugin add cordova-hot-code-push-plugin

    • 添加cordova hot code push客户端,用于生成www目录下文件的hash码,更新的时候对比使用。(注意:安装过就不用在安装了)

    • npm install -g cordova-hot-code-push-cli

    客户端配置

    1. 修改config.xml
      修改内容如图:
      这里写图片描述
    //代码为
    <chcp>
            <auto-download enabled="true" />
            <auto-install enabled="true" />
            <config-file url="http://172.16.1.245:8080/cordova-hot-update/cordova/www/chcp.json" />
        </chcp>
    
    1. 项目的根目录下新建cordova-hcp.json,内容为:
    { 
      "update": "start", 
      "content_url": "http://192.168.40.203:8080/cordova/www" 
    }
    
    1. 终端定位到项目根目录,执行cordova-hcp build,生成hash文件

    服务器端

    1. 代码修改完成
    2. 终端定位到项目根目录,执行cordova-hcp build
    3. www目录放到http://172.16.1.245:8080/cordova-hot-update/cordova地址下(是config.xml中设置的地址)

    JavaScript端调用插件方法

    //说明:这里的使用了Framework7
    chcp.fetchUpdate(function(error, data) {
            if(!error) {
                myApp.modal({
                    title: "提示",
                    text: "有更新,确定更新吗?",
                    buttons: [{
                        text: '不更新'
                    }, {
                        text: "立即更新",
                        onClick: function() {
                             myApp.showPreloader('正在升级,升级完毕应用将自动重启...');
                            chcp.installUpdate(function(error) {
                                myApp.alert("更新完成", ["提示"]);
                            })
                        }
                    }]
                })
            } else {
                myApp.alert("你当前是最新版本", ["提示"]);
            }
        })
    

    <pre>
    参考网址:
    博客地址:
    http://blog.csdn.net/lovelyelfpop/article/details/50848524#javascript-module
    http://blog.csdn.net/qq_34160678/article/details/51580975
    视频教程地址:
    http://www.tudou.com/programs/view/oKXtLhMzFSI/?spm=a2h0k.8191414.oKXtLhMzFSI.A

    相关文章

      网友评论

        本文标题:Cordova热更新插件使用

        本文链接:https://www.haomeiwen.com/subject/rrvlbxtx.html