CN110941429B - 一种网页的业务脚本处理方法、装置及设备 - Google Patents
一种网页的业务脚本处理方法、装置及设备 Download PDFInfo
- Publication number
- CN110941429B CN110941429B CN201911012650.7A CN201911012650A CN110941429B CN 110941429 B CN110941429 B CN 110941429B CN 201911012650 A CN201911012650 A CN 201911012650A CN 110941429 B CN110941429 B CN 110941429B
- Authority
- CN
- China
- Prior art keywords
- webpage
- service script
- page
- code
- service
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Active
Links
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/38—Creation or generation of source code for implementing user interfaces
Landscapes
- Engineering & Computer Science (AREA)
- Software Systems (AREA)
- General Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Human Computer Interaction (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Information Transfer Between Computers (AREA)
- Stored Programmes (AREA)
Abstract
本申请公开一种网页的业务脚本处理方法、装置及设备,在网页加载的过程中,所述方法包括:获取所述网页的业务脚本;其中,所述业务脚本为基于预先设置的与前端技术框架解耦的API编写的;识别所述业务脚本所需采用的前端技术框架;在预先设置的各种前端技术框架与框架代码的对应关系中,获取与所述业务脚本所需采用的前端技术框架对应的框架代码;将所述框架代码与所述业务脚本进行拼接,得到拼接代码;将所述拼接代码写入创建的函数对象中,执行所述函数对象,以运行所述拼接代码对应的业务脚本。本申请能够对依赖于各种前端技术框架运行的业务脚本进行处理。
Description
技术领域
本申请涉及数据处理领域,具体涉及一种网页的业务脚本处理方法、装置及设备。
背景技术
对于网页开发而言,最重要的部分之一是对网页的业务脚本的开发。目前,对于网页业务脚本的开发,不同的前端开发人员可能选用不同的前端技术框架,而基于不同的前端技术框架开发的业务脚本需要基于对应的前端技术框架运行,因此,目前的业务脚本开发与具体的前端开发技术等紧耦合。也就是说,对于某一种网页的业务脚本开发工具而言,其一般只支持某一种前端技术框架的业务脚本的开发,而对于基于其他类型的前端技术框架运行的业务脚本则无法使用该开发工具。
发明内容
有鉴于此,本申请提供了一种网页的业务脚本处理方法、装置及设备,能够支持基于各种前端技术框架运行的业务脚本。
第一方面,为实现上述发明目的,本申请提供了一种网页的业务脚本处理方法,在网页加载的过程中,所述方法包括:
获取所述网页的业务脚本;其中,所述业务脚本为基于预先设置的与前端技术框架解耦的API编写的;
识别所述业务脚本所需采用的前端技术框架;
在预先设置的各种前端技术框架与框架代码的对应关系中,获取与所述业务脚本所需采用的前端技术框架对应的框架代码;
将所述框架代码与所述业务脚本进行拼接,得到拼接代码;
将所述拼接代码写入创建的函数对象中,执行所述函数对象,以运行所述拼接代码对应的业务脚本。
一种可选的实施方式中,所述方法还包括:
在运行所述业务脚本的过程中,对所述网页的文档对象模型DOM树进行渲染之前,执行所述网页的初始化事件,以获取所述网页的资源;
和\或,在运行所述业务脚本的过程中,在所述网页的DOM树中的各个页面元素均加载完成后,执行所述网页的页面加载完成事件,以获取所述网页的控件或所述DOM树的节点;
和\或,在运行所述业务脚本的过程中,在所述网页关闭时,执行所述网页的关闭事件,以销毁所述网页上定义的预设对象。
一种可选的实施方式中,所述识别所述业务脚本所需采用的前端技术框架之后,还包括:
获取所述网页的页面代码;
根据预先设置的所述前端技术框架对应的页面代码规则,对所述页面代码进行处理,得到符合所述前端技术框架对应的页面代码规则的页面代码;
运行所述符合所述前端技术框架对应的页面代码规则的页面代码,以渲染所述网页的页面元素。
一种可选的实施方式中,所述网页具有对应的闭包函数,所述闭包函数携带业务脚本标识;
所述获取所述网页的业务脚本,包括:
获取所述网页对应的闭包函数;
执行所述闭包函数,以获取所述闭包函数携带的业务脚本标识对应的业务脚本。
第二方面,本申请还提供了一种网页的业务脚本处理装置,所述装置包括:
第一获取模块,用于在网页加载的过程中,获取所述网页的业务脚本;其中,所述业务脚本为基于预先设置的与前端技术框架解耦的API编写的;
识别模块,用于识别所述业务脚本所需采用的前端技术框架;
第二获取模块,用于在预先设置的各种前端技术框架与框架代码的对应关系中,获取与所述业务脚本所需采用的前端技术框架对应的框架代码;
拼接模块,用于将所述框架代码与所述业务脚本进行拼接,得到拼接代码;
第一运行模块,用于将所述拼接代码写入创建的函数对象中,执行所述函数对象,以运行所述拼接代码对应的业务脚本。
一种可选的实施方式中,所述装置还包括:
第一执行模块,用于在运行所述业务脚本的过程中,在对所述网页的文档对象模型DOM树进行渲染之前,执行所述网页的初始化事件,以获取所述网页的资源;
和\或,
第二执行模块,用于在运行所述业务脚本的过程中,在所述网页的DOM树中的各个页面元素均加载完成后,执行所述网页的页面加载完成事件,以获取所述网页的控件或所述DOM树的节点;
和\或,
第三执行模块,用于在运行所述业务脚本的过程中,在所述网页关闭时,执行所述网页的关闭事件,以销毁所述网页上定义的预设对象。
一种可选的实施方式中,所述装置还包括:
第三获取模块,用于获取所述网页的页面代码;
处理模块,用于根据预先设置的所述前端技术框架对应的页面代码规则,对所述页面代码进行处理,得到符合所述前端技术框架对应的页面代码规则的页面代码;
第二运行模块,用于运行所述符合所述前端技术框架对应的页面代码规则的页面代码,以渲染所述网页的页面元素。
一种可选的实施方式中,所述网页具有对应的闭包函数,所述闭包函数携带业务脚本标识;
所述第一获取模块,包括:
获取子模块,用于获取所述网页对应的闭包函数;
执行子模块,用于执行所述闭包函数,以获取所述闭包函数携带的业务脚本标识对应的业务脚本。
第三方面,本申请还提供了一种计算机可读存储介质,所述计算机可读存储介质中存储有指令,当所述指令在终端设备上运行时,使得所述终端设备执行如上述任一项所述的方法。
第四方面,本申请还提供了一种网页的业务脚本处理设备,包括:存储器,处理器,及存储在所述存储器上并可在所述处理器上运行的计算机程序,所述处理器执行所述计算机程序时,实现如上述任一项所述的方法。
本申请提供的网页的开发脚本处理方法,在网页加载的过程中,首先获取该网页的业务脚本,其中,业务脚本为基于预先设置的与前端技术框架解耦的API编写的,然后识别该业务脚本所需采用的前端技术框架。为了使得该业务脚本能够正常运行,本申请实施例在预先设置的各种前端技术框架与框架代码的对应关系中,获取与该业务脚本所需采用的前端技术框架对应的框架代码。然后将该框架代码与该业务脚本进行拼接,得到拼接代码,最终将该拼接代码写入创建的函数对象中,执行该函数对象,能够实现该拼接代码对应的业务脚本的运行。本申请能够对依赖于各种前端技术框架运行的业务脚本进行处理。
附图说明
为了更清楚地说明本申请实施例中的技术方案,下面将对实施例描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本申请的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动性的前提下,还可以根据这些附图获得其他的附图。
图1为本申请实施例提供的一种网页的业务脚本处理方法的流程图;
图2为本申请实施例提供的另一种网页的业务脚本处理方法的流程图;
图3为本申请实施例提供的一种网页的业务脚本处理装置的结构示意图;
图4为本申请实施例提供的一种网页的业务脚本处理设备的结构示意图。
具体实施方式
下面将结合本申请实施例中的附图,对本申请实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本申请一部分实施例,而不是全部的实施例。基于本申请中的实施例,本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例,都属于本申请保护的范围。
对于需要基于不同前端技术框架运行的业务脚本,目前开发人员需要使用不同的开发工具分别对其进行开发。也就是说,目前没有一种适用于各种类型的前端技术框架的通用的业务脚本开发工具。
本申请的发明人意识到上述问题后,提出了一种网页的业务脚本处理方法,能够对依赖于各种前端技术框架运行的业务脚本进行处理。具体的,作为本申请的处理对象的业务脚本为基于本申请预先设置的与前端技术框架解耦的API编写而成的。本申请提供的页面的业务脚本处理方法中,对于上述业务脚本,在页面加载的过程中,首先识别该业务脚本所需采用的前端技术框架,并在预先设置的各种前端技术框架与框架代码的对应关系中,获取与该业务脚本所需采用的前端技术框架对应的框架代码。然后,将该框架代码与该业务脚本进行拼接,得到拼接代码,最终将该拼接代码写入创建的函数对象中,执行该函数对象以运行该拼接代码对应的业务脚本,完成对该业务脚本的处理。
以下本申请实施例提供了一种网页的业务脚本处理方法,参考图1,为本申请实施例提供的一种网页的业务脚本处理方法流程图,该方法在网页加载的过程中执行,该方法具体包括:
S101:获取所述网页的业务脚本,其中,所述业务脚本为基于预先设置的与前端技术框架解耦的API编写的。
本申请实施例中,网页的业务脚本是一种纯文本保存的程序,是一系列控制计算机执行运算操作的组合,用于实现一定的逻辑分支等。本申请实施例中的业务脚本可以是基于预先设置的与前端技术框架解耦的API编写的,由于该API与前端技术框架解耦,因此,该API可以用于各个前端技术框架的业务脚本的开发。
实际应用中,在网页加载的过程中,首先获取该网页的业务脚本,以实现该业务脚本的运行。由于目前的局部变量无法共享及长久保存,而全局变量可能造成变量污染,为此本申请实施例可以将每个网页的业务脚本的代码封装在对应的独立的闭包函数中,使得关于该业务脚本的所有操作都在该闭包函数的空间中完成,避免变量造成污染等。具体的,每个网页对应一个闭包函数,该闭包函数用于封装该网页的业务脚本的代码,系统中可以存储各个网页与闭包函数的名称的对应关系。其中,每个闭包函数携带有对应的网页的业务脚本标识。
一种可选的实施方式中,在网页的加载过程中,首先获取该网页对应的闭包函数,其次,执行该闭包函数,以获取该闭包函数携带的业务脚本标识对应的业务脚本。
S102:识别所述业务脚本所需采用的前端技术框架。
由于不同前端技术框架对应的业务脚本需要采用对应的前端技术框架运行,因此,系统在获取到网页的业务脚本后,首先识别该业务脚本所需采用的前端技术框架,例如,AngularJS、Vue、React等JavaScript的前端技术框架,以便系统在识别到该业务脚本所需采用的前端技术框架后对其进行处理。
一种可选的实施方式中,在业务脚本的开发阶段,该业务脚本所需采用的前端技术框架已经确定,因此,在对该业务脚本开发的过程中,可以利用一个变量标识该业务脚本所采用的前端技术框架。例如变量的值为001,则标识对应的业务脚本所需采用的前端技术框架为AngularJS,而变量的值为002,则标识对应的业务脚本所需采用的前端技术框架为Vue。也就是说,系统通过识别业务脚本中的对应变量的值,确定该业务脚本所需采用的前端技术框架。
S103:在预先设置的各种前端技术框架与框架代码的对应关系中,获取与所述业务脚本所需采用的前端技术框架对应的框架代码。
本申请实施例中,预先设置各种前端技术框架与框架代码之间的对应关系,也就是说,对于不同的前端技术框架,本申请预先针对性的实现了对应的框架代码,并将前端技术框架与框架代码的对应关系存储于系统中。举例说明,对于AngularJS前端技术框架,页面加载需要定义controller对象,而Vue前端技术框架,页面加载需要定义Component对象,因此,对于AngularJS前端技术框架对应的框架代码中,需要定义controller对象,而Vue前端技术框架对应的框架代码中,需要定义Component对象。值得注意的是,在实现各种前端技术框架的框架代码时考虑对应的前端技术框架的特点,并针对性的编写对应的框架代码。本申请实施例可以利用预先实现的各种前端技术框架分别对应的框架代码对各种业务脚本进行处理,屏蔽了因技术不同导致的代码风格和实现方式的不同。
以基于AngularJS技术的前端技术框架为例,预先设置AngularJS前端技术框架与预先编写的框架代码的对应关系,具体的,在确定业务脚本所需采用的前端技术框架为AngularJS前端技术框架后,可以通过预先设置的上述对应关系,确定AngularJS前端技术框架对应的框架代码。其中,基于AngularJS的前端技术框架对应的框架代码可以如下方式编写:
实际应用中,系统在识别到网页的业务脚本所需采用的前端技术框架后,在预先设置的各种前端技术框架与框架代码的对应关系中,获取与该业务脚本所需采用的框架代码,以便基于该框架代码对该业务脚本进行处理。
S104:将所述框架代码与所述业务脚本进行拼接,得到拼接代码。
本申请实施例中,系统获取到的框架代码与业务脚本实际上均为字符串格式,在获取到框架代码与业务脚本后,系统需要将二者进行拼接,得到拼接代码。可以理解的是,将获取到的框架代码与开发人员编写的业务脚本代码结合,使之能够正常渲染。
一种实施方式中,采用AngularJS的前端技术框架运行的业务脚本可以如下方式编写:
在识别到上述业务脚本所需采用的前端技术框架为AngularJS的前端技术框架后,获取AngularJS的前端技术框架对应的框架代码:
然后,将上述业务脚本与上述框架代码进行拼接后,得到拼接代码,具体得到的拼接代码如下:
值得注意的是,在对上述框架代码与上述业务脚本进行拼接的过程中,AngularJS业务脚本中controller的名字"TestController"映射到框架代码中的unieap.define函数的第一个入参"TestController";而AngularJS前端技术框架对应的业务脚本的变量hello映射到框架代码中的以下部分:
$.extend(view,{
hello:"hello World"
});
另外,对于AngularJS接口获取用户信息getUsers声明对应框架代码中的以下部分:
S105:将所述拼接代码写入创建的函数对象中,执行所述函数对象,以运行所述拼接代码对应的业务脚本。
由于拼接代码实际上仍然为字符串格式,因此,本申请实施例需要创建一个函数对象,然后将拼接代码写入该函数对象中,执行该函数对象,能够实现该拼接代码对应的业务脚本的运行。
以创建一个函数对象Function对象为例,具体包括:
var clazz=new Function(closure);
clazz();
其中,closure用于表示字符串格式的拼接代码,将字符串格式的拼接代码传入Function对象后,执行Function对象既可以实现对拼接代码对应的业务脚本的运行。
本申请实施例提供的网页的开发脚本处理方法,在网页加载的过程中,首先获取该网页的业务脚本,并识别该业务脚本所需采用的前端技术框架。为了使得该业务脚本能够正常运行,本申请实施例在预先设置的各种前端技术框架与框架代码的对应关系中,获取与该业务脚本所需采用的前端技术框架对应的框架代码。然后将该框架代码与该业务脚本进行拼接,得到拼接代码,最终将该拼接代码写入创建的函数对象中,执行该函数对象,能够实现该拼接代码对应的业务脚本的运行。本申请实施例能够对依赖于各种前端技术框架运行的业务脚本进行处理。
另外,对于网页的开发,不仅包括上述对网页的业务脚本的处理,还包括对网页的页面元素的开发。具体的,在上述实施例中S101-S104的基础上,本申请实施例还提供了一种网页的页面元素的处理方法。参考图2,为本申请实施例提供的另一种网页的业务脚本的处理方法,包括上述实施例中的S101-S104,以及网页的页面元素的处理方法。该方法包括:
S201:获取所述网页的页面代码。
S202根据预先设置的所述前端技术框架对应的页面代码规则,对所述页面代码进行处理,得到符合所述前端技术框架的页面代码。
S203:运行所述符合所述前端技术框架的页面代码,以渲染所述网页的页面元素。
本申请实施例中,在对任一网页的页面代码进行处理之前,首先获取该网页的页面代码。由于不同的前端技术框架对应不同的页面代码规则,因此,在获取到该页面的页面代码后,确定该页面的前端技术框架对应的页面代码规则,并基于该页面代码规则,对该页面代码进行处理,使得处理后的页面代码能够符合对应的前端技术框架的页面代码规则。
以AngularJS前端技术框架为例,在获取到网页的页面代码后,假如已确定该页面的业务脚本对应的前端技术框架为AngularJS,则获取AngularJS对应的页面代码规则,例如页面代码规则包括需要在页面代码中添加ng-controller属性,因此,对于获取到的页面代码,在对应位置添加ng-controller属性,以得到符合AngularJS的页面代码规则的页面代码。
本申请实施例中,在得到经过处理的页面代码后,将该页面代码返回至前端,以便在浏览器运行该页面代码后实现对网页的页面元素的渲染。
值得注意的是,本申请对于处理网页的业务脚本与页面元素的顺序不作限制,依据经验通常是先对网页的业务脚本进行处理,然后对页面元素进行处理,最终完成整个网页的渲染。
另外,对于采用不同前端技术的业务脚本,本申请实施例提供了一种在运行各种业务脚本的过程中可以采用的通用的对页面加载中的三个生命周期进行确定的方式,该方式屏蔽了业务脚本所基于的前端技术的区别。具体的,可以通过父子组件的编译链接机制,抽象出页面加载的三个生命周期。
由于页面元素从整体上看是由一个个组件组成的,而各个组件具有父子层级关系或者兄弟同级关系等。无论底层框架是哪种技术,前端渲染页面组件的过程均可分为编译和链接两个阶段。具体的,编译阶段是一个深度优先遍历的过程,即依次执行父子层级关系的组件的编译函数,完成模板DOM的替换;而链接阶段是一个反向的回溯过程,即从层次最深的孩子组件依次向上执行链接函数,以确保在父亲组件阶段操作DOM元素时,其所有的孩子层的组件都已经渲染完毕。为此我们在页面的根元素即body元素上自定义指令,具体的,利用父子指令的编译链接顺序,分别在该指令的编译和渲染阶段抽象出页面加载的三个生命周期。
具体的,在运行所述业务脚本的过程中,本申请实施例在对所述网页的文档对象模型DOM树进行渲染之前,执行所述网页的初始化事件,以获取所述网页的资源。
在运行所述业务脚本的过程中,本申请实施例在所述网页的DOM树中的各个页面元素均加载完成后,执行所述网页的页面加载完成事件,以获取所述网页的控件或所述DOM树的节点。实际应用中,获取页面的控件或DOM树的节点能够用于执行如赋值、绑定事件等操作。
在运行所述业务脚本的过程中,本申请实施例在所述网页关闭时,执行所述网页的关闭事件,以销毁所述网页上定义的预设对象,其中,网页上定义的预设对象包括定时器等,例如,通过销毁定时器释放网页资源,防止内存泄漏的发生。
与上述方法实施例相对应的,本申请还提供了一种网页的业务脚本处理装置,参考图3,为本申请实施例提供的一种网页的业务脚本处理装置的结构示意图,该装置包括:
第一获取模块301,用于在网页加载的过程中,获取所述网页的业务脚本;其中,所述业务脚本为基于预先设置的与前端技术框架解耦的API编写的;
识别模块302,用于识别所述业务脚本所需采用的前端技术框架;
第二获取模块303,用于在预先设置的各种前端技术框架与框架代码的对应关系中,获取与所述业务脚本所需采用的前端技术框架对应的框架代码;
拼接模块304,用于将所述框架代码与所述业务脚本进行拼接,得到拼接代码;
第一运行模块305,用于将所述拼接代码写入创建的函数对象中,执行所述函数对象,以运行所述拼接代码对应的业务脚本。
一种可选的实施方式中,所述装置还包括:
第一执行模块,用于在运行所述业务脚本的过程中,在对所述网页的文档对象模型DOM树进行渲染之前,执行所述网页的初始化事件,以获取所述网页的资源;
和\或,
第二执行模块,用于在运行所述业务脚本的过程中,在所述网页的DOM树中的各个页面元素均加载完成后,执行所述网页的页面加载完成事件,以获取所述网页的控件或所述DOM树的节点;
和\或,
第三执行模块,用于在运行所述业务脚本的过程中,在所述网页关闭时,执行所述网页的关闭事件,以销毁所述网页上定义的预设对象。
另外,一种可选的实施方式中,所述装置还包括:
第三获取模块,用于获取所述网页的页面代码;
处理模块,用于根据预先设置的所述前端技术框架对应的页面代码规则,对所述页面代码进行处理,得到符合所述前端技术框架对应的页面代码规则的页面代码;
第二运行模块,用于运行所述符合所述前端技术框架对应的页面代码规则的页面代码,以渲染所述网页的页面元素。
一种可选的实施方式中,所述网页具有对应的闭包函数,所述闭包函数携带业务脚本标识;
所述第一获取模块,包括:
获取子模块,用于获取所述网页对应的闭包函数;
执行子模块,用于执行所述闭包函数,以获取所述闭包函数携带的业务脚本标识对应的业务脚本。
本申请实施例提供的网页的开发脚本处理装置中,在网页加载的过程中,首先获取该网页的业务脚本,并识别该业务脚本所需采用的前端技术框架。为了使得该业务脚本能够正常运行,本申请实施例在预先设置的各种前端技术框架与框架代码的对应关系中,获取与该业务脚本所需采用的前端技术框架对应的框架代码。然后将该框架代码与该业务脚本进行拼接,得到拼接代码,最终将该拼接代码写入创建的函数对象中,执行该函数对象,能够实现该拼接代码对应的业务脚本的运行。本申请实施例能够对依赖于各种前端技术框架运行的业务脚本进行处理。
另外,本申请实施例还提供了一种网页的业务脚本处理设备,参见图4所示,可以包括:
处理器401、存储器402、输入装置403和输出装置404。网页的业务脚本处理设备中的处理器401的数量可以一个或多个,图4中以一个处理器为例。在本发明的一些实施例中,处理器401、存储器402、输入装置403和输出装置404可通过总线或其它方式连接,其中,图4中以通过总线连接为例。
存储器402可用于存储软件程序以及模块,处理器401通过运行存储在存储器402的软件程序以及模块,从而执行网页的业务脚本处理设备的各种功能应用以及数据处理。存储器402可主要包括存储程序区和存储数据区,其中,存储程序区可存储操作系统、至少一个功能所需的应用程序等。此外,存储器402可以包括高速随机存取存储器,还可以包括非易失性存储器,例如至少一个磁盘存储器件、闪存器件、或其他易失性固态存储器件。输入装置403可用于接收输入的数字或字符信息,以及产生与网页的业务脚本处理设备的用户设置以及功能控制有关的信号输入。
具体在本实施例中,处理器401会按照如下的指令,将一个或一个以上的应用程序的进程对应的可执行文件加载到存储器402中,并由处理器401来运行存储在存储器402中的应用程序,从而实现上述网页的业务脚本处理方法中的各种功能。
另外,本申请还提供了一种计算机可读存储介质,所述计算机可读存储介质中存储有指令,当所述指令在终端设备上运行时,使得所述终端设备执行上述的网页的业务脚本处理方法。
可以理解的是,对于装置实施例而言,由于其基本对应于方法实施例,所以相关之处参见方法实施例的部分说明即可。以上所描述的装置实施例仅仅是示意性的,其中所述作为分离部件说明的单元可以是或者也可以不是物理上分开的,作为单元显示的部件可以是或者也可以不是物理单元,即可以位于一个地方,或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部模块来实现本实施例方案的目的。本领域普通技术人员在不付出创造性劳动的情况下,即可以理解并实施。
需要说明的是,在本文中,诸如第一和第二等之类的关系术语仅仅用来将一个实体或者操作与另一个实体或操作区分开来,而不一定要求或者暗示这些实体或操作之间存在任何这种实际的关系或者顺序。而且,术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含,从而使得包括一系列要素的过程、方法、物品或者设备不仅包括那些要素,而且还包括没有明确列出的其他要素,或者是还包括为这种过程、方法、物品或者设备所固有的要素。在没有更多限制的情况下,由语句“包括一个……”限定的要素,并不排除在包括所述要素的过程、方法、物品或者设备中还存在另外的相同要素。
以上对本申请实施例所提供的一种网页的业务脚本处理方法、装置及设备进行了详细介绍,本文中应用了具体个例对本申请的原理及实施方式进行了阐述,以上实施例的说明只是用于帮助理解本申请的方法及其核心思想;同时,对于本领域的一般技术人员,依据本申请的思想,在具体实施方式及应用范围上均会有改变之处,综上所述,本说明书内容不应理解为对本申请的限制。
Claims (10)
1.一种网页的业务脚本处理方法,其特征在于,在网页加载的过程中,所述方法包括:
获取所述网页的业务脚本;其中,所述业务脚本为基于预先设置的与前端技术框架解耦的API编写的;
识别所述业务脚本所需采用的前端技术框架;
在预先设置的各种前端技术框架与框架代码的对应关系中,获取与所述业务脚本所需采用的前端技术框架对应的框架代码;
将所述框架代码与所述业务脚本进行拼接,得到拼接代码;
将所述拼接代码写入创建的函数对象中,执行所述函数对象,以运行所述拼接代码对应的业务脚本。
2.根据权利要求1所述的方法,其特征在于,所述方法还包括:
在运行所述业务脚本的过程中,对所述网页的文档对象模型DOM树进行渲染之前,执行所述网页的初始化事件,以获取所述网页的资源;
和\或,在运行所述业务脚本的过程中,在所述网页的DOM树中的各个页面元素均加载完成后,执行所述网页的页面加载完成事件,以获取所述网页的控件或所述DOM树的节点;
和\或,在运行所述业务脚本的过程中,在所述网页关闭时,执行所述网页的关闭事件,以销毁所述网页上定义的预设对象。
3.根据权利要求1所述的方法,其特征在于,所述识别所述业务脚本所需采用的前端技术框架之后,还包括:
获取所述网页的页面代码;
根据预先设置的所述前端技术框架对应的页面代码规则,对所述页面代码进行处理,得到符合所述前端技术框架对应的页面代码规则的页面代码;
运行所述符合所述前端技术框架对应的页面代码规则的页面代码,以渲染所述网页的页面元素。
4.根据权利要求1所述的方法,其特征在于,所述网页具有对应的闭包函数,所述闭包函数携带业务脚本标识;
所述获取所述网页的业务脚本,包括:
获取所述网页对应的闭包函数;
执行所述闭包函数,以获取所述闭包函数携带的业务脚本标识对应的业务脚本。
5.一种网页的业务脚本处理装置,其特征在于,所述装置包括:
第一获取模块,用于在网页加载的过程中,获取所述网页的业务脚本;其中,所述业务脚本为基于预先设置的与前端技术框架解耦的API编写的;
识别模块,用于识别所述业务脚本所需采用的前端技术框架;
第二获取模块,用于在预先设置的各种前端技术框架与框架代码的对应关系中,获取与所述业务脚本所需采用的前端技术框架对应的框架代码;
拼接模块,用于将所述框架代码与所述业务脚本进行拼接,得到拼接代码;
第一运行模块,用于将所述拼接代码写入创建的函数对象中,执行所述函数对象,以运行所述拼接代码对应的业务脚本。
6.根据权利要求5所述的装置,其特征在于,所述装置还包括:
第一执行模块,用于在运行所述业务脚本的过程中,在对所述网页的文档对象模型DOM树进行渲染之前,执行所述网页的初始化事件,以获取所述网页的资源;
和\或,
第二执行模块,用于在运行所述业务脚本的过程中,在所述网页的DOM树中的各个页面元素均加载完成后,执行所述网页的页面加载完成事件,以获取所述网页的控件或所述DOM树的节点;
和\或,
第三执行模块,用于在运行所述业务脚本的过程中,在所述网页关闭时,执行所述网页的关闭事件,以销毁所述网页上定义的预设对象。
7.根据权利要求5所述的装置,其特征在于,所述装置还包括:
第三获取模块,用于获取所述网页的页面代码;
处理模块,用于根据预先设置的所述前端技术框架对应的页面代码规则,对所述页面代码进行处理,得到符合所述前端技术框架对应的页面代码规则的页面代码;
第二运行模块,用于运行所述符合所述前端技术框架对应的页面代码规则的页面代码,以渲染所述网页的页面元素。
8.根据权利要求5所述的装置,其特征在于,所述网页具有对应的闭包函数,所述闭包函数携带业务脚本标识;
所述第一获取模块,包括:
获取子模块,用于获取所述网页对应的闭包函数;
执行子模块,用于执行所述闭包函数,以获取所述闭包函数携带的业务脚本标识对应的业务脚本。
9.一种计算机可读存储介质,其特征在于,所述计算机可读存储介质中存储有指令,当所述指令在终端设备上运行时,使得所述终端设备执行如权利要求1-4任一项所述的方法。
10.一种网页的业务脚本处理设备,其特征在于,包括:存储器,处理器,及存储在所述存储器上并可在所述处理器上运行的计算机程序,所述处理器执行所述计算机程序时,实现如权利要求1-4任一项所述的方法。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201911012650.7A CN110941429B (zh) | 2019-10-23 | 2019-10-23 | 一种网页的业务脚本处理方法、装置及设备 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201911012650.7A CN110941429B (zh) | 2019-10-23 | 2019-10-23 | 一种网页的业务脚本处理方法、装置及设备 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN110941429A CN110941429A (zh) | 2020-03-31 |
CN110941429B true CN110941429B (zh) | 2023-03-31 |
Family
ID=69906350
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201911012650.7A Active CN110941429B (zh) | 2019-10-23 | 2019-10-23 | 一种网页的业务脚本处理方法、装置及设备 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN110941429B (zh) |
Families Citing this family (1)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN112068816B (zh) * | 2020-07-22 | 2023-11-10 | 福建天泉教育科技有限公司 | 防止js全局污染的方法、存储介质 |
Citations (5)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN105512128A (zh) * | 2014-09-24 | 2016-04-20 | 阿里巴巴集团控股有限公司 | 页面元素的id属性的处理方法及装置 |
US10182102B1 (en) * | 2013-12-12 | 2019-01-15 | Intuit Inc. | Methods, systems, and articles of manufacture for configuration-based client-side flow control framework for customizable user experience |
CN109725901A (zh) * | 2018-05-31 | 2019-05-07 | 中国平安人寿保险股份有限公司 | 前端代码的开发方法、装置、设备和计算机存储介质 |
CN109783744A (zh) * | 2018-12-05 | 2019-05-21 | 北京奇艺世纪科技有限公司 | 页面启动方法、装置、终端及计算机可读存储介质 |
CN110187931A (zh) * | 2019-05-17 | 2019-08-30 | 北京百度网讯科技有限公司 | 小程序的运行方法及装置 |
-
2019
- 2019-10-23 CN CN201911012650.7A patent/CN110941429B/zh active Active
Patent Citations (5)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US10182102B1 (en) * | 2013-12-12 | 2019-01-15 | Intuit Inc. | Methods, systems, and articles of manufacture for configuration-based client-side flow control framework for customizable user experience |
CN105512128A (zh) * | 2014-09-24 | 2016-04-20 | 阿里巴巴集团控股有限公司 | 页面元素的id属性的处理方法及装置 |
CN109725901A (zh) * | 2018-05-31 | 2019-05-07 | 中国平安人寿保险股份有限公司 | 前端代码的开发方法、装置、设备和计算机存储介质 |
CN109783744A (zh) * | 2018-12-05 | 2019-05-21 | 北京奇艺世纪科技有限公司 | 页面启动方法、装置、终端及计算机可读存储介质 |
CN110187931A (zh) * | 2019-05-17 | 2019-08-30 | 北京百度网讯科技有限公司 | 小程序的运行方法及装置 |
Non-Patent Citations (1)
Title |
---|
张睿 等."前端整合框架及在科研安全生产平台中的应用".《计算机工程与设计》.2017,第38卷(第4期),全文. * |
Also Published As
Publication number | Publication date |
---|---|
CN110941429A (zh) | 2020-03-31 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN109976761B (zh) | 软件开发工具包的生成方法、装置及终端设备 | |
CN106843869B (zh) | 一种前端开发工程化系统和方法 | |
CN106919434B (zh) | 一种代码生成方法及装置 | |
CN107291438B (zh) | 自动化脚本的生成方法、装置及电子设备 | |
CN110580147B (zh) | 一种应用程序的开发方法和装置 | |
CN108920496B (zh) | 一种渲染方法及装置 | |
Cheng et al. | Build Mobile Apps with Ionic 4 and Firebase | |
US20160246622A1 (en) | Method and system for implementing invocation stubs for the application programming interfaces embedding with function overload resolution for dynamic computer programming languages | |
CN107515739B (zh) | 提高代码执行性能的方法及装置 | |
CN113064593B (zh) | 移动app动态化的方法、装置、计算机设备及存储介质 | |
US8327323B2 (en) | Automatic copying by ancestor in object-oriented languages | |
CN113031932A (zh) | 项目开发方法、装置、电子设备及存储介质 | |
CN111767217A (zh) | Js单元测试案例生成方法及装置 | |
CN111309332A (zh) | 文件内容按需加载方法、装置及电子设备、存储介质 | |
CN110941429B (zh) | 一种网页的业务脚本处理方法、装置及设备 | |
CN112818176B (zh) | 一种数据处理方法、装置、设备及存储介质 | |
CN112306486A (zh) | 一种界面生成方法、装置、服务器及存储介质 | |
CN112328241B (zh) | 一种应用程序开发中创建Android库模块依赖关系的方法及装置 | |
CN111459810A (zh) | 构建应用程序的方法、编程设备和计算机可读存储介质 | |
CN115951890A (zh) | 一种不同前端框架间的代码转换方法及系统及装置 | |
CN114579141A (zh) | require框架转化为VUE框架的方法及装置 | |
CN114527979A (zh) | 一种生成多端表单交互页面的方法及系统 | |
CN111651160B (zh) | 插件构建、网页设计的方法和装置 | |
CN113485706A (zh) | 基于dsl的多技术栈前端代码生成方法及装置 | |
CN113031940A (zh) | 前端框架开发方法、装置及终端设备 |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
PB01 | Publication | ||
PB01 | Publication | ||
SE01 | Entry into force of request for substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
GR01 | Patent grant | ||
GR01 | Patent grant |