一种基于JSBridge开发混合App的方法技术

本发明专利技术公开了一种基于JSBridge开发混合App的方法，属于移动端App开发技术领域。本发明专利技术的基于JSBridge开发混合App的方法，移动端通过集成JSBridge框架，实现原生端App与web H5互相调用，通过数据进行参数传递及通过结果回传进行结果的回调，使web H5嵌入到原生端App，并进行相应的交互处理。该发明专利技术的基于JSBridge开发混合App的方法能够实现App跨平台开发，极大的提高开发效率，降低开发成本，具有很好的推广应用价值。

A method of developing hybrid app based on jsbridge

【技术实现步骤摘要】
一种基于JSBridge开发混合App的方法
本专利技术涉及移动端App开发
，具体提供一种基于JSBridge开发混合App的方法。
技术介绍
根据工信部电信研究院公布的今年上半年全国手机行业运行状况，期内全国手机市场出货量1.95亿部，其中智能机为822款，占比为39.16％，智能机总体出货量达9485.5万部，占同期手机市场出货量的48.66％。智能终端的快速递增，并以移动终端为载体构建了包括操作系统、应用商店、开发者、应用等在内的完整的移动生态链，促进了终端体验更为丰富和多元化。所有能在电脑上实现的服务都能在移动终端上实现。智能终端已经成为我生活不可或缺的一部分，终端深刻的改变了我们的生活方式、生活习惯。移动端应用App正向功能增强化、多模化、定制化、平台开放化的方向发展，被广泛应用于各行各业用来实现“互联网+”。随着移动终端的普及和移动互联网的不断发展，App应用的开发需求量越来越大，社交、娱乐、购物、导航以及企业应用越来越多的领域需要移动App的开发。但原生App存在开发周期长、成本高、适配复杂、维护迭代效率低等缺点。
技术实现思路
本专利技术的技术任务是针对上述存在的问题，提供一种能够实现App跨平台开发，极大的提高开发效率，降低开发成本的基于JSBridge开发混合App的方法。为实现上述目的，本专利技术提供了如下技术方案：一种基于JSBridge开发混合App的方法，移动端通过集成JSBridge框架，实现原生端App与webH5互相调用，通过数据进行参数传递及通过结果回传进行结果的回调，使webH5嵌入到原生端App，并进行相应的交互处理。该基于JSBridge开发混合App的方法可实现安卓和iOS两端应用的高性能、高效率、可深度交互的开发。作为优选，该基于JSBridge开发混合App的方法具体包括以下步骤：S1、移动端集成JSBridge框架，调试JS环境；S2、移动端和webH5约定调用方式名称、参数、回调结果形式；S3、移动端原生组件注册封装JS环境供webH5调用，webH5预留方法供移动端调用；S4、原生组件的封装和JS环境的封装；S5、webH5端调用使用方法。全局引用jsBridgeimportjsBridgefrom“jsBridge”在需要获取原生信息时调用js封装的方法(方法名跟原生保持一致如(getMessage))responseData即原生返回的数据。作为优选，步骤S1中，移动端建立基础架构，包括icon配置、网络请求工具封装、添加基础公共类、包名配置。作为优选，步骤S2中，移动端在原生组件中引入JSBridge框架，通过原生端注册JS方法注册约定的方法名称，通过数据获取解析参数，通过结果回传以Jason形式将结果回传。其中传参数据模型为：{data:“key”}。作为优选，步骤S3中，移动端通过原生端注册JS方法，预留给webH5调用，webH5通过调用相应的方法从移动端获取相应的数据资源。作为优选，移动端通过原生端调用JS方法调用webH5预留的方法，可主动的将相应的数据资源传递给webH5端，webH5端可将处理的结果通过请求结果反馈给移动端。作为优选，步骤S4中，基于原生组件注册的方法列表经过统一封装，可将原生组件以及JSBridge框架移植到多个App内使用。作为优选，webH5封装出一套JS环境，第三方webH5应用可通过引入封装好的JS环境集成到对应的多个App中。与现有技术相比，本专利技术的基于JSBridge开发混合App的方法具有以下突出的有益效果：所述基于JSBridge开发混合App的方法通过JSBridge搭建桥梁，实现web应用和安卓、iOS两端的深度交互，兼具“NativeApp”良好用户交互体验的优势”和“WebApp跨平台开发的优势”，可通过webH5功能调用相应的Native方法，进而调用硬件设备，也可实现安卓和iOS端调用webH5功能方法，满足不同的开发需求，快速高效的开发功能的同时也可快速更新上线发版，具有良好的推广应用价值。具体实施方式下面将结合实施例，对本专利技术的基于JSBridge开发混合App的方法作进一步详细说明。实施例本专利技术的基于JSBridge开发混合App的方法，移动端通过集成JSBridge框架，实现原生端App与webH5互相调用，通过数据进行参数传递及通过结果回传进行结果的回调，使webH5嵌入到原生端App，并进行相应的交互处理。该基于JSBridge开发混合App的方法具体包括以下步骤：S1、移动端集成JSBridge框架，调试JS环境。移动端建立基础架构，包括icon配置、网络请求工具封装、添加基础公共类、包名配置。S2、移动端和webH5约定调用方式名称、参数、回调结果形式。移动端在原生组件中引入JSBridge框架，通过原生端注册JS方法注册约定的方法名称，通过数据获取解析参数，通过结果回传以Jason形式将结果回传。其中传参数据模型为：{data:“key”}。S3、移动端原生组件注册封装JS环境供webH5调用，webH5预留方法供移动端调用。移动端通过原生端注册JS方法，预留给webH5调用，webH5通过调用相应的方法从移动端获取相应的数据资源。移动端通过原生端调用JS方法调用webH5预留的方法，可主动的将相应的数据资源传递给webH5端，webH5端可将处理的结果通过请求结果反馈给移动端。S4、原生组件的封装和JS环境的封装。基于原生组件注册的方法列表经过统一封装，可将原生组件以及JSBridge框架移植到多个App内使用。webH5封装出一套JS环境，第三方webH5应用可通过引入封装好的JS环境集成到对应的多个App中。S5、webH5端调用使用方法。该过程全局引用jsBridgeimportjsBridgefrom“jsBridge”在需要获取原生信息时调用js封装的方法(方法名跟原生保持一致如(getMessage))responseData即原生返回的数据。该基于JSBridge开发混合App的方法可实现安卓和iOS两端应用的高性能、高效率、可深度交互的开发。具有NativeApp良好的交互体验，移动端蓝牙、摄像、NFC等功能均可调用以实现webH5所需功能，能够实现App跨平台开发，极大的提高开发效率，降低开发成本。以上所述的实施例，只是本专利技术较优选的具体实施方式，本领域的技术人员在本专利技术技术方案范围内进行的通常变化和替换都应包含在本专利技术的保护范围内。本文档来自技高网...

