CN111783004B - 页面嵌入方法、装置及系统 - Google Patents

Abstract

本申请公开了页面嵌入方法、装置及系统、电子设备、计算机可读存储介质，该方法包括：向第二设备发送第一数据请求，所述第一数据请求包括第一标识；接收所述第二设备返回的对应所述第一标识的第二页面html内容；在第一页面远程引用所述js文件，并将所述第二页面html内容放入第一页面html内容中，以展示嵌入后的第一页面；接收作用于所述嵌入后的第一页面的操作，响应于所述操作，根据所述js文件和所述第一资源的相对地址获取所述第一资源，以展示所述第一资源。解决了iframe方式嵌入页面的同源策略问题以及src地址和参数直接暴露的问题，解决不同业务系统之间对接复杂的问题，为业务系统的每个页面提供文档或视频的展示，以供用户学习和熟悉操作流程。

Description

页面嵌入方法、装置及系统

技术领域

本申请涉及信息处理的技术领域，尤其涉及页面嵌入方法、装置及系统、电子设备、计算机可读存储介质。

背景技术

互联网的快速发展促进了电子商务的快速发展，而供需双方的地域差异进一步促成了快递、快运等物流行业的崛起。对于电子商务、物流在内的多数互联网相关行业来说有一个共同特点，所涉及的系统非常多，有的涉及十几个甚至几十个，在各系统之间的兼容和交互上，一般都是由实施人员提供相关系统业务操作文档或者在线沟通来帮助客户解决在操作各系统时所遇到的困难，这种方法的缺点是耗时耗力，效率不高，因此考虑为每个业务系统的操作页面嵌入html页面，用来展示该页面的操作规则，以供用户学习和参考。

传统的页面嵌入方式大多使用iframe方式来嵌入，由于浏览器受同源策略的影响所以对于不同的页面可能会出现跨域的情况，用户访问受到限制，另外，使用iframe嵌入时src地址和参数会也暴露出来，系统的安全性不高。另外由于不同的业务系统使用的传输协议不同，有的系统使用http请求，有的系统使用https请求，导致使用https请求的项目不能直接引入并使用http资源，这样就需要在后台服务器配置转发，也需要接口提供方对一些地址进行处理，因此增加了对接的复杂程度。

鉴于此，有必要改进现有的页面嵌入技术，解决使用iframe方式来嵌入页面时浏览器正常功能受到同源策略影响的问题，提高业务系统的安全性，降低不同业务系统之间对接的复杂程度。

发明内容

本申请的目的在于提供页面嵌入方法、装置及系统、电子设备、计算机可读存储介质，解决现有的页面嵌入技术下浏览器正常功能受同源策略影响、业务系统安全性不够高、不同业务系统间对接复杂的问题。

本申请的目的采用以下技术方案实现：

第一方面，本申请提供了一种页面嵌入方法，应用于第一设备，所述方法包括：向第二设备发送第一数据请求，所述第一数据请求包括第一标识，所述第二设备用于存储第一资源、js文件和对应所述第一标识的第二页面html内容，所述第二页面html内容包括所述第一资源的相对地址；接收所述第二设备返回的对应所述第一标识的第二页面html内容；在第一页面远程引用所述js文件，并将所述第二页面html内容放入第一页面html内容中，以展示嵌入后的第一页面；接收作用于所述嵌入后的第一页面的操作，响应于所述操作，根据所述js文件和所述第一资源的相对地址获取所述第一资源，以展示所述第一资源。该技术方案的有益效果在于，通过第一数据请求中的第一标识动态获取对应的第二页面html内容，将获取到的第二页面html内容传到浏览器，则浏览器可渲染展示嵌入第二页面后的第一页面；并且，嵌入后的第一页面可通过远程引用js文件来实现页面交互，例如光标悬停或点击时触发文档或视频等资源的展示，达到传统嵌入页面的效果，解决了iframe方式嵌入页面的同源策略问题；其中，所展示的资源预先存储于第二设备，其相对地址被包含于第二页面html内容中，js文件调用第二设备的数据接口，通过相对地址读取第一资源并返回至第一设备，第一设备可将第一资源提供给浏览器以供展示，使用相对地址读取资源，解决使用iframe嵌入时src地址和参数直接暴露的问题，提高业务系统的安全性；通过js文件和相对地址读取资源，不需要对资源地址进行处理，解决不同业务系统之间对接复杂的问题。由此，通过文档或视频等资源的展示，为业务系统的每个页面提供该页面的操作规则、业务规则、学习资料、视频教程，以供用户学习和熟悉操作流程。

