一、Hybird App开发模式
1、传统的App开发
不够灵活,更新一丢丢东西得重新上架,还得同时开发两个端,麻烦。但是性能好啊,动画顺畅啊。
2、web开发后打包成app
性能差,但是兼容两端,足够灵活,不需要请这么多人(省钱啊)
3、Hybird App开发
保证性能的同时,经常性更改的页面改用web开发,保证一定程度的灵活性,可以减少新包上架的频率
其实现在很多App都是采用这种模式进行开发了,那么我们平常可以怎么与客户端进行数据上的交互呢?
二、基于URL的数据传递
这个其实很简单,客户端在生成一个webview的时候(相当于浏览器),进行url跳转,在跳转时,将数据以query的方式带上,这样我们就可以用js进行获取使用了。
三、基于函数的数据交互
这种方式,需要Android和iOS端统一一下规范,好让我们前端小弟能够根据协商的方式进行数据的获取
这里提出一个场景,就是token的获取,在我们页面请求服务器的时候,可能需要客户端登录时存储的token,这种东西在url上带上就不太好了,毕竟比较容易暴露嘛,所以一般我们会选择放在header中。
在经过我们团队讨论之后,我们的客户端大佬就决定制定一份协议吧,用于客户端两端与js的交互,这里主要是基于函数进行传值。
两端都往webview中注入一个全局方法吧
安卓:window.nativeBridge.appHandler
iOS:window.webkit.messageHandlers.appHandler.postMessage
那我们前端就可以通过window对象分别去调用对应的方法,传入一个config用于客户端判断需要获取什么数据
这里统一传入的是序列化的配置对象,含有method,以及params,给客户端进行判断使用。
之后客户端要把数据传入给我们,也是通过我们前端提前挂载在window对象上的h5Handler方法进行传值
客户端调用了window.h5Handler后,将传入一个序列化的配置对象dataString(这个参数就是客户端传过来的数据),同样也是含有method和params(这个当然是和客户端协议好的),途中有个resolve方法,是外层函数传入的。
当然这里为了更好地进行业务的匹配,需要将一些业务的代码抽离出来。
将获取token这个业务单独抽离出来。
将配置函数传入injectConfig中,让将getToken包装成一个Promise,在客户端触发了window.h5Handler函数后就可以将传递的值通过resolve传递出去了。之后我们就可以直接调用getToken,在resolve中获取到客户端传给我们的token了
如果还有什么好的方法,希望可以分享一下。哈哈哈