基于移动跨平台的机场APP开发容器架构制造技术

技术编号:32434644 阅读:11 留言:0更新日期:2022-02-24 19:05
本发明专利技术公开了一种基于移动跨平台的机场APP开发容器架构,其包括:H5容器,用于H5程序的运行和主流程的实现;所述H5容器包含QDCWeb、JSBridgeAPI和HotLoader;所述QDCWeb为浏览器定制内核,其封装原生web内核,并高度抽象为api,提供Builder模式,支持自定义参数,加入loading状态,以用于提高执行效率,修复原生web漏洞;所述JSBridgeAPI用于原生容器和所述H5容器的交互桥梁,借用JsBridge和队列数据结构封装为API,供彼此之间相互调用。通过本发明专利技术能够进行热修复和热部署,用户体验最好,开发成本低。发成本低。发成本低。

【技术实现步骤摘要】
基于移动跨平台的机场APP开发容器架构


[0001]本专利技术涉及民航业的移动开发
,具体涉及一种基于移动跨平台的机场APP开发容器架构。

技术介绍

[0002]随着跨平台移动应用开发的兴起,移动应用不再是奢侈品而已成为日常生活的必需品。应用开发人员面临的最大挑战是创建可在多个平台上运行良好的应用程序。在一个平台上编写一次代码,并在多个平台上运行,这些工具的目的是为了节省程序员的时间和精力。可以重用代码,并设计可以在包括Android,iOS等多个平台上高效工作的应用程序。
[0003]跨平台方案中,纯H5框架无法承载高交互页面,以及即时通讯等常驻后台服务;RN和Weex项目扩展性差,版本差异大;Flutter等自绘UI框架项目,可读性差,目前存在不可解决的bug。市面的跨平台框架,但是都无法达到原生的体验。纯H5的框架,存在页面加载时间过长的问题,也不能快速构建生成一个APP。另外,APP有新功能,只能通过重装APP更新,无法实现在线更新,热部署,热修复的功能。也无法做到一键配置,即可生成APP的能力。

技术实现思路

