H5数据模板化处理方法、装置和设备及存储介质制造方法及图纸

技术编号:35473817 阅读:11 留言:0更新日期:2022-11-05 16:21
本申请提出了H5数据模板化处理方法、装置和设备及存储介质。本申请利用json增加字段的灵活特性及模板引擎可获取动态数据的功能,将得到的json数据中的动态数据进行静态化处理后再进行渲染,因为json模板是可配置化的,那么应对不同产品,配置不同的json模板,可以实现一套代码多个配置方式,也满足了不同产品取不同字段业务诉求并解决动态获取数据功能。从而,解决了不同产品显示不同的文案,并且文案中仍有需要动态获取的数据,产品与产品间相互独立的实现需求。还解决了同样的接口数据,因产品不同获取的服务端接口数据字段也不一样的实现需求。的实现需求。的实现需求。

【技术实现步骤摘要】
H5数据模板化处理方法、装置和设备及存储介质


[0001]本申请涉及互联网
,具体涉及一种H5数据模板化处理方法、装置和设备及存储介质。

技术介绍

[0002]H5是指第五代HTML(HyperText Markup Language,超文本标记语言)。目前很多业务例如保险和理财子业务的页面等大都通过H5开发编写。
[0003]业务诉求中,因产品或者活动的不同,需要在页面显示不同的数据。尤其是做一些产品活动宣传页面,需要前端进行开发,因而前端的开发量是非常多的。为此,市面上出现低代码平台方案,利用可视化中台系统进行拖拽实现活动页的搭建。另一种方式是利用后管配置,因页面是可通过不同的后管配置数据类型显示不同的业务逻辑。
[0004]那么目前开发方案有以下几种方案实现需求:
[0005]方案一,针对某个前端H5页面,由前端开发者从0开发,利用编写代码形式完成业务需求。
[0006]方案二,利用低代码平台使用拖拽功能的IDE制作画面,快速开发应用页面。
[0007]方案三,可通过可视化后管配置,配置后提交数据库,通过接口形式响应给前端,由前端获取相关配置信息显示。
[0008]然而,上述几种方案都各有缺陷:
[0009]1,采用方案一,应对新增的产品及需求都需要从0进行开发,这种开发量是巨大的,在开发成本及代码维护上代价是很高的。不能满足业务持续不断的需求。
[0010]2,采用方案二,低代码平台不能很好的适配动态接口数据,低代码平台的使用瓶颈是物料,即使实现了优秀的拖拽平台,没有物料就是0。低代码平台可配置静态页面功能。针对接口的逻辑需要二次开发。
[0011]3,采用方案三,可视化后管配置可以满足一套标准类型的方案,但是不能满足随时可变的数据。比如金融领域中定开产品、开放产品、订单周期产品、封闭产品,可通过不同产品类型在后管配置对应的业务逻辑,但是比如针对同一个定开产品,所有产品收益率是动态获取的,这种后管进行配置固定文案方式是不能解决。
[0012]或者,在相同的接口可能在不同页面取的服务端接口字段不一样的情况,某10只产品取的服务端接口字段是a,某10款取同一个接口字段b...如果有更多个产品,通过配置的方式是不能满足业务需求的。
[0013]比如A产品页面使用服务端接口字段a_key,同样的模板下针对B产品使用的后端接口字段是b_key。一个页面使用的服务端接口字段不同,由于字段a_key和字段b_key是动态处理的,不能通过低代码平台适配。

技术实现思路

[0014]本申请提出一种H5数据模板化处理方法、装置和设备及存储介质。
[0015]第一方面,本申请提供一种H5数据模板化处理方法,包括:获取数据,所获取的数据包括远端配置模板与本地默认数据,所述远端配置模板采用json形式;将获取的远端配置模板与本地默认数据进行融合,得到需要在页面显示的json数据;利用art

template模板引擎,将得到的json数据中的动态数据进行静态化处理后再进行渲染。
[0016]在一些可选的实施方式中,所述获取数据包括:通过以下至少一种方式获取数据:从参数中获取,从缓存中获取,以及从路由配置中获取。
[0017]在一些可选的实施方式中,所述将获取的远端配置模板与本地默认数据进行融合,包括:将获取的远端配置模板与本地默认数据整合到Vue框架的date变量中。
[0018]在一些可选的实施方式中,所述利用art

template模板引擎,将得到的json数据中的动态数据进行静态化处理后再进行渲,包括:利用art

