CN111125602A - 页面构建方法、装置、设备和存储介质 - Google Patents

页面构建方法、装置、设备和存储介质 Download PDF

Info

Publication number
CN111125602A
CN111125602A CN201911359084.7A CN201911359084A CN111125602A CN 111125602 A CN111125602 A CN 111125602A CN 201911359084 A CN201911359084 A CN 201911359084A CN 111125602 A CN111125602 A CN 111125602A
Authority
CN
China
Prior art keywords
page
file
straight
page template
static
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
CN201911359084.7A
Other languages
English (en)
Other versions
CN111125602B (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.)
Tencent Music Entertainment Technology Shenzhen Co Ltd
Original Assignee
Tencent Music Entertainment Technology Shenzhen 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 Tencent Music Entertainment Technology Shenzhen Co Ltd filed Critical Tencent Music Entertainment Technology Shenzhen Co Ltd
Priority to CN201911359084.7A priority Critical patent/CN111125602B/zh
Publication of CN111125602A publication Critical patent/CN111125602A/zh
Application granted granted Critical
Publication of CN111125602B publication Critical patent/CN111125602B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90Details of database functions independent of the retrieved data types
    • G06F16/95Retrieval from the web
    • G06F16/958Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/30Creation or generation of source code
    • G06F8/36Software reuse
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/40Transformation of program code
    • G06F8/41Compilation

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Software Systems (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Databases & Information Systems (AREA)
  • Data Mining & Analysis (AREA)
  • Information Retrieval, Db Structures And Fs Structures Therefor (AREA)
  • Information Transfer Between Computers (AREA)

Abstract

本公开提供了一种页面构建方法、装置、设备和存储介质,属于互联网技术领域。包括:分别对获取到的页面模板组件和页面功能组件得到第一页面模板文件和页面功能文件;将第一页面模板文件与直出页面服务器内联;根据页面功能文件和内联后的第一页面模板文件,生成第二页面模板文件;根据第一页面模板文件和第二页面模板文件,生成直出页面模板文件;向直出页面服务器发送直出页面模板文件,直出页面服务器接收页面获取请求,生成直出页面文件,向第二终端返回直出页面文件,由第二终端根据直出页面文件渲染直出页面。通过分别对该待构建页面模板中的源文件的不同组件进行编译,提高了代码的复用率,提高了页面的构建效率。

Description

页面构建方法、装置、设备和存储介质
技术领域
本公开涉及互联网技术领域,特别涉及一种页面构建方法、装置、设备和存储介质。
背景技术
终端中常见的浏览器页面有直出页面和静态页面,直出页面因为可以通过一次请求拉取显示页面的首屏内容,大大缩短了首屏内容的显示时间,可以给用户带来更好的用户体验,使其更受开发人员青睐,逐渐替代了静态页面。通常开发人员基于react库(一种前端构建框架,包括多种构建组件和插件库)构建直出页面。但是,react库的文件体积较大,当基于react库为移动终端构建直出页面时,会导致移动终端的页面加载速度降低。
为了解决react库存在的问题,preact库应运而生。preact库是一款react库的轻量化方案,preact库中的文件体积相对react库大大减小。相关技术中,基于preact库构建直出页面时常使用preact-render-to-string库,将获取的页面组件全部进行编译,生成HTML(HyperText Markup Language,超文本标记语言)文件,当终端需要显示直出页面时,根据该HTML文件,在终端的浏览器中渲染该HTML文件,得到直出页面。
上述相关技术中,通过preact库构建已有的静态页面对应的直出页面时,需要开发人员根据页面重新编写直出页面的代码组件,导致静态页面对应的代码组件复用率低,页面构建的效率低。
发明内容
本公开实施例提供了一种页面构建方法、装置、设备和存储介质。用于解决复杂机器学习模型的可信度低,导致机器学习模型的使用范围较窄的问题。
所述技术方案如下:
一方面,提供了一种页面构建方法,所述方法应用于第一终端,所述方法包括:
获取待构建页面模板对应的页面模板组件,以及,获取与直出页面服务器对应的页面功能组件;
对所述页面模板组件进行编译,生成第一页面模板文件;
将所述第一页面模板文件与直出页面服务器内联;
对所述页面功能组件进行编译,得到所述待构建页面模板对应的页面功能文件;
根据所述页面功能文件和与所述直出页面服务器内联的所述第一页面模板文件,生成第二页面模板文件;
根据所述第一页面模板文件和所述第二页面模板文件,生成直出页面模板文件;
向所述直出页面服务器发送所述直出页面模板文件,所述直出页面服务器用于当接收到第二终端发送的页面获取请求时,将所述页面获取请求对应的页面数据加载到所述直出页面模板文件中,生成直出页面文件,向所述第二终端返回所述直出页面文件,由所述第二终端根据所述直出页面文件渲染直出页面。
在一种可能的实现方式中,所述对所述页面模板组件进行编译,生成第一页面模板文件,包括:
从所述页面模板组件中获取超文本标记语言HTML文件;
对所述HTML文件进行编译,生成所述第一页面模板文件。
在另一种可能的实现方式中,所述对所述页面模板组件进行编译,生成第一页面模板文件之后,所述方法还包括:
将所述第一页面模板文件,生成静态页面模板文件;
将所述静态页面模板文件发送给静态页面服务器,所述静态页面服务器用于将所述静态页面模板文件作为所述直出页面模板文件的容灾页面模板文件。
在另一种可能的实现方式中,所述方法还包括:
获取所述直出页面模板文件对应的第一资源统一定位路径;
将所述第一资源统一定位路径中的传输协议替换为静态页面模板对应的静态传输协议,得到所述静态页面模板文件的第二资源统一定位路径;
将所述第一资源统一定位路径和所述第二资源统一定位路径添加到所述直出页面模板文件中,所述第二资源统一定位路径用于所述第二终端通过所述第一资源统一定位路径获取直出页面失败时,基于所述第二资源统一定位路径,从所述静态页面服务器中获取静态页面。
在另一种可能的实现方式中,所述源文件还包括页面控件组件;所述根据所述第一页面模板文件和所述第二页面模板文件,生成直出页面模板文件,包括:
通过所述页面控件组件进行编译,得到页面控件文件;
将所述页面控件文件、所述第一页面模板文件和所述第二页面模板文件组成所述直出页面模板文件。
在另一种可能的实现方式中,所述获取待构建页面模板对应的页面模板组件,包括:
获取源文件,所述源文件为所述待构建页面对应的静态页面模板的源文件;
从所述源文件中,获取所述待构建页面模板对应的页面模板组件。
在另一种可能的实现方式中,所述获取源文件之后,所述方法还包括:
对所述源文件进行格式检测;
当所述源文件的文件格式不是目标文件格式时,将所述源文件的文件格式转换成所述目标文件格式。
在另一种可能的实现方式中,所述对所述页面模板组件进行编译,生成第一页面模板文件之前,所述方法还包括:
确定所述源文件中的模板文件对应的数字指纹;
根据所述数字指纹,对所述源文件进行重命名。
另一方面,提供了一种页面构建方法,所述方法应用于转发服务器,所述方法包括:
接收第二终端发送的第一页面获取请求,所述第一页面获取请求中携带所述直出页面模板文件,所述直出页面模板文件中包括所述直出页面模板文件对应的第一资源统一定位路径;
当基于所述第一资源统一定位路径,从直出页面服务器中获取直出页面失败时,获取静态页面模板文件的第二资源统一定位路径;
根据所述第二资源统一定位路径,向静态页面服务器发送第二页面获取请求;
接收所述静态页面服务器返回的静态页面文件,向所述第二终端返回所述静态页面文件。
在一种可能的实现方式中,所述获取静态页面模板文件的第二资源统一定位路径,包括:
所述直出页面模板文件中包括所述静态页面模板文件的第二资源统一定位路径,从所述直出页面模板文件中获取所述第二资源统一定位路径;或者,
根据所述第一资源统一定位路径,将所述第一资源统一定位路径中的传输协议替换为静态页面模板对应的静态传输协议,得到所述第二资源统一定位路径。
另一方面,提供了一种页面构建装置,所述装置应用于第一终端,所述装置包括:
第一获取模块,用于获取待构建页面模板对应的页面模板组件,以及,获取与直出页面服务器对应的页面功能组件;
第一编译模块,用于对所述页面模板组件进行编译,生成第一页面模板文件;
内联模块,用于将所述第一页面模板文件与直出页面服务器内联;
第二编译模块,用于对所述页面功能组件进行编译,得到所述待构建页面模板对应的页面功能文件;
第一生成模块,用于根据所述页面功能文件和与所述直出页面服务器内联的所述第一页面模板文件,生成第二页面模板文件;
第二生成模块,用于根据所述第一页面模板文件和所述第二页面模板文件,生成直出页面模板文件;
第一发送模块,用于向所述直出页面服务器发送所述直出页面模板文件,所述直出页面服务器用于当接收到第二终端发送的页面获取请求时,将所述页面获取请求对应的页面数据加载到所述直出页面模板文件中,生成直出页面文件,向所述第二终端返回所述直出页面文件,由所述第二终端根据所述直出页面文件渲染直出页面。
在一种可能的实现方式中,所述第一编译模块,还用于从所述页面模板组件中获取超文本标记语言HTML文件;对所述HTML文件进行编译,生成所述第一页面模板文件。
在另一种可能的实现方式中,所述装置还包括:
第三生成模块,用于将所述第一页面模板文件,生成静态页面模板文件;
第二发送模块,用于将所述静态页面模板文件发送给静态页面服务器,所述静态页面服务器用于将所述静态页面模板文件作为所述直出页面模板文件的容灾页面模板文件。
在另一种可能的实现方式中,所述装置还包括:
第二获取模块,用于获取所述直出页面模板文件对应的第一资源统一定位路径;
替换模块,用于将所述第一资源统一定位路径中的传输协议替换为静态页面模板对应的静态传输协议,得到所述静态页面模板文件的第二资源统一定位路径;
添加模块,用于将所述第一资源统一定位路径和所述第二资源统一定位路径添加到所述直出页面模板文件中,所述第二资源统一定位路径用于所述第二终端通过所述第一资源统一定位路径获取直出页面失败时,基于所述第二资源统一定位路径,从所述静态页面服务器中获取静态页面。
在另一种可能的实现方式中,所述源文件还包括页面控件组件;所述第二生成模块,还用于通过所述页面控件组件进行编译,得到页面控件文件;将所述页面控件文件、所述第一页面模板文件和所述第二页面模板文件组成所述直出页面模板文件。
在另一种可能的实现方式中,所述第一获取模块,还用于获取源文件,所述源文件为所述待构建页面对应的静态页面模板的源文件;从所述源文件中,获取所述待构建页面模板对应的页面模板组件。
在另一种可能的实现方式中,所述装置还包括:
检测模块,用于对所述源文件进行格式检测;
转换模块,用于当所述源文件的文件格式不是目标文件格式时,将所述源文件的文件格式转换成所述目标文件格式。
在另一种可能的实现方式中,所述装置还包括:
确定模块,用于确定所述源文件中的模板文件对应的数字指纹;
重命名模块,用于根据所述数字指纹,对所述源文件进行重命名。
另一方面,提供了一种页面构建装置,所述装置应用于转发服务器,所述装置包括:
第一接收模块,用于接收第二终端发送的第一页面获取请求,所述第一页面获取请求中携带所述直出页面模板文件,所述直出页面模板文件中包括所述直出页面模板文件对应的第一资源统一定位路径;
第三获取模块,用于当基于所述第一资源统一定位路径,从直出页面服务器中获取直出页面失败时,获取静态页面模板文件的第二资源统一定位路径;
第三发送模块,用于根据所述第二资源统一定位路径,向静态页面服务器发送第二页面获取请求;
第二接收模块,用于接收所述静态页面服务器返回的静态页面文件,向所述第二终端返回所述静态页面文件。
在一种可能的实现方式中,所述第三获取模块,还用于所述直出页面模板文件中包括所述静态页面模板文件的第二资源统一定位路径,从所述直出页面模板文件中获取所述第二资源统一定位路径;或者,根据所述第一资源统一定位路径,将所述第一资源统一定位路径中的传输协议替换为静态页面模板对应的静态传输协议,得到所述第二资源统一定位路径。
另一方面,提供了一种设备,所述设备包括处理器和存储器,所述存储器中存储至少一条指令,所述至少一条指令由所述处理器加载并执行,以实现如本公开实施例中方法实施例中所述的页面构建方法中第一终端和转发服务器所执行的操作。
另一方面,提供了一种计算机可读存储介质,所述计算机可读存储介质中存储至少一条指令,所述至少一条指令由处理器加载并执行,以实现如本公开实施例中方法实施例中所述的页面构建方法中第一终端和转发服务器所执行的操作。
本公开实施例提供的技术方案带来的有益效果是:
在本公开实施例中,通过获取待构建页面模板对应的不同代码组件,分别对该不同代码组件进行编译,将编译得到的第一页面模板文件和页面功能文件与直出页面服务器内联,得到第二页面模板文件,将该第二页面模板文件和第一页面模板文件生成直出页面模板文件,由于分别对该待构建页面模板中的源文件的不同组件进行编译,避免了重新对直出页面对应的代码组件进行重复编写,提高了代码的复用率,提高了页面的构建效率。
附图说明
为了更清楚地说明本公开实施例中的技术方案,下面将对实施例描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本公开的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其他的附图。
图1是根据本公开示例性实施例示出的一种页面构建方法的实施环境;
图2是根据本公开示例性实施例示出的一种页面构建方法流程图;
图3是根据本公开示例性实施例示出的一种页面构建方法流程图;
图4是根据本公开示例性实施例示出的一种页面构建方法流程图;
图5是根据本公开示例性实施例示出的一种页面构建方法流程图;
图6是根据本公开示例性实施例示出的一种页面构建装置的框图;
图7是根据本公开示例性实施例示出的一种页面构建装置的框图;
图8是根据本公开示例性实施例示出的一种终端的框图;
图9是根据本公开示例性实施例示出的一种服务器的框图。
具体实施方式
为使本公开的目的、技术方案和优点更加清楚,下面将结合附图对本公开实施方式作进一步地详细描述。
这里将详细地对示例性实施例进行说明,其示例表示在附图中。下面的描述涉及附图时,除非另有表示,不同附图中的相同数字表示相同或相似的要素。以下示例性实施例中所描述的实施方式并不代表与本公开相一致的所有实施方式。相反,它们仅是与如所附权利要求书中所详述的、本公开的一些方面相一致的装置和方法的例子。
图1是根据本公开示例性实施例示出的一种页面构建方法的实施环境。参见图1,该实施环境包括:第一终端101、第二终端102、转发服务器103、直出页面服务器104和静态页面服务器105。其中,该第一终端101可以与该直出页面服务器104和静态页面服务器105分别进行数据交互,该第二终端102通过该转发服务器103分别与该直出页面服务器104和静态页面服务器105进行数据交互。
第一终端101获取用户输入的直出页面对应的源文件,该源文件中包括带构建页面模板对应的多种代码组件,例如,页面模板组件、与直出页面服务器104对应的页面功能组件等。当构建直出页面模板文件时,将该源文件中的页面模板组件和页面功能组件等代码组件分别进行编译,将该代码组件的编译结果组成该直出页面模板文件。将该直出页面模板文件发送给直出页面服务器104。第一终端101还用于根据该页面模板组件的编译结果,生成静态页面模板文件,将该静态页面模板文件发送给静态页面服务器105。
第二终端102用于当需要渲染显示页面时,向转发服务器103发送第一页面获取请求,该第一页面获取请求用于将直出页面服务器104发送直出页面文件。转发服务器103接收到第一页面获取请求,根据该第一页面获取请求向直出页面服务器104转发该第一页面获取请求。
当该直出页面服务器104正常工作时,接收转发服务器103发送的第一页面获取请求,根据该直出页面模板文件生成直出页面文件,将该直出页面文件发送给转发服务器103,转发服务器103将该直出页面文件转发给第二终端102。当转发服务器103从该直出页面服务器104中获取直出页面失败时,转发服务器103根据第一页面获取请求向生成第二页面获取请求,向静态页面服务器105发送第二页面获取请求。该静态服务器还用于根据该第二页面获取请求,基于静态页面模板文件生成静态页面文件,将该静态页面文件发送给转发服务器103,转发服务器103将该静态页面文件转发给第二终端102。
第二终端102还用于根据接收到的直出页面文件渲染直出页面,或者,根据静态页面文件,渲染静态页面。
通过获取待构建页面模板对应的不同代码组件,分别对该不同代码组件进行编译,将编译得到的第一页面模板文件和页面功能文件与直出页面服务器104内联,得到第二页面模板文件,将该第二页面模板文件和第一页面模板文件生成直出页面模板文件,由于分别对该待构建页面模板中的源文件的不同组件进行编译,避免了重新对直出页面对应的代码组件进行重复编写,提高了代码的复用率,提高了页面的构建效率。
图2是根据本公开示例性实施例示出的一种页面构建方法流程图。该方法应用于第一终端,如图2所示,该方法包括以下步骤:
步骤201:第一终端获取待构建页面模板对应的页面模板组件。
其中,该页面模板组件用于构成直出页面的框架,即生成直出页面的导航页。该模板文件可以为开发人员编写的页面模板组件,该页面模板组件可以为该待构建页面模板对应的静态页面对应的源文件中的页面模板组件。如图3所示,当该页面模板组件为该待构建页面模板对应的静态页面对应的源文件中的页面模板组件时,第一终端获取待构建页面模板对应的页面模板组件的过程可以为:
(1)获取源文件,该源文件为该待构建页面对应的静态页面模板的源文件。
其中,该源文件为编写待构建页面模板的静态页面模板时,由开发人员编写的代码组件。该静态页面为html+ajax(Asynchronous JavaScript and XML,异步的JavaScript与XML技术,XML,Extensible Markup Language,可扩展标记语言)方式编写的页面。
需要说明的一点是,第一终端可以对该原文件进行格式检查,当该源文件不符合目标格式时,对该源文件进行格式化,得到目标格式的源文件。该过程可以为:第一终端对该源文件进行格式检测;当该源文件的文件格式不是目标文件格式时,将该源文件的文件格式转换成该目标文件格式。其中,该目标格式可以根据用户需要进行设置并修改,在本公开实施中,对该目标格式不作具体限定。
在本实现方式中,通过对源文件进行格式检测,将不同来源的源文件统一为目标格式,从而防止了不同开发人员由于不同的编写习惯造成的源文件格式不统一的问题。
另外,第一终端获取到源文件后,可以根据源文件的数字指纹,对该源文件进行重命名,该过程可以通过以下步骤实现,包括:第一终端确定该源文件中的模板文件对应的数字指纹;根据该数字指纹,对该源文件进行重命名。其中,该数字指纹可以唯一表示该源文件,例如,可以通过MD5(Message Digest Algorithm 5,信息摘要算法第五版)算法,确定该源文件对应的MD5值,根据该MD5值对该源文件进行重命名。例如,构建输入为源文件中的HTML文件,如src/index.html;对于HTML中引用的样式文件,为了避免样式缓存问题,在编译时根据样式文件内容进行MD5值计算,并用此值命名样式文件。
在本实现方式中,通过对源文件进行重命名,避免了样式缓存时出现重复缓存问题。
(2)从该源文件中,获取该待构建页面模板对应的页面模板组件。
该源文件中包括多个代码组件,从该多个代码组件中,获取该页面模板组件,该页面模板组件可以为HTML文件,相应的,该页面模板组件可以为*.html文件。
在本实现方式中,通过获取静态页面对应的源文件,对该源文件进行编译得到直出页面对应的页面模板组件,避免了重复撰写代码组件,提高了代码的复用率,从而提高了页面构建的效率。
步骤202:第一终端获取与直出页面服务器对应的页面功能组件。
其中,该页面功能组件用于根据直出服务器的首屏数据生成该直出页面的功能。例如,搜索功能等。该页面功能组件可以为开发人员编写的功能组件,获取第一终端通过与直出页面服务器的接口获取的直出页面服务器中首屏数据对应的页面功能组将。
通过获取待构建页面模板对应的不同代码组件,分别对该不同代码组件进行编译,将编译得到的第一页面模板文件和页面功能文件与直出页面服务器内联,得到第二页面模板文件,将该第二页面模板文件和第一页面模板文件生成直出页面模板文件,由于分别对该待构建页面模板中的源文件的不同组件进行编译,避免了重新对直出页面对应的代码组件进行重复编写,提高了代码的复用率,提高了页面的构建效率。
步骤203:第一终端对该页面模板组件进行编译,生成第一页面模板文件。
该第一模板文件可以为ejs文件。ejs是一个JavaScript模板库,用来从JSON(一种轻量级的数据交换格式)数据中生成HTML字符串。也即通过该第一页面模板文件可以将从服务器中请求的数据转换为HTML文件,进行渲染。
在本步骤中,第一终端对该页面模板组件进行编译,该编译过程可以为:从该页面模板组件中获取超文本标记语言HTML文件;对该HTML文件进行编译,生成该第一页面模板文件。
在对该页面模板组件进行编译之前,第一终端可以内联HTML中的资源,对于一些通用内联的逻辑如src/inline/ua.js,通过gulp-inline-js(一种内联工具)实现内联到页面模板组件中,生成内联结果inline_result,结果仍为HTML文件。例如,可以将页面颜色等页面显示对应的功能内联到页面模板组件中,生成新的页面模板组件。
生成第一页面模板文件后,可以根据该第一页面模板文件生成静态页面模板文件,将该静态页面模板文件发送给静态页面服务器,作为该直出页面的备份页面。该过程可以通过以下步骤(1)-(3)实现,包括:
(1)第一终端将该第一页面模板文件,生成静态页面模板文件。
在本步骤中,对该第一页面模板文件进行打包,生成该静态页面模板文件。gulp-template用于传输空对象生产不带首屏数据的HTML文件,通过gulp-template对第一页面模板文件进行打包,将第一页面模板文件转换成静态页面模板文件,即备份的HTML文件,作为容灾的备份文件,即最终结果中的static html result(静态HTML结果)。
在一种可能的实现方式中,第一终端生成该第一页面模板文件后,可以直接将该第一页面模板文件确定为静态页面模板文件。在另一种可能的实现方式中,第一终端生成该第一页面模板文件对应的第二统一资源定位路径,将该第二统一资源定位路径添加到该第一页面模板文件中,生成该静态页面模板文件。该过程可以通过以下步骤(1-1)-(1-3)实现,包括:
(1-1)第一终端获取该直出页面模板文件对应的第一资源统一定位路径。
其中,该第一资源统一定位路径可以为URL路径,例如,该第一资源统一定位路径可以为https://i.y.qq.com/n2/m/demo.html。
(1-2)第一终端将该第一资源统一定位路径中的传输协议替换为静态页面模板对应的静态传输协议,得到该静态页面模板文件的第二资源统一定位路径。
在本步骤中,第一终端将该第一资源统一定位路径的一部分替换为静态页面对应的静态输出路径,该静态输出路径可以为location:https://y.qq.com/n2/m/demo.html。
(1-3)第一终端将该第一资源统一定位路径和该第二资源统一定位路径添加到该直出页面模板文件中,该第二资源统一定位路径用于该第二终端通过该第一资源统一定位路径获取直出页面失败时,基于该第二资源统一定位路径,从该静态页面服务器中获取静态页面。
通过同一套代码组件中的页面模板组件生成直出页面对应的静态页面模板文件,将该静态页面模板文件和直出页面模板文件的统一资源定位路径进行关联,使得同一套代码组件对应的静态页面模板文件和作为直出页面模板文件的备份页面存储在静态页面服务器中,防止了直出页面服务器出现故障时,终端中无法显示页面,实现了对直出页面的容灾备份。
(2)第一终端将该静态页面模板文件发送给静态页面服务器。
(3)静态页面服务器接收该静态页面模板文件,将该静态页面模板文件作为该直出页面模板文件的容灾页面模板文件。
在本实现方式中,通过同一套代码组件中的页面模板组件生成直出页面对应的静态页面模板文件,将该静态页面模板文件和直出页面模板文件的统一资源定位路径进行关联,使得同一套代码组件对应的静态页面模板文件和作为直出页面模板文件的备份页面存储在静态页面服务器中,防止了直出页面服务器出现故障时,终端中无法显示页面,实现了对直出页面的容灾备份。
步骤204:第一终端将该第一页面模板文件与直出页面服务器内联。
在本步骤中,第一终端将该第一页面模板文件通过内联工具与直出与页面服务器内联,以实现直出页面服务器直出部分的模板框架。其中,该内联工具可以为gulp-inline-js(一种直出页面的前端构建工具),相应的,在本步骤中,第一终端通过gulp-inline-js将第一页面模板内联到直出页面服务器的入口。该入口可以为源文件中的server.js文件。
步骤205:第一终端对该页面功能组件进行编译,得到该待构建页面模板对应的页面功能文件。
在本步骤中,第一终端以直出页面服务器对应的在第二终端中执行的组件代码,也即直出页面服务器的js(JavaScript,一种编程语言)入口,引用代码组件中的页面功能组件,例如,该直出页面服务器的js入口可以为src/server.js,通过该入口引用代码组件component中的内容可以通过语句src/component/*.jsx实现。其中,直出页面服务器端入口文件可以采用任一规范进行编写,相应的,编译过程中,采用相同的规范进行编译。例如,可以采用commonjs规范进行编写。相应的,在编译该jsx文件时,需要按照commonjs规范进行编译。
本步骤与步骤203中,第一终端对页面模板组件进行编译的过程相似,在此不再赘述。
步骤206:第一终端根据该页面功能文件和与该直出页面服务器内联的该第一页面模板文件,生成第二页面模板文件。
在本步骤中,第一终端将该直出页面服务器内联的该第一页面模板文件和该第一终端根据该页面功能文件,组成该第二页面模板文件。该第二页面模板文件中,可以包括该直出页面的导航框架和该直出页面的具体功能。
步骤207:第一终端根据该第一页面模板文件和该第二页面模板文件,生成直出页面模板文件。
在本步骤之前,第一终端还可以获取该第二终端对应的页面控件组件,根据该页面空间组件生成该终端对应的页面控件文件,将该页面空间文件与该第一页面模板文件外联,组成该页面模板文件,该过程可以为:第一终端通过所述页面控件组件进行编译,得到页面控件文件;将所述页面控件文件、所述第一页面模板文件和所述第二页面模板文件组成所述直出页面模板文件。其中,该页面控件组件可以第二终端对应的页面控件组件,相应的,第一终端根据第二终端对应的在第二终端中执行的组件代码,也即第二终端的js入口,引用代码组件中的页面控件组件,例如,第二终端的js入口可以为src/client/index.js,通过该入口引用代码组件component中的内容可以通过语句ssrc/component/*.jsx实现。其中,直出页面服务器端入口文件可以采用任一规范进行编写,相应的,编译过程中,采用相同的规范进行编译。例如,可以采用iife规范进行编写。相应的,在编译该jsx文件时,需要按照iife规范进行编译。
步骤208:第一终端向该直出页面服务器发送该直出页面模板文件。
该直出页面服务器用于当接收到第二终端发送的页面获取请求时,将该页面获取请求对应的页面数据加载到该直出页面模板文件中,生成直出页面文件,向该第二终端返回该直出页面文件,由该第二终端根据该直出页面文件渲染直出页面。
在本公开实施例中,通过获取待构建页面模板对应的不同代码组件,分别对该不同代码组件进行编译,将编译得到的第一页面模板文件和页面功能文件与直出页面服务器内联,得到第二页面模板文件,将该第二页面模板文件和第一页面模板文件生成直出页面模板文件,由于分别对该待构建页面模板中的源文件的不同组件进行编译,避免了重新对直出页面对应的代码组件进行重复编写,提高了代码的复用率,提高了页面的构建效率。
另外,通过同一套代码组件中的页面模板组件生成直出页面对应的静态页面模板文件,将该静态页面模板文件和直出页面模板文件的统一资源定位路径进行关联,使得同一套代码组件对应的静态页面模板文件和作为直出页面模板文件的备份页面存储在静态页面服务器中,防止了直出页面服务器出现故障时,终端中无法显示页面,实现了对直出页面的容灾备份。
第一终端将直出页面模板文件发送该直出页面服务器,将静态模板页面发送给静态页面服务器后,当第二终端需要获取显示页面时,向转发服务器发送第一页面获取请求,转发服务器将该第一页面获取请求转发给直出页面服务器,当该直出页面服务器正常工作时,从该直出页面服务器中获取直出页面文件,将该直出页面文件发送给第二终端,使第二终端可以将该直出页面文件渲染到页面中;当直出页面服务器出现故障时,转发服务器从该直出页面文件中获取直出页面文件失败,则转发服务器向静态页面服务器转发第二页面获取请求,静态页面服务器根据该第二页面获取请求,获取静态页面文件,静态页面发送给转发服务器,转发服务器将静态页面数据发送给第二终端,第二终端根据静态页面数据渲染静态页面。
图4是根据本公开示例性实施例示出的一种页面构建方法流程图。该方法应用于第二终端、转发服务器、直出页面服务器和静态页面服务器。如图4所示,该方法包括以下步骤:
步骤401:第二终端向转发服务器发送第一页面获取请求。
参见图5,当第二终端接收到页面获取指令时,向转发服务器发送第一页面获取请求。该第一页面获取请求中,携带直出页面的第一资源统一定位路径。
该转发服务器用于接收第二终端发送的页面获取请求,将该页面获取请求发送给直出页面服务器和/或静态页面服务器。其中,该转发服务器可以为任一具有转发功能的服务器,例如,该转发服务器可以为nginx转发服务器。
步骤402:转发服务器接收第二终端发送的第一页面获取请求。
在本步骤中,转发服务器接收第二终端发送的第一页面获取请求,根据该第一页面获取请求向提取该第一页面获取请求中的第一资源统一定位路径。
步骤403:转发服务器基于该第一资源统一定位路径从直出页面服务器中获取直出页面。
转发服务器根据该第一资源统一定位路径向该第一资源统一定位路径对应的直出页面服务器转发该第一页面获取请求。当转发服务器在指定时长内接收到直出页面服务器发送的直出页面文件时,将该直出页面文件发送给第二终端。
当该转发服务器在指定时长内没有接收到直出页面服务器发送的直出页面文件时,确定直出页面服务器出现故障;或者,转发服务器接收到直出页面服务器返回的错误信息时,确定直出页面服务器出现故障。当直出页面服务器出现故障时,执行步骤404。
步骤404:当转发服务器基于该第一资源统一定位路径从直出页面服务器中获取直出页面失败时,获取静态页面模板文件的第二资源统一定位路径。
在一种可能的实现方式中,当转发服务器基于该第一资源统一定位路径从直出页面服务器中获取直出页面失败时,转发服务器可以生成获取失败消息,将该获取失败消息发送给第二终端,第二终端接收到该获取失败消息时,向转发服务器发送第三页面获取请求,该第三页面获取请求中,携带该第二资源统一定位路径,转发服务器从该第三页面获取请求中提取该第二资源统一定位路径。
在一种可能的实现方式中,当转发服务器基于该第一资源统一定位路径从直出页面服务器中获取直出页面失败时,转发服务器根据该第一资源统一定位路径,进行重定向,确定静态页面对应的第二资源统一定位路径。其中,在一种可能的实现方式中,该直出页面模板文件中包括该静态页面模板文件的第二资源统一定位路径,相应的,转发服务器从该直出页面模板文件中获取该第二资源统一定位路径。在另一种可能的实现方式中,转发服务器中存储第一源统一定位路径和第二源统一定位路径的匹配规则,当转发服务器基于该第一资源统一定位路径从直出页面服务器中获取直出页面失败时,根据该匹配规则,重新生成第二资源统一定位路径,该过程可以为:转发服务器根据该第一资源统一定位路径,将该第一资源统一定位路径中的传输协议替换为静态页面模板对应的静态传输协议,得到该第二资源统一定位路径。
在本实现方式中,转发服务器直接根据第一资源统一定位路径进行重定向,确定第二资源统一定位路径,无需再向第二终端发送获取失败消息,从而提高了备份页面的获取速度,提高了第二终端中页面的构建效率。
转发服务器获取到第二资源统一定位路径后,根据该第二资源统一定位路径拉取静态页面文件,从而根据该静态页面文件对直出页面文件进行备份。转发服务器根据该第二资源统一定位路径拉取静态页面文件,从而根据该静态页面文件对直出页面文件进行备份的过程可以为:转发服务器根据所述第二资源统一定位路径,向静态页面服务器发送第二页面获取请求。静态页面服务器接收第二页面获取请求;根据该第二页面获取请求获取静态页面文件,将该静态页面文件发送给转发服务器。转发服务器接收静态页面服务器返回的静态页面文件,向第二终端返回该静态页面文件。第二终端接收该静态页面文件,根据该静态页面文件,在第二终端中渲染静态页面。
在本公开实施例中,通过获取待构建页面模板对应的不同代码组件,分别对该不同代码组件进行编译,将编译得到的第一页面模板文件和页面功能文件与直出页面服务器内联,得到第二页面模板文件,将该第二页面模板文件和第一页面模板文件生成直出页面模板文件,由于分别对该待构建页面模板中的源文件的不同组件进行编译,避免了重新对直出页面对应的代码组件进行重复编写,提高了代码的复用率,提高了页面的构建效率。
另外,通过同一套代码组件中的页面模板组件生成直出页面对应的静态页面模板文件,将该静态页面模板文件和直出页面模板文件的统一资源定位路径进行关联,使得同一套代码组件对应的静态页面模板文件和作为直出页面模板文件的备份页面存储在静态页面服务器中,防止了直出页面服务器出现故障时,终端中无法显示页面,实现了对直出页面的容灾备份。
在本公开实施例中,通过第一终端进行页面构建,相应的,第一终端中安装页面构建应用,开发人员可以通过该页面构建应用构建待构建页面模板。首先,根据脚手架攻击生成示例项目,该脚手架工具可以为gulp工具。该脚手架生成目录如示例一所示。
示例一:
Figure BDA0002336699920000161
Figure BDA0002336699920000171
其中,component组件为源文件对应的多个代码组件的文件夹,主要应用在preact组件,该多个代码组件可以为ES6语法进行编写的代码组件,通过jsx来实现组件模板内容。其中,该组件中的文件内容可以为从原有的静态页面的文件中迁移过来的文件,该静态文件可以为html+ajax方式编写的文件。用户只需要对原有的静态页面的文件进行修改,文件的逻辑可以直接复用,用户无需重新编写文件,提高了开发效率。
app.jsx文件为文件中的主逻辑,用于存储显示的页面的相关内容。该app.jsx的示例代码如示例二所示。
示例二:
Figure BDA0002336699920000172
Figure BDA0002336699920000181
client文件夹用于存放异步外链js文件,本公开实施例中提供的方案可以提供多个终端的入口文件,从而实现将不同的业务逻辑分模块进行,通过该文件获取外链的页面内容。其中,外链的页面内容可以添加在页面的任一位置,例如,外链在页面内容底部。另外,本公开实施例中,对外链的内容计算MD5值,避免版本迭代中缓存带来的问题。
index.html用于同构生成直出页面和静态页面,可以为使用ejs语法编写的文件,通过该文件对直出页面和静态页面中的HTML文件进行异化处理。另外,在本公开提供的方案中,还可以涉及到对页面的显示进行换肤等操作,因此,需要内联一些功能的js代码,例如,换肤逻辑的代码等。内联的内容也可以写入该文件下,index.html的示例代码如示例三所示。
示例三:
Figure BDA0002336699920000182
Figure BDA0002336699920000191
server.js文件为直出页面对应的服务器的入口文件,本公开的实施例提供的方案可以支持多个服务器接口,通过server.js文件向服务器发起数据请求,获取首屏数据,通过preact-render-to-string组件将首屏数据传入component组件中,生成首屏的HTML文件内容,将生成的首屏HTML文件内容传入index.html模板文件中,得到首屏的HTML文件。还可以将获取到的首屏数据传入index.html模板,跟随直出内容直出到HTML文件中,用于在浏览器端设置首屏数据,用直出的首屏数据和已经渲染好的结构做diff算法,避免页面的重复渲染。server.js中生成直出HTML的核心代码如示例四所示,其中indexTpl即index.html模板。
示例四:
Figure BDA0002336699920000201
根据不同的场景,可以使用不同的模板,本公开实施例中,可以支持不同逻辑选择不同的业务模板,引用Tpl文件夹的模板文件,如示例五所示。
示例五:
Figure BDA0002336699920000202
其中,tpl文件夹用于存放需要不同业务场景中需要使用的模板,如示例五中所用到的loginTpl。需要说明的一点是,这部分tpl不会同构生成静态页面的HTML文件。另外,Inline文件夹存放需要内联的js,如实例三中使用的skin.js,ua.js等。
本公开实施例可以为基于gulp进行任务的构建的,gulpfile配置了所有的构建任务,接入页面根据需求配置config.js中的构建配置选项或者直接使用默认配置,运行gulp进行开发构建,运行gulp-p进行生产构建即可在目标目录中生成直出页面,静态页面及相关静态资源。在构建完成后,将生成如示例六所示的构建结果。
示例六:
Figure BDA0002336699920000203
Figure BDA0002336699920000211
其中,在gulp构建中的核心任务列表及各个任务依赖的插件如实例七所示。
示例七:
html-inlinejs处理HTML文件中的内联资源,依赖gulp-inline-js实现;
compile-ejs预编译HTML文件及tpl中的模板,依赖gulp-template实现;
js-inline处理js中的内联资源,包括预编译好的tpl,其他内联js等,依赖gulp-inline-js实现;
generate-static-html根据HTML文件生成静态HTML文件,依赖gulp-template;
compile-clientjs编译外链js,基于rollup编译jsx打包,生产环境需要用gulp-uglify进行代码混淆和压缩;
compile-serverjs编译打包服务器端组件和服务器端入口server.js。
其中,config.js为gulp自定义配置文件,为了让各个不同项目尽量少地修改gulp文件,提取gulp文件中易变化的部分作为配置项,需要通过配置项来自定义一些参数。目前定义了如下参数,更多参数根据实际使用时再不断扩展,在gulpfile中引用该文件中的配置项的值进行个性化构建。在一种可能的实现方式中,支持的自定义配置参数如表1所示。
表1
Figure BDA0002336699920000212
Figure BDA0002336699920000221
在本公开实施例中,通过获取待构建页面模板对应的不同代码组件,分别对该不同代码组件进行编译,将编译得到的第一页面模板文件和页面功能文件与直出页面服务器内联,得到第二页面模板文件,将该第二页面模板文件和第一页面模板文件生成直出页面模板文件,由于分别对该待构建页面模板中的源文件的不同组件进行编译,避免了重新对直出页面对应的代码组件进行重复编写,提高了代码的复用率,提高了页面的构建效率。
图6是根据本公开示例性实施例示出的一种页面构建装置的框图。该装置应用于第一终端,如图6所示,该装置包括:
第一获取模块601,用于获取待构建页面模板对应的页面模板组件,以及,获取与直出页面服务器对应的页面功能组件;
第一编译模块602,用于对该页面模板组件进行编译,生成第一页面模板文件;
内联模块603,用于将该第一页面模板文件与直出页面服务器内联;
第二编译模块604,用于对该页面功能组件进行编译,得到该待构建页面模板对应的页面功能文件;
第一生成模块605,用于根据该页面功能文件和与该直出页面服务器内联的该第一页面模板文件,生成第二页面模板文件;
第二生成模块606,用于根据该第一页面模板文件和该第二页面模板文件,生成直出页面模板文件;
第一发送模块607,用于向该直出页面服务器发送该直出页面模板文件,该直出页面服务器用于当接收到第二终端发送的页面获取请求时,将该页面获取请求对应的页面数据加载到该直出页面模板文件中,生成直出页面文件,向该第二终端返回该直出页面文件,由该第二终端根据该直出页面文件渲染直出页面。
在一种可能的实现方式中,该第一编译模块602,还用于从该页面模板组件中获取超文本标记语言HTML文件;对该HTML文件进行编译,生成该第一页面模板文件。
在另一种可能的实现方式中,该装置还包括:
第三生成模块,用于将该第一页面模板文件,生成静态页面模板文件;
第二发送模块,用于将该静态页面模板文件发送给静态页面服务器,该静态页面服务器用于将该静态页面模板文件作为该直出页面模板文件的容灾页面模板文件。
在另一种可能的实现方式中,该装置还包括:
第二获取模块,用于获取该直出页面模板文件对应的第一资源统一定位路径;
替换模块,用于将该第一资源统一定位路径中的传输协议替换为静态页面模板对应的静态传输协议,得到该静态页面模板文件的第二资源统一定位路径;
添加模块,用于将该第一资源统一定位路径和该第二资源统一定位路径添加到该直出页面模板文件中,该第二资源统一定位路径用于该第二终端通过该第一资源统一定位路径获取直出页面失败时,基于该第二资源统一定位路径,从该静态页面服务器中获取静态页面。
在另一种可能的实现方式中,该源文件还包括页面控件组件;该第二生成模块606,还用于通过该页面控件组件进行编译,得到页面控件文件;将该页面控件文件、该第一页面模板文件和该第二页面模板文件组成该直出页面模板文件。
在另一种可能的实现方式中,该第一获取模块601,还用于获取源文件,该源文件为该待构建页面对应的静态页面模板的源文件;从该源文件中,获取该待构建页面模板对应的页面模板组件。
在另一种可能的实现方式中,该装置还包括:
检测模块,用于对该源文件进行格式检测;
转换模块,用于当该源文件的文件格式不是目标文件格式时,将该源文件的文件格式转换成该目标文件格式。
在另一种可能的实现方式中,该装置还包括:
确定模块,用于确定该源文件中的模板文件对应的数字指纹;
重命名模块,用于根据该数字指纹,对该源文件进行重命名。
在本公开实施例中,通过获取待构建页面模板对应的不同代码组件,分别对该不同代码组件进行编译,将编译得到的第一页面模板文件和页面功能文件与直出页面服务器内联,得到第二页面模板文件,将该第二页面模板文件和第一页面模板文件生成直出页面模板文件,由于分别对该待构建页面模板中的源文件的不同组件进行编译,避免了重新对直出页面对应的代码组件进行重复编写,提高了代码的复用率,提高了页面的构建效率。
图7是根据本公开示例性实施例示出的一种页面构建装置的框图。该装置应用于第一终端,如图7所示,该装置包括:
第一接收模块701,用于接收第二终端发送的第一页面获取请求,该第一页面获取请求中携带该直出页面模板文件,该直出页面模板文件中包括该直出页面模板文件对应的第一资源统一定位路径;
第三获取模块702,用于当基于该第一资源统一定位路径,从直出页面服务器中获取直出页面失败时,获取静态页面模板文件的第二资源统一定位路径;
第三发送模块703,用于根据该第二资源统一定位路径,向静态页面服务器发送第二页面获取请求;
第二接收模块704,用于接收该静态页面服务器返回的静态页面文件,向该第二终端返回该静态页面文件。
在一种可能的实现方式中,该第三获取模块702,还用于该直出页面模板文件中包括该静态页面模板文件的第二资源统一定位路径,从该直出页面模板文件中获取该第二资源统一定位路径;或者,根据该第一资源统一定位路径,将该第一资源统一定位路径中的传输协议替换为静态页面模板对应的静态传输协议,得到该第二资源统一定位路径。
在本公开实施例中,通过获取待构建页面模板对应的不同代码组件,分别对该不同代码组件进行编译,将编译得到的第一页面模板文件和页面功能文件与直出页面服务器内联,得到第二页面模板文件,将该第二页面模板文件和第一页面模板文件生成直出页面模板文件,由于分别对该待构建页面模板中的源文件的不同组件进行编译,避免了重新对直出页面对应的代码组件进行重复编写,提高了代码的复用率,提高了页面的构建效率。
图8示出了本公开一个示例性实施例提供的终端800的结构框图。该终端800可以是:智能手机、平板电脑、MP3播放器(Moving Picture Experts Group Audio Layer III,动态影像专家压缩标准音频层面3)、MP4(Moving Picture Experts Group Audio LayerIV,动态影像专家压缩标准音频层面4)播放器、笔记本电脑或台式电脑。终端800还可能被称为用户设备、便携式终端、膝上型终端、台式终端等其他名称。
通常,终端800包括有:处理器801和存储器802。
处理器801可以包括一个或多个处理核心,比如4核心处理器、8核心处理器等。处理器801可以采用DSP(Digital Signal Processing,数字信号处理)、FPGA(Field-Programmable Gate Array,现场可编程门阵列)、PLA(Programmable Logic Array,可编程逻辑阵列)中的至少一种硬件形式来实现。处理器801也可以包括主处理器和协处理器,主处理器是用于对在唤醒状态下的数据进行处理的处理器,也称CPU(Central ProcessingUnit,中央处理器);协处理器是用于对在待机状态下的数据进行处理的低功耗处理器。在一些实施例中,处理器801可以在集成有GPU(Graphics Processing Unit,图像处理器),GPU用于负责显示屏所需要显示的内容的渲染和绘制。一些实施例中,处理器801还可以包括AI(Artificial Intelligence,人工智能)处理器,该AI处理器用于处理有关机器学习的计算操作。
存储器802可以包括一个或多个计算机可读存储介质,该计算机可读存储介质可以是非暂态的。存储器802还可包括高速随机存取存储器,以及非易失性存储器,比如一个或多个磁盘存储设备、闪存存储设备。在一些实施例中,存储器802中的非暂态的计算机可读存储介质用于存储至少一个指令,该至少一个指令用于被处理器801所执行以实现本公开中方法实施例提供的页面构建方法。
在一些实施例中,终端800还可选包括有:外围设备接口803和至少一个外围设备。处理器801、存储器802和外围设备接口803之间可以通过总线或信号线相连。各个外围设备可以通过总线、信号线或电路板与外围设备接口803相连。具体地,外围设备包括:射频电路804、显示屏805、摄像头组件806、音频电路807、定位组件808和电源809中的至少一种。
外围设备接口803可被用于将I/O(Input/Output,输入/输出)相关的至少一个外围设备连接到处理器801和存储器802。在一些实施例中,处理器801、存储器802和外围设备接口803被集成在同一芯片或电路板上;在一些其他实施例中,处理器801、存储器802和外围设备接口803中的任意一个或两个可以在单独的芯片或电路板上实现,本实施例对此不加以限定。
射频电路804用于接收和发射RF(Radio Frequency,射频)信号,也称电磁信号。射频电路804通过电磁信号与通信网络以及其他通信设备进行通信。射频电路804将电信号转换为电磁信号进行发送,或者,将接收到的电磁信号转换为电信号。可选地,射频电路804包括:天线系统、RF收发器、一个或多个放大器、调谐器、振荡器、数字信号处理器、编解码芯片组、用户身份模块卡等等。射频电路804可以通过至少一种无线通信协议来与其它终端进行通信。该无线通信协议包括但不限于:城域网、各代移动通信网络(2G、3G、4G及5G)、无线局域网和/或WiFi(Wireless Fidelity,无线保真)网络。在一些实施例中,射频电路804还可以包括NFC(Near Field Communication,近距离无线通信)有关的电路,本公开对此不加以限定。
显示屏805用于显示UI(User Interface,用户界面)。该UI可以包括图形、文本、图标、视频及其它们的任意组合。当显示屏805是触摸显示屏时,显示屏805还具有采集在显示屏805的表面或表面上方的触摸信号的能力。该触摸信号可以作为控制信号输入至处理器801进行处理。此时,显示屏805还可以用于提供虚拟按钮和/或虚拟键盘,也称软按钮和/或软键盘。在一些实施例中,显示屏805可以为一个,设置终端800的前面板;在另一些实施例中,显示屏805可以为至少两个,分别设置在终端800的不同表面或呈折叠设计;在再一些实施例中,显示屏805可以是柔性显示屏,设置在终端800的弯曲表面上或折叠面上。甚至,显示屏805还可以设置成非矩形的不规则图形,也即异形屏。显示屏805可以采用LCD(LiquidCrystal Display,液晶显示屏)、OLED(Organic Light-Emitting Diode,有机发光二极管)等材质制备。
摄像头组件806用于采集图像或视频。可选地,摄像头组件806包括前置摄像头和后置摄像头。通常,前置摄像头设置在终端的前面板,后置摄像头设置在终端的背面。在一些实施例中,后置摄像头为至少两个,分别为主摄像头、景深摄像头、广角摄像头、长焦摄像头中的任意一种,以实现主摄像头和景深摄像头融合实现背景虚化功能、主摄像头和广角摄像头融合实现全景拍摄以及VR(Virtual Reality,虚拟现实)拍摄功能或者其它融合拍摄功能。在一些实施例中,摄像头组件806还可以包括闪光灯。闪光灯可以是单色温闪光灯,也可以是双色温闪光灯。双色温闪光灯是指暖光闪光灯和冷光闪光灯的组合,可以用于不同色温下的光线补偿。
音频电路807可以包括麦克风和扬声器。麦克风用于采集用户及环境的声波,并将声波转换为电信号输入至处理器801进行处理,或者输入至射频电路804以实现语音通信。出于立体声采集或降噪的目的,麦克风可以为多个,分别设置在终端800的不同部位。麦克风还可以是阵列麦克风或全向采集型麦克风。扬声器则用于将来自处理器801或射频电路804的电信号转换为声波。扬声器可以是传统的薄膜扬声器,也可以是压电陶瓷扬声器。当扬声器是压电陶瓷扬声器时,不仅可以将电信号转换为人类可听见的声波,也可以将电信号转换为人类听不见的声波以进行测距等用途。在一些实施例中,音频电路807还可以包括耳机插孔。
定位组件808用于定位终端800的当前地理位置,以实现导航或LBS(LocationBased Service,基于位置的服务)。定位组件808可以是基于美国的GPS(GlobalPositioning System,全球定位系统)、中国的北斗系统、俄罗斯的格雷纳斯系统或欧盟的伽利略系统的定位组件。
电源809用于为终端800中的各个组件进行供电。电源809可以是交流电、直流电、一次性电池或可充电电池。当电源809包括可充电电池时,该可充电电池可以支持有线充电或无线充电。该可充电电池还可以用于支持快充技术。
在一些实施例中,终端800还包括有一个或多个传感器810。该一个或多个传感器810包括但不限于:加速度传感器811、陀螺仪传感器812、压力传感器813、指纹传感器814、光学传感器815以及接近传感器816。
加速度传感器811可以检测以终端800建立的坐标系的三个坐标轴上的加速度大小。比如,加速度传感器811可以用于检测重力加速度在三个坐标轴上的分量。处理器801可以根据加速度传感器811采集的重力加速度信号,控制显示屏805以横向视图或纵向视图进行用户界面的显示。加速度传感器811还可以用于游戏或者用户的运动数据的采集。
陀螺仪传感器812可以检测终端800的机体方向及转动角度,陀螺仪传感器812可以与加速度传感器811协同采集用户对终端800的3D动作。处理器801根据陀螺仪传感器812采集的数据,可以实现如下功能:动作感应(比如根据用户的倾斜操作来改变UI)、拍摄时的图像稳定、游戏控制以及惯性导航。
压力传感器813可以设置在终端800的侧边框和/或显示屏805的下层。当压力传感器813设置在终端800的侧边框时,可以检测用户对终端800的握持信号,由处理器801根据压力传感器813采集的握持信号进行左右手识别或快捷操作。当压力传感器813设置在显示屏805的下层时,由处理器801根据用户对显示屏805的压力操作,实现对UI界面上的可操作性控件进行控制。可操作性控件包括按钮控件、滚动条控件、图标控件、菜单控件中的至少一种。
指纹传感器814用于采集用户的指纹,由处理器801根据指纹传感器814采集到的指纹识别用户的身份,或者,由指纹传感器814根据采集到的指纹识别用户的身份。在识别出用户的身份为可信身份时,由处理器801授权该用户执行相关的敏感操作,该敏感操作包括解锁屏幕、查看加密信息、下载软件、支付及更改设置等。指纹传感器814可以被设置终端800的正面、背面或侧面。当终端800上设置有物理按键或厂商Logo时,指纹传感器814可以与物理按键或厂商Logo集成在一起。
光学传感器815用于采集环境光强度。在一个实施例中,处理器801可以根据光学传感器815采集的环境光强度,控制显示屏805的显示亮度。具体地,当环境光强度较高时,调高显示屏805的显示亮度;当环境光强度较低时,调低显示屏805的显示亮度。在另一个实施例中,处理器801还可以根据光学传感器815采集的环境光强度,动态调整摄像头组件806的拍摄参数。
接近传感器816,也称距离传感器,通常设置在终端800的前面板。接近传感器816用于采集用户与终端800的正面之间的距离。在一个实施例中,当接近传感器816检测到用户与终端800的正面之间的距离逐渐变小时,由处理器801控制显示屏805从亮屏状态切换为息屏状态;当接近传感器816检测到用户与终端800的正面之间的距离逐渐变大时,由处理器801控制显示屏805从息屏状态切换为亮屏状态。
本领域技术人员可以理解,图8中示出的结构并不构成对终端800的限定,可以包括比图示更多或更少的组件,或者组合某些组件,或者采用不同的组件布置。
图9是本公开实施例提供的一种服务器的结构示意图,该服务器900可因配置或性能不同而产生比较大的差异,可以包括一个或一个以上处理器(Central ProcessingUnits,CPU)901和一个或一个以上的存储器902,其中,所述存储器902中存储有至少一条指令,所述至少一条指令由所述处理器901加载并执行以实现上述各个方法实施例提供的方法。当然,该服务器900还可以具有有线或无线网络接口、键盘以及输入输出接口等部件,以便进行输入输出,该基站还可以包括其他用于实现设备功能的部件,在此不做赘述。
在示例性实施例中,还提供了一种计算机可读存储介质,计算机可读存储介质中存储至少一条指令,至少一条指令由服务器加载并执行,以实现上述实施例中资源调度方法。该计算机可读存储介质可以是存储器。例如,该计算机可读存储介质可以是ROM(Read-Only Memory,只读存储器)、RAM(Random Access Memory,随机存取存储器)、CD-ROM(Compact Disc Read-Only Memory,紧凑型光盘只读储存器)、磁带、软盘和光数据存储设备等。
本领域普通技术人员可以理解实现上述实施例的全部或部分步骤可以通过硬件来完成,也可以通过程序来指令相关的硬件完成,该的程序可以存储于一种计算机可读存储介质中,上述提到的存储介质可以是只读存储器,磁盘或光盘等。
以上该仅为本公开的可选实施例,并不用以限制本公开,凡在本公开的精神和原则之内,所作的任何修改、等同替换、改进等,均应包含在本公开的保护范围之内。

Claims (22)

1.一种页面构建方法,其特征在于,所述方法应用于第一终端,所述方法包括:
获取待构建页面模板对应的页面模板组件,以及,获取与直出页面服务器对应的页面功能组件;
对所述页面模板组件进行编译,生成第一页面模板文件;
将所述第一页面模板文件与直出页面服务器内联;
对所述页面功能组件进行编译,得到所述待构建页面模板对应的页面功能文件;
根据所述页面功能文件和与所述直出页面服务器内联的所述第一页面模板文件,生成第二页面模板文件;
根据所述第一页面模板文件和所述第二页面模板文件,生成直出页面模板文件;
向所述直出页面服务器发送所述直出页面模板文件,所述直出页面服务器用于当接收到第二终端发送的页面获取请求时,将所述页面获取请求对应的页面数据加载到所述直出页面模板文件中,生成直出页面文件,向所述第二终端返回所述直出页面文件,由所述第二终端根据所述直出页面文件渲染直出页面。
2.根据所述权利要求1所述的方法,其特征在于,所述对所述页面模板组件进行编译,生成第一页面模板文件,包括:
从所述页面模板组件中获取超文本标记语言HTML文件;
对所述HTML文件进行编译,生成所述第一页面模板文件。
3.根据权利要求1所述的方法,其特征在于,所述对所述页面模板组件进行编译,生成第一页面模板文件之后,所述方法还包括:
将所述第一页面模板文件,生成静态页面模板文件;
将所述静态页面模板文件发送给静态页面服务器,所述静态页面服务器用于将所述静态页面模板文件作为所述直出页面模板文件的容灾页面模板文件。
4.根据权利要求3所述的方法,其特征在于,所述方法还包括:
获取所述直出页面模板文件对应的第一资源统一定位路径;
将所述第一资源统一定位路径中的传输协议替换为静态页面模板对应的静态传输协议,得到所述静态页面模板文件的第二资源统一定位路径;
将所述第一资源统一定位路径和所述第二资源统一定位路径添加到所述直出页面模板文件中,所述第二资源统一定位路径用于所述第二终端通过所述第一资源统一定位路径获取直出页面失败时,基于所述第二资源统一定位路径,从所述静态页面服务器中获取静态页面。
5.根据权利要求1所述的方法,其特征在于,所述源文件还包括页面控件组件;所述根据所述第一页面模板文件和所述第二页面模板文件,生成直出页面模板文件,包括:
通过所述页面控件组件进行编译,得到页面控件文件;
将所述页面控件文件、所述第一页面模板文件和所述第二页面模板文件组成所述直出页面模板文件。
6.根据权利要求1所述的方法,其特征在于,所述获取待构建页面模板对应的页面模板组件,包括:
获取源文件,所述源文件为所述待构建页面对应的静态页面模板的源文件;
从所述源文件中,获取所述待构建页面模板对应的页面模板组件。
7.根据权利要求6所述的方法,其特征在于,所述获取源文件之后,所述方法还包括:
对所述源文件进行格式检测;
当所述源文件的文件格式不是目标文件格式时,将所述源文件的文件格式转换成所述目标文件格式。
8.根据权利要求1-7任一项所述的方法,其特征在于,所述对所述页面模板组件进行编译,生成第一页面模板文件之前,所述方法还包括:
确定所述源文件中的模板文件对应的数字指纹;
根据所述数字指纹,对所述源文件进行重命名。
9.一种页面构建方法,其特征在于,所述方法应用于转发服务器,所述方法包括:
接收第二终端发送的第一页面获取请求,所述第一页面获取请求中携带所述直出页面模板文件,所述直出页面模板文件中包括所述直出页面模板文件对应的第一资源统一定位路径;
当基于所述第一资源统一定位路径,从直出页面服务器中获取直出页面失败时,获取静态页面模板文件的第二资源统一定位路径;
根据所述第二资源统一定位路径,向静态页面服务器发送第二页面获取请求;
接收所述静态页面服务器返回的静态页面文件,向所述第二终端返回所述静态页面文件。
10.根据权利要求9所述的方法,其特征在于,所述获取静态页面模板文件的第二资源统一定位路径,包括:
所述直出页面模板文件中包括所述静态页面模板文件的第二资源统一定位路径,从所述直出页面模板文件中获取所述第二资源统一定位路径;或者,
根据所述第一资源统一定位路径,将所述第一资源统一定位路径中的传输协议替换为静态页面模板对应的静态传输协议,得到所述第二资源统一定位路径。
11.一种页面构建装置,其特征在于,所述装置应用于第一终端,所述装置包括:
第一获取模块,用于获取待构建页面模板对应的页面模板组件,以及,获取与直出页面服务器对应的页面功能组件;
第一编译模块,用于对所述页面模板组件进行编译,生成第一页面模板文件;
内联模块,用于将所述第一页面模板文件与直出页面服务器内联;
第二编译模块,用于对所述页面功能组件进行编译,得到所述待构建页面模板对应的页面功能文件;
第一生成模块,用于根据所述页面功能文件和与所述直出页面服务器内联的所述第一页面模板文件,生成第二页面模板文件;
第二生成模块,用于根据所述第一页面模板文件和所述第二页面模板文件,生成直出页面模板文件;
第一发送模块,用于向所述直出页面服务器发送所述直出页面模板文件,所述直出页面服务器用于当接收到第二终端发送的页面获取请求时,将所述页面获取请求对应的页面数据加载到所述直出页面模板文件中,生成直出页面文件,向所述第二终端返回所述直出页面文件,由所述第二终端根据所述直出页面文件渲染直出页面。
12.根据所述权利要求11所述的装置,其特征在于,所述第一编译模块,还用于从所述页面模板组件中获取超文本标记语言HTML文件;对所述HTML文件进行编译,生成所述第一页面模板文件。
13.根据权利要求11所述的装置,其特征在于,所述装置还包括:
第三生成模块,用于将所述第一页面模板文件,生成静态页面模板文件;
第二发送模块,用于将所述静态页面模板文件发送给静态页面服务器,所述静态页面服务器用于将所述静态页面模板文件作为所述直出页面模板文件的容灾页面模板文件。
14.根据权利要求13所述的装置,其特征在于,所述装置还包括:
第二获取模块,用于获取所述直出页面模板文件对应的第一资源统一定位路径;
替换模块,用于将所述第一资源统一定位路径中的传输协议替换为静态页面模板对应的静态传输协议,得到所述静态页面模板文件的第二资源统一定位路径;
添加模块,用于将所述第一资源统一定位路径和所述第二资源统一定位路径添加到所述直出页面模板文件中,所述第二资源统一定位路径用于所述第二终端通过所述第一资源统一定位路径获取直出页面失败时,基于所述第二资源统一定位路径,从所述静态页面服务器中获取静态页面。
15.根据权利要求11所述的装置,其特征在于,所述源文件还包括页面控件组件;所述第二生成模块,还用于通过所述页面控件组件进行编译,得到页面控件文件;将所述页面控件文件、所述第一页面模板文件和所述第二页面模板文件组成所述直出页面模板文件。
16.根据权利要求11所述的装置,其特征在于,所述第一获取模块,还用于获取源文件,所述源文件为所述待构建页面对应的静态页面模板的源文件;从所述源文件中,获取所述待构建页面模板对应的页面模板组件。
17.根据权利要求16所述的装置,其特征在于,所述装置还包括:
检测模块,用于对所述源文件进行格式检测;
转换模块,用于当所述源文件的文件格式不是目标文件格式时,将所述源文件的文件格式转换成所述目标文件格式。
18.根据权利要求11-17任一项所述的装置,其特征在于,所述装置还包括:
确定模块,用于确定所述源文件中的模板文件对应的数字指纹;
重命名模块,用于根据所述数字指纹,对所述源文件进行重命名。
19.一种页面构建装置,其特征在于,所述装置应用于转发服务器,所述装置包括:
第一接收模块,用于接收第二终端发送的第一页面获取请求,所述第一页面获取请求中携带所述直出页面模板文件,所述直出页面模板文件中包括所述直出页面模板文件对应的第一资源统一定位路径;
第三获取模块,用于当基于所述第一资源统一定位路径,从直出页面服务器中获取直出页面失败时,获取静态页面模板文件的第二资源统一定位路径;
第三发送模块,用于根据所述第二资源统一定位路径,向静态页面服务器发送第二页面获取请求;
第二接收模块,用于接收所述静态页面服务器返回的静态页面文件,向所述第二终端返回所述静态页面文件。
20.根据权利要求19所述的装置,其特征在于,所述第三获取模块,还用于所述直出页面模板文件中包括所述静态页面模板文件的第二资源统一定位路径,从所述直出页面模板文件中获取所述第二资源统一定位路径;或者,根据所述第一资源统一定位路径,将所述第一资源统一定位路径中的传输协议替换为静态页面模板对应的静态传输协议,得到所述第二资源统一定位路径。
21.一种设备,其特征在于,所述设备包括处理器和存储器,所述存储器中存储至少一条指令,所述至少一条指令由所述处理器加载并执行,以实现如权利要求1至8任一项所述的页面构建方法,或者,以实现如权利要求9至10任一项所述的页面构建方法。
22.一种计算机可读存储介质,其特征在于,所述计算机可读存储介质中存储至少一条指令,所述至少一条指令由处理器加载并执行,以实现如权利要求1至8任一项所述的页面构建方法,或者,以实现如权利要求9至10任一项所述的页面构建方法。
CN201911359084.7A 2019-12-25 2019-12-25 页面构建方法、装置、设备和存储介质 Active CN111125602B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201911359084.7A CN111125602B (zh) 2019-12-25 2019-12-25 页面构建方法、装置、设备和存储介质

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201911359084.7A CN111125602B (zh) 2019-12-25 2019-12-25 页面构建方法、装置、设备和存储介质

Publications (2)

Publication Number Publication Date
CN111125602A true CN111125602A (zh) 2020-05-08
CN111125602B CN111125602B (zh) 2023-11-14

Family

ID=70502358

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201911359084.7A Active CN111125602B (zh) 2019-12-25 2019-12-25 页面构建方法、装置、设备和存储介质

Country Status (1)

Country Link
CN (1) CN111125602B (zh)

Cited By (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN111783017A (zh) * 2020-07-23 2020-10-16 北京斗米优聘科技发展有限公司 一种h5页面构建方法、装置、电子设备及其计算机可读存储介质
CN112817632A (zh) * 2021-01-27 2021-05-18 豆盟(北京)科技股份有限公司 一种互动页的打包方法、装置
CN113342400A (zh) * 2021-06-29 2021-09-03 上海哔哩哔哩科技有限公司 离线包打包方法、装置及计算机设备

Citations (9)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN105005568A (zh) * 2014-04-22 2015-10-28 中国银联股份有限公司 基于模板的web页面前端处理装置及方法
CN107357890A (zh) * 2017-07-12 2017-11-17 腾讯科技(深圳)有限公司 一种网页文件处理方法、装置及系统和存储设备
CN107368560A (zh) * 2017-07-07 2017-11-21 腾讯科技(深圳)有限公司 移动应用的页面实现方法和装置、计算机可读存储介质
CN107391664A (zh) * 2017-07-19 2017-11-24 广州华多网络科技有限公司 基于web的页面数据处理方法和系统
CN107632826A (zh) * 2016-07-14 2018-01-26 腾讯科技(深圳)有限公司 一种源代码的编译方法和客户端
CN108846087A (zh) * 2018-06-12 2018-11-20 恒生电子股份有限公司 一种页面渲染方法、装置、终端及服务器
US20180341986A1 (en) * 2016-06-03 2018-11-29 Tencent Technology (Shenzhen) Company Limited Information processing method, terminal, backgroundserver and system, storage medium
CN109495553A (zh) * 2018-10-31 2019-03-19 腾讯科技(深圳)有限公司 一种网页显示控制方法、系统及反向代理服务器
CN110471657A (zh) * 2018-05-11 2019-11-19 北京三快在线科技有限公司 网站页面的生成方法及装置

Patent Citations (9)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN105005568A (zh) * 2014-04-22 2015-10-28 中国银联股份有限公司 基于模板的web页面前端处理装置及方法
US20180341986A1 (en) * 2016-06-03 2018-11-29 Tencent Technology (Shenzhen) Company Limited Information processing method, terminal, backgroundserver and system, storage medium
CN107632826A (zh) * 2016-07-14 2018-01-26 腾讯科技(深圳)有限公司 一种源代码的编译方法和客户端
CN107368560A (zh) * 2017-07-07 2017-11-21 腾讯科技(深圳)有限公司 移动应用的页面实现方法和装置、计算机可读存储介质
CN107357890A (zh) * 2017-07-12 2017-11-17 腾讯科技(深圳)有限公司 一种网页文件处理方法、装置及系统和存储设备
CN107391664A (zh) * 2017-07-19 2017-11-24 广州华多网络科技有限公司 基于web的页面数据处理方法和系统
CN110471657A (zh) * 2018-05-11 2019-11-19 北京三快在线科技有限公司 网站页面的生成方法及装置
CN108846087A (zh) * 2018-06-12 2018-11-20 恒生电子股份有限公司 一种页面渲染方法、装置、终端及服务器
CN109495553A (zh) * 2018-10-31 2019-03-19 腾讯科技(深圳)有限公司 一种网页显示控制方法、系统及反向代理服务器

Cited By (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN111783017A (zh) * 2020-07-23 2020-10-16 北京斗米优聘科技发展有限公司 一种h5页面构建方法、装置、电子设备及其计算机可读存储介质
CN112817632A (zh) * 2021-01-27 2021-05-18 豆盟(北京)科技股份有限公司 一种互动页的打包方法、装置
CN113342400A (zh) * 2021-06-29 2021-09-03 上海哔哩哔哩科技有限公司 离线包打包方法、装置及计算机设备

Also Published As

Publication number Publication date
CN111125602B (zh) 2023-11-14

Similar Documents

Publication Publication Date Title
CN108845856B (zh) 基于对象的同步更新方法、装置、存储介质及设备
CN109828802B (zh) 列表视图显示方法、装置及可读介质
CN109359262B (zh) 动画播放方法、装置、终端及存储介质
CN112052008B (zh) 代码检查方法、装置、计算机设备及计算机可读存储介质
CN112000331A (zh) 页面渲染方法、装置、电子设备及存储介质
CN111125602B (zh) 页面构建方法、装置、设备和存储介质
CN111459466B (zh) 代码生成方法、装置、设备及存储介质
CN113190362B (zh) 服务调用方法、装置、计算机设备及存储介质
JP7236551B2 (ja) キャラクタ推薦方法、キャラクタ推薦装置、コンピュータ装置およびプログラム
CN112116690B (zh) 视频特效生成方法、装置及终端
WO2021244267A1 (zh) 应用程序的移植方法、装置、设备及介质
CN111737100A (zh) 数据获取方法、装置、设备及存储介质
CN110543350A (zh) 一种生成页面组件的方法及装置
CN113867848A (zh) 图形接口的调用方法、装置、设备及可读存储介质
CN111191176A (zh) 网站内容更新方法、装置、终端及存储介质
CN112749362A (zh) 控件创建方法、装置、设备及存储介质
CN113687816A (zh) 算子的可执行代码的生成方法及装置
CN107943484B (zh) 执行业务功能的方法和装置
CN110569064B (zh) 接口标识生成方法、装置、设备及存储介质
CN112052419A (zh) 图片加载方法、装置、设备及可读存储介质
CN111294320B (zh) 数据转换的方法和装置
CN111866047B (zh) 数据解码方法、装置、计算机设备及存储介质
CN113268234A (zh) 页面生成方法、装置、终端和存储介质
CN109597951B (zh) 信息分享方法、装置、终端及存储介质
CN112416356A (zh) Json字符串的处理方法、装置、设备及存储介质

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