在一些可能的实现方式中，所述第二设备还用于存储css文件，所述css文件用于指示第二页面在所述第一页面的展示样式；所述在第一页面远程引用所述js文件，包括：在所述第一页面远程引用所述css文件和所述js文件。该技术方案的有益效果在于，通过css文件设置嵌入html内容的样式，该css文件内容例如是第二页面html标签的css层叠样式属性，由此在第一页面远程引用css文件时实现页面的样式效果，该css文件存储于第二设备，独立于第二页面，当存在多个嵌入页面时，可使用同一css文件或不同的css文件以实现页面的样式效果。

在一些可能的实现方式中，所述第一标识包括第一子标识和第二子标识，所述第一子标识用于指示一级分类类型，所述第二子标识用于指示二级分类类型。该技术方案的有益效果在于，通过第一子标识确定一级分类类型，一级分类类型例如是业务系统A或者业务系统B，通过第二子标识确定二级分类类型，二级分类类型例如是运单录入页面或者订单录入页面，由此可以在第一页面中嵌入同一业务系统下属的多个页面。

在一些可能的实现方式中，所述嵌入后的第一页面设置有第一资源展示按钮，所述第一资源展示按钮用于接收所述操作。该技术方案的有益效果在于，通过按钮接收对嵌入后的第一页面操作，相对于检测整个页面以接收操作，检测一个按钮的方式减小了检测区域，同时也符合多数用户的操作习惯。

在一些可能的实现方式中，所述操作包括光标悬停操作或者点击操作。该技术方案的有益效果在于，通过光标悬停或者点击的方式触发对资源的展示。

在一些可能的实现方式中，所述根据所述js文件和所述第一资源的相对地址获取所述第一资源，包括：通过所述js文件向所述第二设备发送第二数据请求，所述第二数据请求包括所述第一资源的相对地址；接收所述第二设备返回的所述第一资源。该技术方案的有益效果在于，向第二设备发送包含相对地址的第二数据请求，通过相对地址定位所展示的第一资源。

第二方面，本申请提供了一种页面嵌入装置，所述装置包括：请求发送模块，用于向第二设备发送第一数据请求，所述第一数据请求包括第一标识，所述第二设备用于存储第一资源、js文件和对应所述第一标识的第二页面html内容，所述第二页面html内容包括所述第一资源的相对地址；数据接收模块，用于接收所述第二设备返回的对应所述第一标识的第二页面html内容；页面嵌入模块，用于在第一页面远程引用所述js文件，并将所述第二页面html内容放入第一页面html内容中，以展示嵌入后的第一页面；资源获取模块，用于接收作用于所述嵌入后的第一页面的操作，响应于所述操作，根据所述js文件和所述第一资源的相对地址获取所述第一资源，以展示所述第一资源。

在一些可能的实现方式中，所述第二设备还用于存储css文件，所述css文件用于指示第二页面在所述第一页面的展示样式；所述页面嵌入模块还用于在所述第一页面远程引用所述css文件和所述js文件。

在一些可能的实现方式中，所述第一标识包括第一子标识和第二子标识，所述第一子标识用于指示一级分类类型，所述第二子标识用于指示二级分类类型。

在一些可能的实现方式中，所述嵌入后的第一页面设置有第一资源展示按钮，所述第一资源展示按钮用于接收所述操作。

在一些可能的实现方式中，所述操作包括光标悬停操作或者点击操作。

在一些可能的实现方式中，所述资源获取模块还用于通过所述js文件向所述第二设备发送第二数据请求，所述第二数据请求包括所述第一资源的相对地址；接收所述第二设备返回的所述第一资源。

第三方面，本申请提供了一种页面嵌入系统，所述系统包括浏览器、第一设备和第二设备；所述浏览器用于向所述第一设备发送获取第一页面的第三数据请求；以及解析嵌入后的第一页面html内容并展示嵌入后的第一页面；以及接收作用于所述嵌入后的第一页面的操作，响应于所述操作，通过所述js文件向所述第二设备发送第二数据请求，所述第二数据请求包括所述第一资源的相对地址；以及展示第一资源；所述第一设备用于响应于所述第三数据请求，向第二设备发送第一数据请求，所述第一数据请求包括第一标识，所述第二设备用于存储所述第一资源、js文件和对应所述第一标识的第二页面html内容，所述第二页面html内容包括所述第一资源的相对地址；以及在第一页面远程引用所述js文件，并将所述第二页面html内容放入第一页面html内容中，将所述嵌入后的第一页面html内容发送至所述浏览器；所述第二设备用于响应于所述第一数据请求，向所述第一设备返回对应所述第一标识的第二页面html内容；以及响应于所述第二数据请求，根据所述第一资源的相对地址获取所述第一资源并返回至所述浏览器。