[0004]本专利技术克服了现有技术的不足,提供一种基于移动跨平台的机场APP开发容器架构,旨在解决的技术问题之一是:。
[0005]考虑到现有技术的上述问题,根据本专利技术的一个方面,为解决上述的技术问题,本专利技术采用以下技术方案:
[0006]一种基于移动跨平台的机场APP开发容器架构,其包括:
[0007]H5容器,用于H5程序的运行和主流程的实现;所述H5容器包含QDCWeb、JSBridgeAPI和HotLoader;
[0008]所述QDCWeb为浏览器定制内核,其封装原生web内核,并高度抽象为api,提供Builder模式,支持自定义参数,加入loading状态,以用于提高执行效率,修复原生web漏洞;
[0009]所述JSBridgeAPI用于原生容器和所述H5容器的交互桥梁,借用JsBridge和队列数据结构封装为API,供彼此之间相互调用;
[0010]所述HotLoader用于所述H5容器的资源热更新处理;
[0011]原生容器,用于H5容器和系统层之间的数据传递;所述原生容器包含JSBridge、UrlRouter、QDCShark、NativeAPI和WebResManager;
[0012]所述JSBridge用于所述H5容器中JSBridgeAPI原生端的代码实现;
[0013]所述UrlRouter用于APP内部所有页面的跳转;
[0014]所述QDCShark用于APP运行时的异常全监控;
[0015]所述NativeAPI用于调用手机环境中的功能;
[0016]所述WebResManager用于管理web资源本地化过程,从资源版本对比,下载,解压,
通过file协议加载html页面。
[0017]为了更好地实现本专利技术,进一步的技术方案是:
[0018]进一步地,所述H5容器还包含:
[0019]Vant,用于搭建出风格统一的页面,以提升开发效率。
[0020]进一步地,所述H5容器还包含:
[0021]Vue,用于与第三方库或既有项目整合。
[0022]进一步地,所述web页面本地化是将所有web资源打包后,放于APP私有存储中,使得不需要每次进行网络请求和复杂解析,从而直接加载本地页面到内存中。
[0023]进一步地,所述资源热更新处理包括:
[0024]检测APP版本,启动web版本对比;
[0025]更新对应版本的web资源,覆盖本地web资源;
[0026]文件完整性校验,保存web资源版本号和配置单,启动主页;校验失败则启动缓存的web资源。
[0027]进一步地,还包括:
[0028]tabbar资源表,用于记录全局的tabbarItem内容展示配置等字段信息,并可通过权限menu_code查询到对应的tabbar资源实体。
[0029]进一步地,还包括:
[0030]用于存储版本关系的APP表,所述APP表与web资源表为一对多关系,使移动WEB端与APP的版本进行关联,保证移动WEB版本与APP版本功能的一致。
[0031]进一步地,所述异常全监控是在第一时间整改异常代码,解决bug,并进行热更新。
[0032]进一步地,所述H5容器内部署多套H5代码,用于实现同一个APP支持多方厂家H5项目接入的能力。
[0033]进一步地,第三方H5组件接入APP的方式包括:
[0034]项目android和iOS端引入跨平台容器SDK,让项目拥有跨平台开发的容器;
[0035]第三方厂家,按照跨平台容器开发SDK文档,开发符合跨平台容器的H5应用;
[0036]第三方厂家,编译,打包,压缩,将产物dist.zip部署到APP配置后台中,并配置功能入口;
[0037]通过热更新技术,根据组件名,分别判断不同厂家的H5版本;
[0038]通过资源本地化,将最新资源加载到本地;
[0039]将html交付给QDCWeb进行渲染呈现,实现自动加载多个第三方H5资源,实现动态添加第三方H5组件的功能。
[0040]与现有技术相比,本专利技术的有益效果之一是:
[0041]本专利技术的基于移动跨平台的机场APP开发容器架构,1)比其他跨平台框架,兼容性更好,用户体验最好,开发成本更低;2)可以无缝调用原生系统的所有功能;3)页面加载比web页面加载,更快,更流畅;4)容器拥有原生APP开发无法做到的热修复,热部署的能力;5)支持一键配置,无需开发,即可动态构建发布APP。
附图说明
[0042]为了更清楚的说明本申请文件实施例或现有技术中的技术方案,下面将对实施例
或现有技术的描述中所需要使用的附图作简单的介绍,显而易见地,下面描述中的附图仅是对本申请文件中一些实施例的参考,对于本领域技术人员来讲,在不付出创造性劳动的情况下,还可以根据这些附图得到其它的附图。
[0043]图1为根据本专利技术一个实施例的总体框架示意图。
[0044]图2为根据本专利技术一个实施例的跨平台容器的示意图。
[0045]图3为根据本专利技术一个实施例的DCWeb相关组件的框图。
[0046]图4为根据本专利技术一个实施例的QDCBridge相关组件框图。
[0047]图5为根据本专利技术一个实施例的资源本地化相关流程框图。
[0048]图6为根据本专利技术一个实施例的APP热更新流程示意图。
[0049]图7为根据本专利技术一个实施例的文件校验流程示意图。
[0050]图8为根据本专利技术一个实施例的跨平台开APP的原理实现流程框图。
具体实施方式
[0051]下面结合实施例对本专利技术作进一步地详细说明,但本专利技术的实施方式不限于此。
[00本文档来自技高网
...

【技术保护点】

【技术特征摘要】
1.一种基于移动跨平台的机场APP开发容器架构,其特征在于包括:H5容器,用于H5程序的运行和主流程的实现;所述H5容器包含QDCWeb、JSBridgeAPI和HotLoader;所述QDCWeb为浏览器定制内核,其封装原生web内核,并高度抽象为api,提供Builder模式,支持自定义参数,加入loading状态,以用于提高执行效率,修复原生web漏洞;所述JSBridgeAPI用于原生容器和所述H5容器的交互桥梁,借用JsBridge和队列数据结构封装为API,供彼此之间相互调用;所述HotLoader用于所述H5容器的资源热更新处理;原生容器,用于H5容器和系统层之间的数据传递;所述原生容器包含JSBridge、UrlRouter、QDCShark、NativeAPI和WebResManager;所述JSBridge用于所述H5容器中JSBridgeAPI原生端的代码实现;所述UrlRouter用于APP内部所有页面的跳转;所述QDCShark用于APP运行时的异常全监控;所述NativeAPI用于调用手机环境中的功能;所述WebResManager用于管理web资源本地化过程,从资源版本对比,下载,解压,通过file协议加载html页面。2.根据权利要求1所述的基于移动跨平台的机场APP开发容器架构,其特征在于所述H5容器还包含:Vant,用于搭建出风格统一的页面,以提升开发效率。3.根据权利要求1所述的基于移动跨平台的机场APP开发容器架构,其特征在于所述H5容器还包含:Vue,用于与第三方库或既有项目整合。4.根据权利要求1所述的基于移动跨平台的机场APP开发容器架构,其特征在于所述web页面本地化是将所有web资源打包后,放于APP私有存储中,使得不需要每次进行网络请求和复杂解析,从而直接加载本地页面到内存中。5.根据权利要求1所述...

【专利技术属性】
技术研发人员:张宇尹磊林召官
申请(专利权)人:青岛民航凯亚系统集成有限公司
类型:发明
国别省市:

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1