关于Hybrid

hybrid: 前端与客户端一起开发~~
hybrid最大好处,无需审核实时更新，适合需求变动频繁的页面....
通过webview（客户端系统原生组件）与file协议实现

下面我就以app 内部一个 钱包 版本 1.0 相关功能模块来描述

问：如何实时更新
答：
服务端需要维护一个zip包版本管理工具（这里了解就好，服务端实现）
前端每次发布新的钱包，都要变动一下版本号，比如现在更新到1.1，并上传到服务端指定目录
客户端每次打开钱包模块，主动请求服务端当前钱包的版本号,与本地储存的版本比较，如果有新的就更新一下,把新的zip下载解压覆盖，没有就算了（现在发现有1.1，比本地新，更新下载覆盖，更新完成）

问：如何与客户端通信---schema协议
答：业界通行的方法有2种，一种比较新的是客户端与H5直接相互注册调用，主要通过客户端实现
一种跟jsonp特别像,就是客户端创建webview的时候，默认执行下面一段js代码，通过schema协议来通信，原理就是前端通过schema url 封装了将要调用的函数（函数名称与参数双方约定）和参数，客户端通过监听schema的变动执行相应逻辑

    // 调用 schema 的封装
    function _invoke(action, data, callback) {
        // 拼装 schema 协议
        var schema = 'myapp://utils/' + action

        // 拼接参数
        schema += '?a=a'
        var key = Object.keys(data)
        key.forEach(e =>{
            schema += '&' + e + '=' + data[e]
        })

        // 处理 callback
        var callbackName = ''
        if (typeof callback === 'string') {
            // 全局已经有了这个函数 传入了一个函数名称
            callbackName = callback
        } else {
            // 传入了一个函数 ,全局注册一下这个函数
            callbackName = action + Date.now()
            window[callbackName] = callback
        }
        schema +='&'+ 'callback=' + callbackName

        // 触发通信
        var iframe = document.createElement('iframe')
        iframe.style.display = 'none'
        iframe.src = schema  
        var body = document.body
        body.appendChild(iframe)
        setTimeout(function () {
            body.removeChild(iframe)
            iframe = null
        })
    }

    // 暴露到全局变量一些方法
    window.invoke = {
        share: function (data, callback) {
            _invoke('share', data, callback)
        },
        scan: function (data, callback) {
            _invoke('scan', data, callback)
        }
        login: function (data, callback) {
            _invoke('login', data, callback)
        }
    } 

    //调用
    invoke.share({
        name:'xc',
        age:'1'
    },()=>{
        console.log('hahah')
    })