在一些可能的实现方式中，所述第二设备还用于建立所述第一资源与所述第一标识之间的对应关系。该技术方案的有益效果在于，将需要展示的相关资源与第一标识形成关联，例如在上传文档或视频等资源时对第一页面中的不同菜单进行资源上传，便于人员维护每个菜单对应的资源。

在一些可能的实现方式中，所述第一标识包括第一子标识和第二子标识，所述第一子标识用于指示一级分类类型，所述第二子标识用于指示二级分类类型。

在一些可能的实现方式中，所述第二设备包括第一服务器组至第三服务器组；所述第一服务器组用于存储所述第一资源；所述第二服务器组用于存储对应所述第一标识的第二页面html内容；所述第三服务器组用于存储所述js文件。该技术方案的有益效果在于，将资源、html内容、js文件分别存储于不同的服务器，减轻单一服务器压力。

在一些可能的实现方式中，所述第二设备还用于存储css文件，所述css文件用于指示第二页面在所述第一页面的展示样式；所述第一设备还用于在所述第一页面远程引用所述css文件和所述js文件。

在一些可能的实现方式中，所述嵌入后的第一页面设置有第一资源展示按钮，所述第一资源展示按钮用于接收所述操作。

在一些可能的实现方式中，所述操作包括光标悬停操作或者点击操作。

第四方面，本申请提供了一种页面嵌入的电子设备，包括处理器和存储器，所述存储器用于存储所述处理器的可执行指令，所述处理器被配置为经由执行所述可执行指令来执行上述页面嵌入方法的步骤。

第五方面，本申请提供了一种计算机可读存储介质，其上存储有计算机程序，所述计算机程序被执行时实现上述页面嵌入方法的步骤。

与现有技术相比，本申请的有益效果包括：

本申请公开了页面嵌入方法、装置及系统、电子设备、计算机可读存储介质，通过第一数据请求中的第一标识动态获取对应的第二页面html内容，将获取到的第二页面html内容传到浏览器，则浏览器可渲染展示嵌入第二页面后的第一页面；并且，嵌入后的第一页面可通过远程引用js文件来实现页面交互，例如光标悬停或点击时触发文档或视频等资源的展示，达到传统嵌入页面的效果，解决了iframe方式嵌入页面的同源策略问题；其中，所展示的资源预先存储于第二设备，其相对地址被包含于第二页面html内容中，js文件调用第二设备的数据接口，通过相对地址读取第一资源并返回至第一设备，第一设备可将第一资源提供给浏览器以供展示，使用相对地址读取资源，解决使用iframe嵌入时src地址和参数直接暴露的问题，提高业务系统的安全性；通过js文件和相对地址读取资源，不需要对资源地址进行处理，解决不同业务系统之间对接复杂的问题。由此，通过文档或视频等资源的展示，为业务系统的每个页面提供该页面的操作规则、业务规则、学习资料、视频教程，以供用户学习和熟悉操作流程。

附图说明

下面结合附图和实施例对本申请进一步说明。

图1是本申请实施例提供的一种页面嵌入方法的流程示意图；

图2是本申请实施例提供的一种页面嵌入方法的流程示意图；

图3是本申请实施例提供的一种页面嵌入方法的流程示意图；

图4是本申请实施例提供的一种页面嵌入方法的流程示意图；

图5是本申请实施例提供的一种页面嵌入装置的结构示意图；

图6是本申请实施例提供的一种页面嵌入系统的结构示意图；

图7是本申请实施例提供的一种页面嵌入的电子设备的结构示意图；

图8是本申请实施例提供的一种用于实现页面嵌入方法的程序产品的结构示意图。

具体实施方式

下面，结合附图以及具体实施方式，对本申请做进一步描述，需要说明的是，在不相冲突的前提下，以下描述的各实施例之间或各技术特征之间可以任意组合形成新的实施例。

参见图1，本申请实施例提供了一种页面嵌入方法，应用于第一设备，所述方法包括步骤S101～S104。本文中的第一设备例如是部署了业务系统的服务器，第一设备可以通过浏览器实现与用户之间的交互，浏览器可以设置于第一设备，也可以设置于第一设备以外的第三设备。第一设备可以通过浏览器向用户展示嵌入后的第一页面，还可以检测用户在第一页面上的操作，向用户展示第一资源，其中，第一资源例如是文档或者视频。

