CN105005568A - 基于模板的web页面前端处理装置及方法 - Google Patents

基于模板的web页面前端处理装置及方法 Download PDF

Info

Publication number
CN105005568A
CN105005568A CN201410162023.2A CN201410162023A CN105005568A CN 105005568 A CN105005568 A CN 105005568A CN 201410162023 A CN201410162023 A CN 201410162023A CN 105005568 A CN105005568 A CN 105005568A
Authority
CN
China
Prior art keywords
template
web page
web
end processing
processing device
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.)
Granted
Application number
CN201410162023.2A
Other languages
English (en)
Other versions
CN105005568B (zh
Inventor
王玉球
孙战平
夏智
佟志臣
查骏
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
China Unionpay Co Ltd
Original Assignee
China Unionpay Co Ltd
Priority date (The priority date 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 date listed.)
Filing date
Publication date
Application filed by China Unionpay Co Ltd filed Critical China Unionpay Co Ltd
Priority to CN201410162023.2A priority Critical patent/CN105005568B/zh
Publication of CN105005568A publication Critical patent/CN105005568A/zh
Application granted granted Critical
Publication of CN105005568B publication Critical patent/CN105005568B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Landscapes

  • Information Transfer Between Computers (AREA)

Abstract

本发明提出了基于模板的web页面前端处理装置及方法，所述方法包括：web页面前端处理装置从web服务器获取业务数据；所述web页面前端处理装置中的模板引擎基于预定义的web前端模板以及所述业务数据构建渲染代码，其中，所述web前端模板定义数据渲染实现模式；所述web页面前端处理装置根据HTTP协议执行所述渲染代码以将所述业务数据渲染到web页面的指定区域。本发明所公开的基于模板的web页面前端处理装置及方法具有高的数据处理效率以及良好的代码复用性和可维护性。

Description

基于模板的web页面前端处理装置及方法
技术领域
本发明涉及web页面前端处理装置及方法，更具体地，涉及基于模板的web页面前端处理装置及方法。
背景技术
目前，随着计算机和网络应用的日益广泛以及不同领域的业务种类的日益丰富，web页面前端处理装置（例如web客户端，即web前端）及方法变得越来越重要。
在现有的技术方案中，通常采用如下方式实现数据渲染：在从服务器获取到业务数据之后，web客户端通过字符拼接以及创建元素的方式将所述业务数据渲染到指定的页面展示元素中。
然而，现有的技术方案存在如下问题：当web客户端与服务器之间进行复杂而频繁的数据交互时，由于每次接收到业务数据之后均需进行字符拼接以及创建元素以完成数据渲染，故繁琐而费时，从而导致数据处理效率较低，并且由于数据显示代码和逻辑代码混杂在一起，故代码的可读性和维护性较差，
因此，存在如下需求：提供具有高的数据处理效率以及良好的代码复用性和可维护性的基于模板的web页面前端处理装置及方法。
发明内容
为了解决上述现有技术方案所存在的问题，本发明提出了具有高的数据处理效率以及良好的代码复用性和可维护性的基于模板的web页面前端处理装置及方法。
本发明的目的是通过以下技术方案实现的：
一种基于模板的web页面前端处理装置，所述基于模板的web页面前端处理装置包括：
业务数据获取单元，所述业务数据获取单元通过与web服务器的数据交互而获取业务数据；
模板引擎，所述模板引擎基于预定义的web前端模板以及所述业务数据构建渲染代码，其中，所述web前端模板定义数据渲染实现模式；
数据渲染单元，所述数据渲染单元根据HTTP协议执行所述渲染代码以将所述业务数据渲染到web页面的指定区域；
存储单元，所述存储单元用于存储所述预定义的web前端模板；
显示单元，所述显示单元用于显示所述web页面。
在上面所公开的方案中，优选地，所述web前端模板以伪代码的形式实现，并且所述web前端模板包含数据转换标签。
在上面所公开的方案中，优选地，所述模板引擎以如下方式构建所述渲染代码：用所获取的实际业务数据置换所述web前端模板中的数据转换标签。
在上面所公开的方案中，优选地，通过JavaScript的正则表达式实现所述模板引擎。
在上面所公开的方案中，优选地，所述模板引擎在用所获取的实际业务数据置换所述web前端模板中的数据转换标签之前预编译所述web前端模板以将所述web前端模板处理成JavaScript代码形式的函数对象，并且随之以如下方式用所获取的实际业务数据置换所述web前端模板中的数据转换标签：将所获取的实际业务数据作为参数变量赋予所述函数对象。
本发明的目的也可以通过以下技术方案实现：
一种基于模板的web页面前端处理方法，所述方法包括下列步骤：
（A1）web页面前端处理装置从web服务器获取业务数据；
（A2）所述web页面前端处理装置中的模板引擎基于预定义的web前端模板以及所述业务数据构建渲染代码，其中，所述web前端模板定义数据渲染实现模式；
（A3）所述web页面前端处理装置根据HTTP协议执行所述渲染代码以将所述业务数据渲染到web页面的指定区域。
在上面所公开的方案中，优选地，所述web前端模板以伪代码的形式实现，并且所述web前端模板包含数据转换标签。
在上面所公开的方案中，优选地，所述模板引擎以如下方式构建所述渲染代码：用所获取的实际业务数据置换所述web前端模板中的数据转换标签。
在上面所公开的方案中，优选地，通过JavaScript的正则表达式实现所述模板引擎。
在上面所公开的方案中，优选地，所述模板引擎在用所获取的实际业务数据置换所述web前端模板中的数据转换标签之前预编译所述web前端模板以将所述web前端模板处理成JavaScript代码形式的函数对象，并且随之以如下方式用所获取的实际业务数据置换所述web前端模板中的数据转换标签：将所获取的实际业务数据作为参数变量赋予所述函数对象。
本发明所公开的基于模板的web页面前端处理装置及方法具有以下优点：由于数据逻辑代码与数据渲染显示代码相分离且web前端模板能够被预编译，故具有高的数据处理效率以及良好的代码复用性和可维护性。
附图说明
结合附图，本发明的技术特征以及优点将会被本领域技术人员更好地理解，其中：
图1是根据本发明的实施例的基于模板的web页面前端处理装置的示意性结构图；
图2是根据本发明的实施例的基于模板的web页面前端处理方法的流程图。
具体实施方式
图1是根据本发明的实施例的基于模板的web页面前端处理装置的示意性结构图。如图1所示，本发明所公开的基于模板的web页面前端处理装置包括业务数据获取单元1、模板引擎2、数据渲染单元3、存储单元4和显示单元5。所述业务数据获取单元1通过与web服务器的数据交互而获取业务数据。所述模板引擎2基于预定义的web前端模板以及所述业务数据构建渲染代码（例如JavaScript语言代码），其中，所述web前端模板定义数据渲染实现模式（例如其能够定义针对不同业务数据的渲染的字符拼接及元素创建模式）。所述数据渲染单元3根据HTTP协议执行所述渲染代码以将所述业务数据渲染到web页面的指定区域。所述存储单元4用于存储所述预定义的web前端模板。所述显示单元5用于显示所述web页面。
优选地，在本发明所公开的基于模板的web页面前端处理装置中，所述web前端模板以伪代码的形式实现，并且所述web前端模板包含数据转换标签。
优选地，在本发明所公开的基于模板的web页面前端处理装置中，所述模板引擎2以如下方式构建所述渲染代码：用所获取的实际业务数据置换所述web前端模板中的数据转换标签（即将规定好的文本标记替换为目标内容）。
优选地，在本发明所公开的基于模板的web页面前端处理装置中，通过JavaScript的正则表达式实现所述模板引擎2。
优选地，在本发明所公开的基于模板的web页面前端处理装置中，所述模板引擎2在用所获取的实际业务数据置换所述web前端模板中的数据转换标签之前预编译所述web前端模板以将所述web前端模板处理成JavaScript代码形式的函数对象（由此可以实现具有复杂逻辑判断语句、条件判断语句以及循环语句的web前端模板），并且随之以如下方式用所获取的实际业务数据置换所述web前端模板中的数据转换标签：将所获取的实际业务数据作为参数变量赋予所述函数对象。
由上可见，本发明所公开的基于模板的web页面前端处理装置具有下列优点：由于数据逻辑代码与数据渲染显示代码相分离且web前端模板能够被预编译，故具有高的数据处理效率以及良好的代码复用性和可维护性。
图2是根据本发明的实施例的基于模板的web页面前端处理方法的流程图。如图2所示，本发明所公开的基于模板的web页面前端处理方法包括下列步骤：（A1）web页面前端处理装置从web服务器获取业务数据；（A2）所述web页面前端处理装置中的模板引擎基于预定义的web前端模板以及所述业务数据构建渲染代码（例如JavaScript语言代码），其中，所述web前端模板定义数据渲染实现模式（例如其能够定义针对不同业务数据的渲染的字符拼接及元素创建模式）；（A3）所述web页面前端处理装置根据HTTP协议执行所述渲染代码以将所述业务数据渲染到web页面的指定区域。
优选地，在本发明所公开的基于模板的web页面前端处理方法中，所述web前端模板以伪代码的形式实现，并且所述web前端模板包含数据转换标签。
优选地，在本发明所公开的基于模板的web页面前端处理方法中，所述模板引擎以如下方式构建所述渲染代码：用所获取的实际业务数据置换所述web前端模板中的数据转换标签（即将规定好的文本标记替换为目标内容）。
优选地，在本发明所公开的基于模板的web页面前端处理方法中，通过JavaScript的正则表达式实现所述模板引擎。
优选地，在本发明所公开的基于模板的web页面前端处理方法中，所述模板引擎在用所获取的实际业务数据置换所述web前端模板中的数据转换标签之前预编译所述web前端模板以将所述web前端模板处理成JavaScript代码形式的函数对象（由此可以实现具有复杂逻辑判断语句、条件判断语句以及循环语句的web前端模板），并且随之以如下方式用所获取的实际业务数据置换所述web前端模板中的数据转换标签：将所获取的实际业务数据作为参数变量赋予所述函数对象。
由上可见，本发明所公开的基于模板的web页面前端处理方法具有下列优点：由于数据逻辑代码与数据渲染显示代码相分离且web前端模板能够被预编译，故具有高的数据处理效率以及良好的代码复用性和可维护性。
尽管本发明是通过上述的优选实施方式进行描述的，但是其实现形式并不局限于上述的实施方式。应该认识到：在不脱离本发明主旨和范围的情况下，本领域技术人员可以对本发明做出不同的变化和修改。

Claims (10)

1.一种基于模板的web页面前端处理装置，所述基于模板的web页面前端处理装置包括：
业务数据获取单元，所述业务数据获取单元通过与web服务器的数据交互而获取业务数据；
模板引擎，所述模板引擎基于预定义的web前端模板以及所述业务数据构建渲染代码，其中，所述web前端模板定义数据渲染实现模式；
数据渲染单元，所述数据渲染单元根据HTTP协议执行所述渲染代码以将所述业务数据渲染到web页面的指定区域；
存储单元，所述存储单元用于存储所述预定义的web前端模板；
显示单元，所述显示单元用于显示所述web页面。
2.根据权利要求1所述的基于模板的web页面前端处理装置，其特征在于，所述web前端模板以伪代码的形式实现，并且所述web前端模板包含数据转换标签。
3.根据权利要求2所述的基于模板的web页面前端处理装置，其特征在于，所述模板引擎以如下方式构建所述渲染代码：用所获取的实际业务数据置换所述web前端模板中的数据转换标签。
4.根据权利要求3所述的基于模板的web页面前端处理装置，其特征在于，通过JavaScript的正则表达式实现所述模板引擎。
5.根据权利要求4所述的基于模板的web页面前端处理装置，其特征在于，所述模板引擎在用所获取的实际业务数据置换所述web前端模板中的数据转换标签之前预编译所述web前端模板以将所述web前端模板处理成JavaScript代码形式的函数对象，并且随之以如下方式用所获取的实际业务数据置换所述web前端模板中的数据转换标签：将所获取的实际业务数据作为参数变量赋予所述函数对象。
6.一种基于模板的web页面前端处理方法，所述方法包括下列步骤：
（A1）web页面前端处理装置从web服务器获取业务数据；
（A2）所述web页面前端处理装置中的模板引擎基于预定义的web前端模板以及所述业务数据构建渲染代码，其中，所述web前端模板定义数据渲染实现模式；
（A3）所述web页面前端处理装置根据HTTP协议执行所述渲染代码以将所述业务数据渲染到web页面的指定区域。
7.根据权利要求6所述的基于模板的web页面前端处理方法，其特征在于，所述web前端模板以伪代码的形式实现，并且所述web前端模板包含数据转换标签。
8.根据权利要求7所述的基于模板的web页面前端处理方法，其特征在于，所述模板引擎以如下方式构建所述渲染代码：用所获取的实际业务数据置换所述web前端模板中的数据转换标签。
9.根据权利要求8所述的基于模板的web页面前端处理方法，其特征在于，通过JavaScript的正则表达式实现所述模板引擎。
10.根据权利要求9所述的基于模板的web页面前端处理方法，其特征在于，所述模板引擎在用所获取的实际业务数据置换所述web前端模板中的数据转换标签之前预编译所述web前端模板以将所述web前端模板处理成JavaScript代码形式的函数对象，并且随之以如下方式用所获取的实际业务数据置换所述web前端模板中的数据转换标签：将所获取的实际业务数据作为参数变量赋予所述函数对象。
CN201410162023.2A 2014-04-22 2014-04-22 基于模板的web页面前端处理装置及方法 Active CN105005568B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201410162023.2A CN105005568B (zh) 2014-04-22 2014-04-22 基于模板的web页面前端处理装置及方法

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201410162023.2A CN105005568B (zh) 2014-04-22 2014-04-22 基于模板的web页面前端处理装置及方法

Publications (2)

Publication Number Publication Date
CN105005568A true CN105005568A (zh) 2015-10-28
CN105005568B CN105005568B (zh) 2019-10-01

Family

ID=54378244

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201410162023.2A Active CN105005568B (zh) 2014-04-22 2014-04-22 基于模板的web页面前端处理装置及方法

Country Status (1)

Country Link
CN (1) CN105005568B (zh)

Cited By (9)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN106020823A (zh) * 2016-05-19 2016-10-12 浪潮电子信息产业股份有限公司 一种前端Web表现与数据分离以及页面快速响应的方式
CN107066309A (zh) * 2017-05-05 2017-08-18 北京凤凰理理它信息技术有限公司 多项目模板共享方法、系统、计算机程序及电子设备
CN107632826A (zh) * 2016-07-14 2018-01-26 腾讯科技（深圳）有限公司 一种源代码的编译方法和客户端
CN107643889A (zh) * 2016-07-20 2018-01-30 平安科技（深圳）有限公司 基于模板引擎的页面渲染方法和装置
CN107729516A (zh) * 2017-10-26 2018-02-23 北京百度网讯科技有限公司 单页应用展示方法和装置、服务器、设备及可读介质
CN108664245A (zh) * 2018-04-27 2018-10-16 厦门南讯软件科技有限公司 一种基于json自描述结构的网页界面生成方法及装置
CN111125602A (zh) * 2019-12-25 2020-05-08 腾讯音乐娱乐科技（深圳）有限公司 页面构建方法、装置、设备和存储介质
CN112685307A (zh) * 2020-12-30 2021-04-20 平安普惠企业管理有限公司 基于模板引擎的前端页面测试方法、装置及计算机设备
CN114546384A (zh) * 2022-02-24 2022-05-27 盐城金堤科技有限公司 页面展示系统、方法、可读存储介质及电子设备

Citations (7)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20040268231A1 (en) * 2003-06-24 2004-12-30 Microsoft Corporation Content template system
CN101165685A (zh) * 2006-10-19 2008-04-23 国际商业机器公司 用于生成动态网页的方法及装置
CN102510377A (zh) * 2011-10-31 2012-06-20 北京锐安科技有限公司 一种加速网页交互的异步数据处理方法及系统
CN103365847A (zh) * 2012-03-27 2013-10-23 腾讯科技（深圳）有限公司 一种自定义网页文件的生成方法和装置
CN103544024A (zh) * 2013-11-12 2014-01-29 深圳如果技术有限公司 生成浏览器页面的方法、系统及终端设备
US20140033011A1 (en) * 2009-09-23 2014-01-30 Adobe Systems, Inc. Defining Hints for Dynamic Selection of Default Render/Submit/Runtime Configuration
CN103631783A (zh) * 2012-08-21 2014-03-12 百度在线网络技术（北京）有限公司 一种前端页面的生成方法及系统

Patent Citations (7)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20040268231A1 (en) * 2003-06-24 2004-12-30 Microsoft Corporation Content template system
CN101165685A (zh) * 2006-10-19 2008-04-23 国际商业机器公司 用于生成动态网页的方法及装置
US20140033011A1 (en) * 2009-09-23 2014-01-30 Adobe Systems, Inc. Defining Hints for Dynamic Selection of Default Render/Submit/Runtime Configuration
CN102510377A (zh) * 2011-10-31 2012-06-20 北京锐安科技有限公司 一种加速网页交互的异步数据处理方法及系统
CN103365847A (zh) * 2012-03-27 2013-10-23 腾讯科技（深圳）有限公司 一种自定义网页文件的生成方法和装置
CN103631783A (zh) * 2012-08-21 2014-03-12 百度在线网络技术（北京）有限公司 一种前端页面的生成方法及系统
CN103544024A (zh) * 2013-11-12 2014-01-29 深圳如果技术有限公司 生成浏览器页面的方法、系统及终端设备

Cited By (12)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN106020823A (zh) * 2016-05-19 2016-10-12 浪潮电子信息产业股份有限公司 一种前端Web表现与数据分离以及页面快速响应的方式
CN107632826A (zh) * 2016-07-14 2018-01-26 腾讯科技（深圳）有限公司 一种源代码的编译方法和客户端
CN107632826B (zh) * 2016-07-14 2021-03-02 腾讯科技（深圳）有限公司 一种源代码的编译方法和客户端
CN107643889A (zh) * 2016-07-20 2018-01-30 平安科技（深圳）有限公司 基于模板引擎的页面渲染方法和装置
CN107643889B (zh) * 2016-07-20 2020-03-24 平安科技（深圳）有限公司 基于模板引擎的页面渲染方法和装置
CN107066309A (zh) * 2017-05-05 2017-08-18 北京凤凰理理它信息技术有限公司 多项目模板共享方法、系统、计算机程序及电子设备
CN107729516A (zh) * 2017-10-26 2018-02-23 北京百度网讯科技有限公司 单页应用展示方法和装置、服务器、设备及可读介质
CN108664245A (zh) * 2018-04-27 2018-10-16 厦门南讯软件科技有限公司 一种基于json自描述结构的网页界面生成方法及装置
CN111125602A (zh) * 2019-12-25 2020-05-08 腾讯音乐娱乐科技（深圳）有限公司 页面构建方法、装置、设备和存储介质
CN111125602B (zh) * 2019-12-25 2023-11-14 腾讯音乐娱乐科技（深圳）有限公司 页面构建方法、装置、设备和存储介质
CN112685307A (zh) * 2020-12-30 2021-04-20 平安普惠企业管理有限公司 基于模板引擎的前端页面测试方法、装置及计算机设备
CN114546384A (zh) * 2022-02-24 2022-05-27 盐城金堤科技有限公司 页面展示系统、方法、可读存储介质及电子设备

Also Published As

Publication number Publication date
CN105005568B (zh) 2019-10-01

Similar Documents

Publication Publication Date Title
CN105005568A (zh) 基于模板的web页面前端处理装置及方法
CN104484171B (zh) 终端界面设计系统、方法及相关设备
EP3005160B1 (en) Bundle package retrieving
US9323514B2 (en) Resource package indexing
US8954928B2 (en) Version labeling in a version control system
US20140357357A1 (en) Game bundle package
CN104038705B (zh) 视频制作方法和装置
CN102609405A (zh) 一种动态合同文本生成方法和系统
US20140359604A1 (en) Bundle package generation
CN107341014A (zh) 电子设备、技术文档的生成方法及装置
US20140359605A1 (en) Bundle package signing
CN105700925A (zh) 一种app的界面实现方法和装置
CN105183759A (zh) 一种评论图片的方法及装置
CN104850388A (zh) 网页绘制方法及装置
CN103885764A (zh) 网络媒介信息展示系统、方法、装置和服务器
CN109670979B (zh) 布料检测数据处理方法、装置和设备
CN105589739B (zh) 一种流程控制系统及方法
CN111208995A (zh) Ibm主机作业的自动生成方法、系统、装置及存储介质
CN109242934A (zh) 一种动画代码的生成方法及设备
CN103731692A (zh) 贴片数据的播放方法和系统
CN104574461A (zh) 图形建模方法和装置
CN106683033B (zh) 一种乱序OpenGL接口处理方法
US20150036154A1 (en) Methods and apparatuses for displaying text block and processing text block
CN112765506B (zh) 一种页面文本内容显示方法、装置、设备及存储介质
CN112540958B (zh) 文件处理方法、装置、设备及计算机存储介质

Legal Events

Date Code Title Description
C06 Publication
PB01 Publication
C10 Entry into substantive examination
SE01 Entry into force of request for substantive examination
GR01 Patent grant
GR01 Patent grant