混合开发，原生app内嵌h5页面 |
您所在的位置：网站首页 › 小程序中嵌入h5页面 › 混合开发，原生app内嵌h5页面 |
混合开发，原生app内嵌h5页面
|
什么是混合开发
混合开发，也就是我们平时听到的Hybrid app,由原生（native）开发技术和web开发技术一起进行开发，然后以native app的方式进行展示的应用。 目前的混合开发方案1.（Hybrid）JSBridge 2.reactNative、weex 3.小程序 等... 我们的项目采用Hybrid app的方式进行混合开发 Hybrid app在原生 app中， 使用webview来加载html页面，把web端的页面展示出来，然后在Native app中的网页就像被放在了一个沙箱中，与外界隔离，访问不到一些外部的方法，无法调用一些手机端的api。 JSBridge它就像一个桥梁，连接这web端和native端，让native可以调用web端的代码，让web端可以调用native端的代码。
1.native app 开发人员完成webview布局 2.通过webview去给window对象里面添加JSBridge对象 3.提供文档 Android 提供给web端调用的方法：1.fnName(str) 传参的情况 --fnname:方法名，web端通过 window.AndroidJSBridge.fnName('xxxx') 调用, window.AndroidJSBridge.XX为固定写法，后面加方法名，参数类型为字符串，传入对象时，要转一下JSON.strinify fnName() 不传参的情况,获取函数的返回值 var result = window.AndroidJSBridge.fnName(); log(result); web提供给native的方法方法必须绑定在window对象下 window.fnName = function (str) { return 'web提供给native的方法'; } IOS 提供给web端调用的方法：固定写法window.webkissageHandlers.xxx.postMessage({...}) window.webkissageHandlers.fnName.postMessage({ msg: str }); web提供给native的方法方法必须绑定在window对象下 window.fnName = function (str) { return 'web提供给native的方法'; } |
【本文地址】
今日新闻 |
推荐新闻 |