步骤S101：向第二设备发送第一数据请求，所述第一数据请求包括第一标识，所述第二设备用于存储第一资源、js文件和对应所述第一标识的第二页面html内容，所述第二页面html内容包括所述第一资源的相对地址。第二设备还可以用于存储css文件，所述css文件用于指示第二页面在所述第一页面的展示样式。其中，第二设备例如是一台或多台服务器，第一资源、css文件、js文件和对应所述第一标识的第二页面html内容可以存储于同一服务器，也可以存储于不同服务器以减轻单一服务器压力。css文件内容例如是第二页面html标签的css层叠样式属性，由此在第一页面远程引用css文件时实现页面的样式效果，该css文件独立于第二页面，当存在多个嵌入页面时，可使用同一css文件或不同的css文件以实现页面的样式效果。js文件独立于第二页面，用以实现将第二页面嵌入第一页面后的交互效果。

在一些可能的实现方式中，所述第一标识可以包括第一子标识和第二子标识，所述第一子标识用于指示一级分类类型，所述第二子标识用于指示二级分类类型。其中，一级分类类型例如是系统类型，系统类型例如是网点系统，二级分类类型例如是网点系统中的菜单页面类型，菜单页面类型例如是运单录入页面或者订单录入页面，由此可以在第一页面中嵌入同一业务系统下属的多个页面。第一标识、第一子标识和第二子标识都是唯一的、不重复的。

步骤S101之前，所述方法还可以包括：接收浏览器发送的获取第一页面的第三数据请求，响应于所述第三数据请求，向第二设备发送所述第一数据请求，其中第一数据请求包括第一标识。显然，第一页面和第一数据请求携带的第一标识相关联，第一标识对应的第二页面html内容将放入第一页面html内容中。在一种实际应用中，第三数据请求也携带所述第一标识。

步骤S102：接收所述第二设备返回的对应所述第一标识的第二页面html内容。步骤S101～S102通过第一数据请求中的第一标识动态获取对应的第二页面html内容。返回的html内容可以包括资源名称、相对地址、创建时间和创建人。

步骤S103：在第一页面远程引用所述js文件，并将所述第二页面html内容放入第一页面html内容中，以展示嵌入后的第一页面。其中，嵌入后的第一页面html内容中包括注入的js文件和第二页面html内容。

在一些可能的实现方式中，可以通过css文件设置嵌入html内容的样式。所述步骤S103可以包括：在第一页面远程引用所述css文件和所述js文件，并将所述第二页面html内容放入所述第一页面html内容中，以展示嵌入后的第一页面。此时，嵌入后的第一页面html内容中包括注入的css文件、js文件和第二页面html内容。

所述步骤S103之后，所述方法还可以包括：将嵌入后的第一页面html内容发送至所述浏览器，以使所述浏览器展示所述嵌入后的第一页面。第一设备将包含css文件、js文件和第二页面html内容的第一页面html内容发送到浏览器，则浏览器可解析html内容，渲染展示嵌入第二页面后的第一页面。

步骤S104：接收作用于所述嵌入后的第一页面的操作，响应于所述操作，根据所述js文件和所述第一资源的相对地址获取所述第一资源，以展示所述第一资源。

在一些可能的实现方式中，可以通过按钮接收对嵌入后的第一页面的操作。具体而言，所述嵌入后的第一页面设置有第一资源展示按钮，所述第一资源展示按钮用于接收所述操作。相对于检测整个页面以接收操作，检测一个按钮的方式减小了检测区域，同时也符合多数用户的操作习惯。

在一些可能的实现方式中，可以通过光标悬停或者点击的方式触发对资源的展示。具体而言，所述操作可以是光标悬停于所述第一资源展示按钮上，或者，所述操作也可以是所述光标点击所述第一资源展示按钮。

在一些可能的实现方式中，所述根据所述js文件和所述第一资源的相对地址获取所述第一资源的步骤，可以包括：通过所述js文件向所述第二设备发送第二数据请求，所述第二数据请求包括所述第一资源的相对地址；接收所述第二设备返回的所述第一资源。向第二设备发送包含相对地址的第二数据请求，通过相对地址定位存储于第二设备上的第一资源。

嵌入后的第一页面可通过远程引用css文件和js文件来实现页面的样式效果和交互效果，解决了iframe方式嵌入页面的同源策略问题。需要注意的是，第二页面html内容与css文件和js文件虽然都存储于第二设备，但它们两两之间可以是相互独立的。

其中，所展示的资源预先存储于第二设备，其相对地址被包含于第二页面html内容中，js文件调用第二设备的数据接口，通过相对地址读取第一资源并返回至第一设备，第一设备可将第一资源提供给浏览器以供展示。使用相对地址读取资源，解决使用iframe嵌入时src地址和参数直接暴露的问题，提高业务系统的安全性。