【技术保护点】
1.一种基于JSBridge开发混合App的方法，其特征在于：移动端通过集成JSBridge框架，实现原生端App与web H5互相调用，通过数据进行参数传递及通过结果回传进行结果的回调，使web H5嵌入到原生端App，并进行相应的交互处理。/n

【技术特征摘要】
1.一种基于JSBridge开发混合App的方法，其特征在于：移动端通过集成JSBridge框架，实现原生端App与webH5互相调用，通过数据进行参数传递及通过结果回传进行结果的回调，使webH5嵌入到原生端App，并进行相应的交互处理。


2.根据权利要求1所述的基于JSBridge开发混合App的方法，其特征在于：该方法具体包括以下步骤：
S1、移动端集成JSBridge框架，调试JS环境；
S2、移动端和webH5约定调用方式名称、参数、回调结果形式；
S3、移动端原生组件注册封装JS环境供webH5调用，webH5预留方法供移动端调用；
S4、原生组件的封装和JS环境的封装；
S5、webH5端调用使用方法。


3.根据权利要求2所述的基于JSBridge开发混合App的方法，其特征在于：步骤S1中，移动端建立基础架构，包括icon配置、网络请求工具封装、添加基础公共类、包名配置。


4.根据权利要求3所述的基于JSBridge开发混合App的方法，其特征在于：步骤S2中，移动端在原生组件中引入JS...

【专利技术属性】
技术研发人员：刘文凯，李长征，
申请(专利权)人：山东健康医疗大数据有限公司，
类型：发明
国别省市：山东;37