template模板的编译功能,将得到的json数据中的动态数据进行静态化处理后与静态数据一起整合成为普通json格式的数据,渲染到Vue框架的data变量中,在Vue框架的模板中以全局变量方式应用。
[0019]第二方面,本申请提供一种H5数据模板化处理装置,包括:获取模块,被配置成获取数据,所获取的数据包括远端配置模板与本地默认数据,所述远端配置模板采用json形式;融合模块,被配置成将获取的远端配置模板与本地默认数据进行融合,得到需要在页面显示的json数据;渲染模块,被配置成利用art

template模板引擎,将得到的json数据中的动态数据进行静态化处理后再进行渲染。
[0020]在一些可选的实施方式中,所述获取模块进一步被配置成通过以下至少一种方式获取数据:从参数中获取,从缓存中获取,以及从路由配置中获取。
[0021]在一些可选的实施方式中,所述融合模块进一步被配置成将获取的远端配置模板与本地默认数据整合到Vue框架的date变量中。
[0022]在一些可选的实施方式中,所述渲染模块进一步被配置成:利用art

template模板的编译功能,将得到的json数据中的动态数据进行静态化处理后与静态数据一起整合成为普通json格式的数据,渲染到Vue框架的data变量中,在Vue框架的模板中以全局变量方式应用。
[0023]第三方面,本申请提供一种终端设备,包括:一个或多个处理器;存储装置,其上存储有一个或多个程序,当所述一个或多个程序被所述一个或多个处理器执行时,使得所述一个或多个处理器实现如第一方面所述的H5数据模板化处理方法。
[0024]第四方面,本申请提供一种计算机可读存储介质,其上存储有计算机程序,所述计算机程序被一个或多个处理器执行时实现如第一方面所述的H5数据模板化处理方法。
[0025]当前系统业务中,产品数据不是按照产品类型进行区分显示,如果有100款产品,那么会有100种文案,文案中还会有一些数据需要进行动态获取,这种需求无法通过现有的后管配置和低代码平台方案有效处理。为了上述问题,本申请提出了H5数据模板化处理方法、装置和设备及存储介质。本申请利用json增加字段的灵活特性及模板引擎可获取动态数据的功能,将得到的json数据中的动态数据进行静态化处理后再进行渲染,因为json模板是可配置化的,那么应对不同产品,配置不同的json,可以实现一套代码多个配置方式,也满足了不同产品取不同字段业务诉求并解决动态获取数据功能。
[0026]本申请取得的有益效果包括但不限于:
[0027]1,同一个页面模板,可适配不同服务端数据显示逻辑;
[0028]2,在不同产品配置中能动态获取服务端接口数据信息。
[0029]3,获取服务端字段时可根据不同产品获取不同字段。
[0030]从而,解决了不同产品显示不同的文案,并且文案中仍有需要动态获取的数据,产品与产品间相互独立的实现需求。还解决了同样的接口数据,因产品不同获取的服务端接口数据字段也不一样的实现需求。
附图说明
[0031]通过阅读参照以下附图所作的对非限制性实施例所作的详细描述,本申请的其它特征、目的和优点将会变得更明显。附图仅本文档来自技高网
...

【技术保护点】

【技术特征摘要】
1.一种H5数据模板化处理方法,其特征在于,包括:获取数据,所获取的数据包括远端配置模板与本地默认数据,所述远端配置模板采用json形式;将获取的远端配置模板与本地默认数据进行融合,得到需要在页面显示的json数据;利用art

template模板引擎,将得到的json数据中的动态数据进行静态化处理后再进行渲染。2.根据权利要求1所述的方法,其特征在于,所述获取数据包括:通过以下至少一种方式获取数据:从参数中获取,从缓存中获取,以及从路由配置中获取。3.根据权利要求1所述的方法,其特征在于,所述将获取的远端配置模板与本地默认数据进行融合,包括:将获取的远端配置模板与本地默认数据整合到Vue框架的date变量中。4.根据权利要求1所述的方法,其特征在于,所述利用art

template模板引擎,将得到的json数据中的动态数据进行静态化处理后再进行渲,包括:利用art

template模板的编译功能,将得到的json数据中的动态数据进行静态化处理后与静态数据一起整合成为普通json格式的数据,渲染到Vue框架的data变量中。5.一种H5数据模板化处理装置,其特征在于,包括:获取模块,被配置成获取数据,所获取的数据包括远端配置模板与本地默认数据,所述远端配置模板采用json形式;融合模块,被配置成将获取的远端配...

【专利技术属性】
技术研发人员:祝彬彬
申请(专利权)人:中信百信银行股份有限公司
类型:发明
国别省市:

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

1