另一方面，通过js文件和相对地址读取资源，就不需要对资源地址进行处理，解决不同业务系统之间对接复杂的问题。

由此，通过文档或视频等资源的展示，为业务系统的每个页面提供该页面的操作规则、业务规则、学习资料、视频教程，以供用户学习和熟悉操作流程。

参见图2，本申请实施例还提供了一种页面嵌入方法，所述方法包括步骤S201～S205。

步骤S201：第二设备生成第一设备对应的所有标识，其中第一设备对应的所有标识包括第一标识，第一标识包括第一子标识和第二子标识。第一子标识用于唯一地标识可在第一设备上运行的网点系统，第二子标识用于唯一地标识网点系统中的运单录入页面。

第一子标识例如是：0572fd9382bf8c7d5a7dd98f0efafdeaFvXJ2EsLzLj，第二子标识例如是6069bb9f68983ee66f8ca4cfe2a2a5c7z6kjpIjEhyZ。第二设备上可以运行韵学堂系统。网点系统和韵学堂系统可以是同域或者跨域的业务系统。韵学堂系统会主动抓取网点系统新增页面的数据作为第一标识并存储至第二设备中。例如在网点系统中新增一个运单录入页面，则韵学堂系统会主动抓取运单录入页面的相关数据作为第一标识并存储。

步骤S202：第二设备对第一设备及第一设备中的不同菜单进行资源链接的上传，并在上传完成后，将资源数据和第一标识做绑定，绑定信息将保存在第二设备上。具体而言，可以在韵学堂系统上传网点系统运单录入页面的相关文档资料和/或视频资料，与步骤S201中的第一标识形成关联。

所述步骤S201～S202为数据维护阶段，将维护的数据存储到第二设备上，为下面对接步骤提供数据来源。

步骤S203：第一设备请求第二设备，以第一标识作为参数，获取第一页面需要嵌入的第二页面html内容。具体而言，在网点系统后台调用韵学堂系统接口，以步骤S202中网点系统和运单录入页面的唯一标识作为参数来获取第一页面需嵌入的html内容。参数格式例如是json格式。参数“系统ID”可示例性地表示为“System_resource_id”，参数“页面ID”可示例性地表示为“Menu_resource_id”，参数“请求人”可示例性地表示为“User_id”。返回的html字符串内容可以包括维护的文档或视频链接名称、相对地址、创建时间和创建人。

当第一设备发出第一数据请求后，第二设备基于请求中包含的唯一标识，利用步骤S201～S202中维护的数据，动态地组合成html内容并返回给第一设备，第二页面html内容可以包括html元素标签和部分css样式代码，但不包含js代码，也没有引用外部任何文件或链接。

步骤S204：在第一页面远程引用第二设备上提供的css和js文件，以实现嵌入第二页面后的第一页面的样式和交互效果。css文件和js文件在第二设备上存放，独立于第二页面，该css文件内容为第二页面html标签的css层叠样式属性，该js文件主要用来实现嵌入第二页面后的交互效果，当点击第二页面某个html标签中的标题时，js文件会获取第二页面html内容中第一资源的相对地址作为参数，向第二设备发送请求以获取第一资源，然后将第一资源的内容以弹框的形式在第一页面上层以一个新的弹窗页面展示出来，以此来实现嵌入第二页面后页面的交互。第一资源例如是文档或者视频，文档例如是PDF格式或者WORD格式。

步骤S205：将步骤S204中获取的第二页面html内容放入第一页面html内容中，在嵌入后的第一页面中重写第二页面html内容的最外层div标签的css样式，用以为第二页面指定嵌入位置，由第一设备将html内容发送给浏览器进行解析并展示。具体而言，可以在运单录入页面远程引用css文件和js文件，并将步骤S203中获取到的html内容放入运单录入页面的html内容中，再由浏览器来解析嵌入后的运单录入页面html内容，以展示嵌入后的运单录入页面。嵌入后的第一页面展示效果主要依靠引入的css文件来实现。例如，点击运单录入页面的“测试文档”按钮会通过引用的js文件请求韵学堂系统的后台接口获取“测试文档”对应的文档内容并以弹框的形式展示出来，该文档展示效果主要依赖引入的js文件来实现。

参见图3，本申请实施例还提供了一种页面嵌入方法，所述方法包括步骤S301～S306。

步骤S301：韵学堂系统的后台服务器读取系统菜单数据。

步骤S302：韵学堂系统的后台服务器对资源进行维护，资源包括文档、视频等。

步骤S303：网点系统的后台服务器以系统唯一标识和页面唯一标识为参数，向韵学堂系统的服务器请求第二页面html内容。

