本发明专利技术公开了一种静态表单的加载方法、系统、装置和存储介质,该方法包括:通过表单设计器编辑表单页面并配置表单控件、JS脚本和CSS样式,生成表单配置信息;根据表单配置信息,通过模板引擎技术生成表单文件;表单文件包括表单控件文件、JS脚本文件和CSS样式文件;打包表单文件,生成静态表单;将静态表单存储于服务器中;浏览器从服务器中获取并显示静态表单。本发明专利技术实施例的静态表单的加载方法通过表单编辑器设计网页并配置网页表单中的表单控件,再将设计好的网页生成为文件并打包,存储至服务器中,当需要访问该表单时,浏览器能够直接从服务器中获取已经生成的表单,无需在加载网页时同步生成网页。
【技术实现步骤摘要】
本专利技术属于浏览器页面处理领域,尤其是一种静态表单的加载方法、系统、装置和存储介质。
技术介绍
1、随着oa等流程类系统的出现,将传统纸质文件处理方式转变为电子化处理方式,各类的软件公司也需要根据企业的规章制度及工作流程设计不同的表单页面,其中包含了各类控件(如输入框、下拉等)。传统的做法是企业购买系统后,乙方公司根据要求进行设计与开发,这给乙方带来了很多重复的劳动付出。
2、目前已推出的表单设计器方案,有基于富文本编辑器实现、基于xml实现、基于json实现的方案,但最终都需要使用客户端的浏览器在加载时渲染成html页面,当表单的元素较多时,极易造成页面加载卡顿的问题,对客户端的机器性能要求较高,有时甚至需要十多秒才能加载完成让客户填写信息,影响用户的使用体验。
技术实现思路
1、本专利技术旨在至少解决现有技术中存在的技术问题之一。为此,本专利技术提供了一种静态表单的加载方法、系统、装置和存储介质,能够高效的加载静态表单,提升静态表单的加载速度和用户体验。
2、第一方面,本专利技术实施例提供了一种静态表单的加载方法,包括:
3、通过表单设计器编辑表单页面并配置表单控件、js脚本和css样式,生成表单配置信息;
4、根据所述表单配置信息,通过模板引擎技术生成表单文件;所述表单文件包括表单控件文件、js脚本文件和css样式文件;
5、打包所述表单文件,生成静态表单;
6、将所述静态表单存储于服务器中;
<
p>7、浏览器从所述服务器中获取并显示所述静态表单。8、在本专利技术的一些实施例中,所述通过表单设计器编辑静态表单页面并配置表单控件,生成表单配置信息的步骤,包括:
9、通过所述表单设计器编辑所述表单页面;所述表单页面分为组件库区、内容区和属性配置区;
10、从所述组件库区获取所述表单控件,并将所述表单控件设置于所述内容区;
11、通过所述属性配置区修改所述表单控件的可配置属性;
12、将所述可配置属性与可变数据模型绑定,使所述可配置属性能够随所述可变数据模型的改变而改变;
13、配置所述表单页面的执行逻辑;
14、修改所述表单控件的样式;
15、将所述可变数据模型、所述执行逻辑和所述表单控件的样式整合为表单配置信息,并为所述表单配置信息赋予全局唯一表单标识。
16、在本专利技术的一些实施例中,所述从所述组件库区获取所述表单控件,并将所述表单控件设置于所述内容区的步骤,包括:
17、所述表单设计器通过json配置文件获取所述组件区内的所述表单控件的列表;
18、若所需的所述表单控件存在于所述列表内,则将所需的所述表单控件设置于所述内容区;
19、或者,若所需的所述表单控件不存在于所述列表内,则修改所述json配置文件以获取新表单控件;
20、所述表单设计器通过读取json文件,获取并动态渲染所述新表单控件;
21、将所述新表单控件设置于所述内容区。
22、在本专利技术的一些实施例中,所述配置所述表单页面的执行逻辑的步骤,包括:
23、将所述表单页面的执行流程划分为若干执行阶段;
24、为每个所述执行阶段配置生命周期函数。
25、在本专利技术的一些实施例中,所述根据所述表单配置信息,通过模板引擎技术生成表单文件的步骤,包括:
26、所述表单设计器的后台组件生成表单页面模板;所述表单页面模板包括表单控件模板、js脚本模板和css样式模板;
27、所述后台组件根据所述可变数据模型和所述表单控件模板,生成表单控件文件;
28、所述后台组件根据所述执行逻辑和所述js脚本模板,生成js脚本文件;
29、所述后台组件根据所述表单控件的样式和所述css样式模板,生成css样式文件。
30、在本专利技术的一些实施例中,所述浏览器从所述服务器中获取并显示所述静态表单的步骤,包括:
31、所述浏览器向所述服务器发出表单获取请求;
32、所述后台组件根据表单获取请求,从所述服务器中获取所述静态表单,并返回至所述浏览器;
33、所述浏览器显示并缓存所述静态表单。
34、在本专利技术的一些实施例中,所述浏览器从所述服务器中获取并显示所述静态表单的步骤之后,还包括:
35、浏览器加载所述静态表单,并识别所述静态表单中所使用的所述生命周期函数的种类;
36、所述浏览器初始化所述静态表单,并将所述生命周期函数挂载至浏览器对象中;
37、当所述表单控件进入不同的所述执行阶段时,确认所述浏览器对象是否存在所述生命周期函数对应的执行函数;
38、若所述浏览器对象存在所述执行函数,所述浏览器调用所述生命周期函数。
39、第二方面,本专利技术实施例提供了一种静态表单加载系统,包括:
40、表单配置模块,用于通过表单设计器编辑表单页面并配置表单控件、js脚本和css样式,生成表单配置信息;
41、文件生成模块,用于根据所述表单配置信息,通过模板引擎技术生成表单文件;所述表单文件包括表单控件文件、js脚本文件和css样式文件;
42、文件打包模块,用于打包所述表单文件,生成静态表单;
43、表单存储模块,用于将所述静态表单存储于服务器中;
44、表单访问模块,用于通过所述浏览器从所述服务器中获取并显示所述静态表单。
45、第三方面,本专利技术实施例提供了一种计算机装置,包括存储器和处理器,所述存储器用于存储至少一个程序,所述处理器用于加载所述至少一个程序以执行上述方面实施例所述的静态表单的加载方法。
46、第四方面,本专利技术实施例一种计算机可读存储介质,其中存储有处理器可执行的程序,所述处理器可执行的程序在由处理器执行时用于执行上述方面实施例所述的静态表单的加载方法。
47、根据本专利技术实施例的静态表单的加载方法,至少具有如下有益效果:本专利技术实施例提供的静态表单的加载方法,通过表单设计器编辑静态表单中的表单控件,并将设计好的网页生成为文件并打包,存储至服务器中,当需要访问该表单时,浏览器能够直接从服务器中获取已经生成的表单,无需在加载网页时同步生成网页。本专利技术实施例的静态表单方法通过能够异步处理表单的生成和加载,能够提高网页的加载速度,减少服务器的负载,提升用户体验。
本文档来自技高网...
【技术保护点】
1.一种静态表单的加载方法,其特征在于,包括:
2.根据权利要求1所述的静态表单的加载方法,其特征在于,所述通过表单设计器编辑静态表单页面并配置表单控件,生成表单配置信息的步骤,包括:
3.根据权利要求2所述的静态表单的加载方法,其特征在于,所述从所述组件库区获取所述表单控件,并将所述表单控件设置于所述内容区的步骤,包括:
4.根据权利要求2所述的静态表单的加载方法,其特征在于,所述配置所述表单页面的执行逻辑的步骤,包括:
5.根据权利要求2所述的静态表单的加载方法,其特征在于,所述根据所述表单配置信息,通过模板引擎技术生成表单文件的步骤,包括:
6.根据权利要求5所述的静态表单的加载方法,其特征在于,所述浏览器从所述服务器中获取并显示所述静态表单的步骤,包括:
7.根据权利要求4所述的静态表单的加载方法,其特征在于,所述浏览器从所述服务器中获取并显示所述静态表单的步骤之后,还包括:
8.一种静态表单加载系统,其特征在于,包括:
9.一种计算机装置,其特征在于,包括存储器和处理器,所述存储器用于存储至少一个程序,所述处理器用于加载所述至少一个程序以执行权利要求1-7中任一项所述的静态表单的加载方法。
10.一种计算机可读存储介质,其中存储有处理器可执行的程序,其特征在于,所述处理器可执行的程序在由处理器执行时用于执行如权利要求1-7中任一项所述的静态表单的加载方法。
...
【技术特征摘要】
1.一种静态表单的加载方法,其特征在于,包括:
2.根据权利要求1所述的静态表单的加载方法,其特征在于,所述通过表单设计器编辑静态表单页面并配置表单控件,生成表单配置信息的步骤,包括:
3.根据权利要求2所述的静态表单的加载方法,其特征在于,所述从所述组件库区获取所述表单控件,并将所述表单控件设置于所述内容区的步骤,包括:
4.根据权利要求2所述的静态表单的加载方法,其特征在于,所述配置所述表单页面的执行逻辑的步骤,包括:
5.根据权利要求2所述的静态表单的加载方法,其特征在于,所述根据所述表单配置信息,通过模板引擎技术生成表单文件的步骤,包括:
6.根据权利要求5所述的静态表单...
【专利技术属性】
技术研发人员:廖万里,金卓,魏小彬,雷明明,马琼贵,李轩宇,
申请(专利权)人:珠海金智维信息科技有限公司,
类型:发明
国别省市:
还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。