步骤S304：韵学堂系统的后台服务器做出响应，返回第二页面html内容。

步骤S305：网点系统的后台服务器将请求的第二页面html内容放入第一页面html内容中返回给浏览器。

步骤S306：网点系统的前端浏览器远程调用css文件和js文件，实现嵌入后的第一页面的样式效果和交互效果。

参见图4，本申请实施例还提供了一种页面嵌入方法，所述方法包括步骤S401～S405。

步骤S401：浏览器向第一业务系统的后台服务器发送请求，以获取html页面。

步骤S402：第一业务系统的后台服务器携带唯一标识作为参数，向第二业务系统的后台服务器发送请求，获取第二页面html内容。

步骤S403：第一业务系统的后台服务器生成第一页面，在第一页面引用第二业务系统后台服务器的css和js文件，并将第二页面html内容放入第一页面html中。

步骤S404：第一业务系统的后台服务器将带有第二页面html内容的第一页面html内容返回给浏览器。

步骤S405：浏览器解析html内容展示第一页面和嵌入的第二页面。

参见图5，本申请实施例还提供了一种页面嵌入装置，所述装置包括：请求发送模块201，用于向第二设备发送第一数据请求，所述第一数据请求包括第一标识，所述第二设备用于存储第一资源、js文件和对应所述第一标识的第二页面html内容，所述第二页面html内容包括所述第一资源的相对地址；数据接收模块202，用于接收所述第二设备返回的对应所述第一标识的第二页面html内容；页面嵌入模块203，用于在第一页面远程引用所述js文件，并将所述第二页面html内容放入第一页面html内容中，以展示嵌入后的第一页面；资源获取模块204，用于接收作用于所述嵌入后的第一页面的操作，响应于所述操作，根据所述js文件和所述第一资源的相对地址获取所述第一资源，以展示所述第一资源。

在一些可能的实现方式中，所述第二设备还用于存储css文件，所述css文件用于指示第二页面在所述第一页面的展示样式；所述页面嵌入模块203用于在第一页面远程引用所述css文件和所述js文件。

在一些可能的实现方式中，所述第一标识包括第一子标识和第二子标识，所述第一子标识用于指示一级分类类型，所述第二子标识用于指示二级分类类型。

在一些可能的实现方式中，所述嵌入后的第一页面设置有第一资源展示按钮，所述第一资源展示按钮用于接收所述操作。

在一些可能的实现方式中，所述操作包括光标悬停操作或者点击操作。

在一些可能的实现方式中，所述资源获取模块204还用于通过所述js文件向所述第二设备发送第二数据请求，所述第二数据请求包括所述第一资源的相对地址；接收所述第二设备返回的所述第一资源。

参见图6，本申请实施例还提供了一种页面嵌入系统，所述系统包括浏览器301、第一设备302和第二设备303。

所述浏览器301向所述第一设备302发送获取第一页面的第三数据请求。

所述第一设备302响应于所述第三数据请求，向第二设备303发送第一数据请求，所述第一数据请求包括第一标识，所述第二设备303用于存储第一资源、js文件和对应所述第一标识的第二页面html内容，所述第二页面html内容包括所述第一资源的相对地址。

所述第二设备303响应于所述第一数据请求，向所述第一设备302返回对应所述第一标识的第二页面html内容。

所述第一设备302在第一页面远程引用所述js文件，并将所述第二页面html内容放入第一页面html内容中，将嵌入后的第一页面html内容发送至所述浏览器301。

所述浏览器301解析嵌入后的第一页面html内容并展示嵌入后的第一页面。

所述浏览器301接收作用于所述嵌入后的第一页面的操作，响应于所述操作，通过所述js文件向所述第二设备303发送第二数据请求，所述第二数据请求包括所述第一资源的相对地址。

所述第二设备303响应于所述第二数据请求，根据所述第一资源的相对地址获取所述第一资源并返回至所述浏览器303。

所述浏览器301展示第一资源。

在一些可能的实现方式中，所述第二设备303还用于建立所述第一资源与所述第一标识之间的对应关系。将需要展示的相关资源与第一标识形成关联，例如在上传文档或视频等资源时对第一页面中的不同菜单进行资源上传，便于人员维护每个菜单对应的资源。

在一些可能的实现方式中，所述第一标识包括第一子标识和第二子标识，所述第一子标识用于指示一级分类类型，所述第二子标识用于指示二级分类类型。

在一些可能的实现方式中，所述第二设备303包括第一服务器组至第三服务器组；所述第一服务器组用于存储所述第一资源；所述第二服务器组用于存储对应所述第一标识的第二页面html内容；所述第三服务器组用于存储所述js文件。将资源、html内容、js文件分别存储于不同的服务器，减少单一服务器压力。

在一些可能的实现方式中，所述第二设备303还用于存储css文件，所述css文件用于指示第二页面在所述第一页面的展示样式；所述第一设备302还用于在第一页面远程引用所述css文件和所述js文件。

在一些可能的实现方式中，所述嵌入后的第一页面设置有第一资源展示按钮，所述第一资源展示按钮用于接收所述操作。

在一些可能的实现方式中，所述操作包括光标悬停操作或者点击操作。

参见图7，本申请实施例还提供了一种页面嵌入的电子设备3，电子设备3包括至少一个存储单元31、至少一个处理单元32以及连接不同平台系统的总线33。

存储单元31可以包括易失性存储单元形式的可读介质，例如随机存取存储单元(RAM)311和/或高速缓存存储单元312，还可以进一步包括只读存储单元(ROM)313。

其中，存储单元31还存储有程序产品4，程序产品4可以被处理单元32执行，使得处理单元32执行本申请实施例中页面嵌入方法的步骤(如图1所示)。存储单元31还可以包括具有一组(至少一个)程序模块315的程序/实用工具314，这样的程序模块包括但不限于：操作系统、一个或者多个应用程序、其它程序模块以及程序数据，这些示例中的每一个或某种组合中可能包括网络环境的实现。

相应的，处理单元32可以执行上述的程序产品4，以及可以执行程序/实用工具314。

总线33可以为表示几类总线结构中的一种或多种，包括存储单元总线或者存储单元控制器、外围总线、图形加速端口、处理单元或者使用多种总线结构中的任意总线结构的局域总线。

电子设备3也可以与一个或多个外部设备34例如键盘、指向设备、蓝牙设备等通信，还可与一个或者多个能够与该电子设备3交互的设备通信，和/或与使得该电子设备3能与一个或多个其它计算设备进行通信的任何设备(例如路由器、调制解调器等等)通信。这种通信可以通过输入/输出(I/O)接口35进行。并且，电子设备3还可以通过网络适配器36与一个或者多个网络(例如局域网(LAN)，广域网(WAN)和/或公共网络，例如因特网)通信。网络适配器36可以通过总线33与电子设备3的其它模块通信。应当明白，尽管图7中未示出，可以结合电子设备3使用其它硬件和/或软件模块，包括但不限于：微代码、设备驱动器、冗余处理单元、外部磁盘驱动阵列、RAID系统、磁带驱动器以及数据备份存储平台等。

参见图8，本申请实施例还提供了一种计算机可读存储介质，该计算机可读存储介质用于存储计算机程序，所述计算机程序被执行时实现本申请实施例中页面嵌入方法的步骤(如图1所示)。图8示出了本实施例提供的用于实现上述方法的程序产品4，其可以采用便携式紧凑盘只读存储器(CD-ROM)并包括程序代码，并可以在终端设备，例如个人电脑上运行。然而，本发明的程序产品4不限于此，在本文件中，可读存储介质可以是任何包含或存储程序的有形介质，该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。程序产品4可以采用一个或多个可读介质的任意组合。可读介质可以是可读信号介质或者可读存储介质。可读存储介质例如可以为但不限于电、磁、光、电磁、红外线、或半导体的系统、装置或器件，或者任意以上的组合。可读存储介质的更具体的例子(非穷举的列表)包括：具有一个或多个导线的电连接、便携式盘、硬盘、随机存取存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、光纤、便携式紧凑盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。

计算机可读存储介质可以包括在基带中或者作为载波一部分传播的数据信号，其中承载了可读程序代码。这种传播的数据信号可以采用多种形式，包括但不限于电磁信号、光信号或上述的任意合适的组合。可读存储介质还可以是可读存储介质以外的任何可读介质，该可读介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。可读存储介质上包含的程序代码可以用任何适当的介质传输，包括但不限于无线、有线、光缆、RF等等，或者上述的任意合适的组合。可以以一种或多种程序设计语言的任意组合来编写用于执行本发明操作的程序代码，程序设计语言包括面向对象的程序设计语言诸如Java、C++等，还包括常规的过程式程序设计语言诸如“C”语言或类似的程序设计语言。程序代码可以完全地在用户计算设备上执行、部分地在用户设备上执行、作为一个独立的软件包执行、部分在用户计算设备上部分在远程计算设备上执行、或者完全在远程计算设备或服务器上执行。在涉及远程计算设备的情形中，远程计算设备可以通过任意种类的网络，包括局域网(LAN)或广域网(WAN)，连接到用户计算设备，或者，可以连接到外部计算设备(例如利用因特网服务提供商来通过因特网连接)。

本申请从使用目的上，效能上，进步及新颖性等观点进行阐述，其设置有的实用进步性，已符合专利法所强调的功能增进及使用要件，本申请以上的说明及附图，仅为本申请的较佳实施例而已，并非以此局限本申请，因此，凡一切与本申请构造，装置，特征等近似、雷同的，即凡依本申请专利申请范围所作的等同替换或修饰等，皆应属本申请的专利申请保护的范围之内。

Claims (10)

1.一种页面嵌入方法，其特征在于，应用于第一设备，所述方法包括：

向第二设备发送第一数据请求，所述第一数据请求包括第一标识，所述第二设备用于存储第一资源、js文件和对应所述第一标识的第二页面html内容，所述第二页面html内容包括所述第一资源的相对地址；

接收所述第二设备返回的对应所述第一标识的第二页面html内容；

在第一页面远程引用所述js文件，并将所述第二页面html内容放入第一页面html内容中，以展示嵌入后的第一页面；

接收作用于所述嵌入后的第一页面的操作，响应于所述操作，根据所述js文件和所述第一资源的相对地址获取所述第一资源，以展示所述第一资源。

2.根据权利要求1所述的页面嵌入方法，其特征在于，所述第二设备还用于存储css文件，所述css文件用于指示第二页面在所述第一页面的展示样式；

所述在第一页面远程引用所述js文件，包括：

在所述第一页面远程引用所述css文件和所述js文件。

3.根据权利要求1所述的页面嵌入方法，其特征在于，所述第一标识包括第一子标识和第二子标识，所述第一子标识用于指示一级分类类型，所述第二子标识用于指示二级分类类型。

4.根据权利要求1所述的页面嵌入方法，其特征在于，所述嵌入后的第一页面设置有第一资源展示按钮，所述第一资源展示按钮用于接收所述操作。

5.根据权利要求4所述的页面嵌入方法，其特征在于，所述操作包括光标悬停操作或者点击操作。

6.根据权利要求1所述的页面嵌入方法，其特征在于，所述根据所述js文件和所述第一资源的相对地址获取所述第一资源，包括：

通过所述js文件向所述第二设备发送第二数据请求，所述第二数据请求包括所述第一资源的相对地址；

接收所述第二设备返回的所述第一资源。

7.一种页面嵌入装置，其特征在于，所述装置包括：

请求发送模块，用于向第二设备发送第一数据请求，所述第一数据请求包括第一标识，所述第二设备用于存储第一资源、js文件和对应所述第一标识的第二页面html内容，所述第二页面html内容包括所述第一资源的相对地址；

数据接收模块，用于接收所述第二设备返回的对应所述第一标识的第二页面html内容；

页面嵌入模块，用于在第一页面远程引用所述js文件，并将所述第二页面html内容放入第一页面html内容中，以展示嵌入后的第一页面；

资源获取模块，用于接收作用于所述嵌入后的第一页面的操作，响应于所述操作，根据所述js文件和所述第一资源的相对地址获取所述第一资源，以展示所述第一资源。

8.一种页面嵌入系统，其特征在于，所述系统包括浏览器、第一设备和第二设备；

所述浏览器用于向所述第一设备发送获取第一页面的第三数据请求；以及解析嵌入后的第一页面html内容并展示嵌入后的第一页面；以及接收作用于所述嵌入后的第一页面的操作，响应于所述操作，通过js文件向所述第二设备发送第二数据请求，所述第二数据请求包括所述第一资源的相对地址；以及展示第一资源；

所述第一设备用于响应于所述第三数据请求，向第二设备发送第一数据请求，所述第一数据请求包括第一标识，所述第二设备用于存储第一资源、js文件和对应所述第一标识的第二页面html内容，所述第二页面html内容包括所述第一资源的相对地址；以及在第一页面远程引用所述js文件，并将所述第二页面html内容放入第一页面html内容中，将所述嵌入后的第一页面html内容发送至所述浏览器；

所述第二设备用于响应于所述第一数据请求，向所述第一设备返回对应所述第一标识的第二页面html内容；以及响应于所述第二数据请求，根据所述第一资源的相对地址获取所述第一资源并返回至所述浏览器。

9.根据权利要求8所述的页面嵌入系统，其特征在于，所述第二设备还用于建立所述第一资源与所述第一标识之间的对应关系。

10.根据权利要求8所述的页面嵌入系统，其特征在于，所述第二设备包括第一服务器组至第三服务器组；

所述第一服务器组用于存储所述第一资源；

所述第二服务器组用于存储对应所述第一标识的第二页面html内容；

所述第三服务器组用于存储所述js文件。