CN105912328B - web系统页面的显示方法、装置及web系统 - Google Patents

Abstract

本发明实施例提供了一种web系统页面的显示方法及装置，其中方法包括：获取当前web系统的页面，在所述页面的头部信息中获取配置资源信息；根据所述配置资源信息对所述页面的页面样式进行隐藏；根据所述配置资源信息获取指向共享数据的地址，请求所述共享数据中与当前web系统相关的共享数据；对所述页面的结构和样式进行分析，将分析结果与请求到的共享数据进行结合；将结合后的数据以及被隐藏的所述页面样式中需保留的部分进行渲染。该方法和装置可以在不修改系统全部代码的基础上实现对web系统的无感知修改。

Description

web系统页面的显示方法、装置及web系统

技术领域

本发明涉及互联网领域，尤其涉及一种web系统页面的显示方法、装置及web系统。

背景技术

随着互联网技术的不断发展，纸质流程管理已逐步被电子化流程所替代，在电子化流程的实施中，因为web系统的快捷性和方便性，很多企业采用web系统来实现各种管理的电子化流程。现在一般规模的企业都会涉及到人力、财务、考勤等多个管理系统，对于大型的企业各种管理系统更是数不胜数。这些管理系统都存在着一定的业务复杂性，因此通常不会是由一个团队来完成开发和维护，如何保持这些系统页面样式和交互的统一性是一个技术问题。这里的页面样式指的是页面中各个元素的样式(style)，例如背景的颜色，文本的缩进、对齐，字体，元素的相对、绝对定位和浮动定位等。

现有的方法是指定一个统一的页面样式和交互规范，然后开发者遵从规范来开发，这种方法可以解决前期的统一问题，但是随着系统复杂度的增加，开发者的人数越来越多，对规范的理解也会出现偏差。另外，当对系统页面样式和交互进行改版时，由于代码不统一且分布在各个系统中，必须对多个系统页面中的代码同时进行改动，假设有十个系统，就要十个系统的开发者在同一时间针对不同的代码做统一的修改，会涉及到大量的人力和物力，效率很低。

发明内容

有鉴于此，提出了本发明以便提供一种克服上述问题或至少部分的解决上述问题的一种web系统页面的显示方法及装置。

第一方面，本发明实施例提供了一种web系统页面的显示方法，所述方法包括：获取当前web系统的页面，在所述页面的头部信息中获取配置资源信息；根据所述配置资源信息对所述页面的页面样式进行隐藏；根据所述配置资源信息获取指向共享数据的地址，请求所述共享数据中与当前web系统相关的共享数据；对所述页面的结构和样式进行分析，将分析结果与请求到的共享数据进行结合；将结合后的数据以及被隐藏的所述页面样式中需保留的部分进行渲染。

进一步的，当请求所述共享数据失败时，将被隐藏的所述页面的页面样式进行渲染。

进一步的，根据所述配置资源信息获取指向共享数据的地址，请求所述共享数据中与当前web系统相关的共享数据，包括：根据所述指向共享数据的地址，向所述共享数据所在的域发送跨域数据调用请求；判断是否登录所述共享数据所在的域，如果已登录，则获取所述共享数据中与当前web系统相关的共享数据，否则，跳转到统一登录页面，在统一登录页面进行登录后获取与当前web系统相关的共享数据。

进一步的，跳转到统一登录页面，在统一登录页面进行登录后获取与当前web系统相关的共享数据，包括：新建一个框架；通过所述框架跳转到统一登录页面进行登录cookie的获取；当获取到所述登录cookie后跳转至数据请求页，将与当前web系统相关的共享数据放入所述数据请求页，返回所述框架；使用PostMessage的方式将所述数据请求页的共享数据返回。

进一步的，所述将结合后的数据进行渲染，包括：根据所述配置资源信息中的模板片段，将结合后的数据生成HTML代码；将生成的所述HTML代码插入所述页面中，对插入所述HTML代码的页面进行渲染。

进一步的，将生成的所述HTML代码插入所述页面中，包括：判断所述配置资源信息中是否存在页面插件，如果存在页面插件，执行所述页面插件，并将所述页面插件与生成的所述HTML代码插入所述页面中，对插入所述HTML代码和页面插件的页面进行渲染。

进一步的，所述配置资源信息中包括与所述当前web系统相关的个性化配置，所述个性化配置包括对当前web系统的图标、数据源或特定样式进行配置。

第二方面，本发明实施例提供了一种web系统页面的显示装置，所述装置包括：页面处理模块，用于获取当前web系统的页面，在所述页面的头部信息中获取配置资源信息；隐藏模块，用于根据所述配置资源信息对所述页面的页面样式进行隐藏；请求模块，用于根据所述配置资源信息获取指向共享数据的地址，请求所述共享数据中与当前web系统相关的共享数据；结合模块，用于对所述页面的结构和样式进行分析，将分析结果与请求到的共享数据进行结合；渲染模块，用于并将结合后的数据以及被隐藏的所述页面样式中需保留的部分进行渲染。

进一步的，所述渲染模块还用于当请求所述共享数据失败时，将被隐藏的所述页面的页面样式进行渲染。

进一步的，所述请求模块，包括：调用单元，用于根据所述指向共享数据的地址，向所述共享数据所在的域发送跨域数据调用请求；判断单元，用于判断是否登录所述共享数据所在的域；获取单元，用于如果所述判断单元判断已登录，则获取所述共享数据中与当前web系统相关的共享数据，否则，跳转到统一登录页面，在统一登录页面进行登录后获取与当前web系统相关的共享数据。

进一步的，所述获取单元具体用于：新建一个框架；通过所述框架跳转到统一登录页面进行登录cookie的获取；当获取到所述登录cookie后跳转至数据请求页，将与当前web系统相关的共享数据放入所述数据请求页，返回所述框架；使用PostMessage的方式将所述数据请求页的共享数据返回。

进一步的，所述渲染模块包括：代码生成单元，用于根据所述配置资源信息中的模板片段，将结合后的数据生成HTML代码；渲染单元，用于将生成的所述HTML代码插入所述页面中，对插入所述HTML代码的页面进行渲染。

进一步的，所述渲染模块还包括：判断单元，用于判断所述配置资源信息中是否存在页面插件，所述渲染单元还用于如果存在页面插件，执行所述页面插件，并将所述页面插件与生成的所述HTML代码插入所述页面中，对插入所述HTML代码和页面插件的页面进行渲染。

进一步的，所述配置资源信息中包括与所述当前web系统相关的个性化配置，所述个性化配置包括对当前web系统的图标、数据源或特定样式进行配置。

进一步的，所述配置资源信息中包括与所述当前web系统相关的个性化配置，所述个性化配置包括对当前web系统的图标、数据源或特定样式进行配置。

第三方面，本发明实施例提供了一种web系统，所述系统包括：用户终端和共享数据服务器，所述共享数据服务器用于存储对应不同web系统的共享数据；所述用户终端，用于获取当前web系统的页面，在所述页面的头部信息中获取配置资源信息，根据所述配置资源信息对所述页面的页面样式进行隐藏，根据所述配置资源信息中指向所述共享数据的地址，请求所述共享数据中与当前web系统相关的共享数据，对所述页面的结构和样式进行分析，将分析结果与请求到的共享数据进行结合，将结合后的数据以及被隐藏的所述页面样式中需保留的部分进行渲染。

本发明实施例中的web系统页面的显示方法及装置，开发人员只需要对共享数据进行统一维护，只需要进行一次代码修改就能够实现对多个web系统的样式交互进行统一修改，在对多个系统页面进行改版时，成本大大降低，同时保证了交互样式的统一性。

附图说明

为了更清楚地说明本发明实施例的技术方案，下面将对实施例中所需要使用的附图作简单地介绍，应当理解，以下附图仅示出了本发明的某些实施例，因此不应被看作是对范围的限定，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他相关的附图。

图1示出本发明第一实施例所提供的web系统页面的显示方法及装置的应用环境示意图；

图2示出了本发明实施例提供的用户终端的结构框图；

图3示出本发明第一实施例所提供的web系统页面的显示方法的流程示意图；

图4A示出本发明第一实施例具体示例中待改版的A系统的界面示意图；

图4B示出本发明第一实施例具体示例中待改版的B系统的界面示意图；

图4C示出本发明第一实施例具体示例中待改版的C系统的界面示意图；

图5示出采用本发明第一实施例所提供的web系统页面的显示方法所显示的改版后的C系统的统一界面示意图；

图6示出本发明第二实施例所提供的web系统页面的显示方法的流程示意图；

图7示出本发明第三实施例所提供的web系统页面的显示装置的结构框图；

图8示出图7中部分模块的结构框图；

图9示出图7中另部分模块的结构框图；

图10示出本发明第四实施例所提供的web系统页面的显示装置的结构框图；

图11示出本发明第五实施例所提供的web系统的结构示意图。

具体实施方式

本发明实施例所提供的web系统页面的显示方法及装置可应用于如图1所示的应用环境中。如图1所示，用户终端100、服务器200位于无线网络或有线网络300中，通过该无线网络或有线网络300，用户终端100与服务器200进行数据交互。

于本发明实施例中，用户终端100可以为桌上型电脑，也可以为移动终端设备，例如可以包括智能手机、平板电脑、电子书阅读器、膝上型便携计算机、车载电脑、穿戴式移动终端等等。

图2示出了一种可应用于本发明实施例中的用户终端的结构框图。如图2所示，用户终端100可以包括存储器102、存储控制器104，一个或多个(图中仅示出一个)处理器106、外设接口108、射频模块110、音频模块112、触控屏幕114等。这些组件通过一条或多条通讯总线/信号线116相互通讯。

存储器102可用于存储软件程序以及模块，如本发明实施例中的web系统页面的显示方法及装置对应的程序指令/模块，处理器106通过运行存储在存储器102内的软件程序以及模块，从而执行各种功能应用以及数据处理，如本发明实施例提供的web系统页面的显示方法。

存储器102可包括高速随机存储器，还可包括非易失性存储器，如一个或者多个磁性存储装置、闪存、或者其他非易失性固态存储器。处理器106以及其他可能的组件对存储器102的访问可在存储控制器104的控制下进行。

外设接口108将各种输入/输入装置耦合至处理器106以及存储器102。在一些实施例中，外设接口108，处理器106以及存储控制器104可以在单个芯片中实现。在其他一些实例中，他们可以分别由独立的芯片实现。

射频模块110用于接收以及发送电磁波，实现电磁波与电信号的相互转换，从而与通讯网络或者其他设备进行通讯。

音频模块112向用户提供音频接口，其可包括一个或多个麦克风、一个或者多个扬声器以及音频电路。

触控屏幕114在用户终端100与用户之间同时提供一个输出及输入界面。

可以理解，图2所示的结构仅为示意，用户终端100还可包括比图2中所示更多或者更少的组件，或者具有与图2所示不同的配置。图2中所示的各组件可以采用硬件、软件或其组合实现。

于本发明实施例中，用户终端100中安装有浏览器，与服务器200相对应，为用户提供服务。

可以理解的是，本发明实施例所涉及的页面，也可以称为Web页面，可以是基于超文本标记语言(HyperText Markup Language，HTML)编写的网页(Web Page)，即HTML页面，或者还可以是基于HTML和Java语言编写的网页，即Java服务器页面(Java Server Page，JSP)，或者还可以为其他语言编写的网页，本实施例对此不进行特别限定。

下面将结合本发明实施例中附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分实施例，而不是全部的实施例。通常在此处附图中描述和示出的本发明实施例的组件可以以各种不同的配置来布置和设计。因此，以下对在附图中提供的本发明的实施例的详细描述并非旨在限制要求保护的本发明的范围，而是仅仅表示本发明的选定实施例。基于本发明的实施例，本领域技术人员在没有做出创造性劳动的前提下所获得的所有其他实施例，都属于本发明保护的范围。

第一实施例

图3示出了本发明第一实施例所提供的web系统页面的显示方法的流程示意图，该web系统页面的显示方法可以在用户终端100的浏览器执行，该方法包括以下步骤：

步骤S110，获取当前web系统的页面，在所述页面的头部信息中获取配置资源信息。

用户在当前web系统的浏览器的地址栏输入访问的地址，浏览器会完成DNS的解析、页面获取的流程，当浏览器获取完页面后将会进入到页面解析的流程。

浏览器对页面的解析过程是线性的过程，首先从页面的头部信息开始解析。于本发明实施例中，各个需要进行统一修改的系统中均预先插入了配置资源信息，例如，以配置代码的形式插入配置资源信息。配置资源信息嵌入在需要进行统一修改的系统的页面的头部信息，即Head标签内。当解析到Head标签时，如果有预先配置好的配置资源信息，浏览器将会执行所述配置资源信息并阻塞浏览器的页面解析和渲染流程，直到配置资源信息执行完毕。如果web浏览器在头部信息中没有获取到配置资源信息，则直接对获取到的页面进行解析、渲染即可。

配置资源信息可以直接写在页面中，也可以存在远端服务器，如果直接写在页面中，则直接执行页面中的配置资源信息，如果存在远端服务器，可以在页面中预先加入指向配置资源信息的地址，浏览器可以根据指向配置资源信息的地址请求配置资源信息，如前所述，这个过程会阻塞浏览器的页面解析和渲染流程，当从远端服务器请求到配置资源信息后，会对配置资源信息进行解析。

配置资源信息中包括了获取指向共享数据的地址的信息，可选的，配置资源信息中还可以包括该系统的个性化配置，在个性化配置部分可以对系统的图标、数据源以及特定样式进行配置。

步骤S120，根据所述配置资源信息对所述页面的页面样式进行隐藏。

可选的，配置资源信息中预先设置有用于对当前web系统的页面样式进行隐藏的信息，根据该信息对所述页面的页面样式进行隐藏。具体的，用于对当前web系统的页面样式进行隐藏的信息的设置方式可以是在配置资源信息中预先插入样式标签(style标签)，此标签中插入有基于多个web系统分析得到的选择器，通过选择器对当前web系统的页面样式进行隐藏。由于此时浏览器中对应的DOM Tree、CSSOM Tree和Rendering Tree都还没有构建成功，因此，浏览器在构建rendering tree时，这部分的标签将不会出现在renderingtree中。也就是说被隐藏的部分将不会被渲染，而在后续步骤中，将对被隐藏的页面样式中需要更改的部分继续隐藏，而不需要更改的部分(也就是要保留的部分)进行渲染(参见步骤S150)。

步骤S130，根据所述配置资源信息获取指向共享数据的地址，请求所述共享数据中与当前web系统相关的共享数据。

不同的系统会使用不同的域名，为了保证数据的统一性和可维护性，本发明实施例中的共享数据优选的只存在一个web系统中，这份共享数据可以包括各系统的基本数据，例如菜单信息、用户信息等。当然，共享数据也可以存储在一个独立于该多个web系统的数据库或服务器中。

所述配置资源信息中可以包括共享数据的地址信息，或者能够获取到共享数据地址的标识信息。具体的，当每个系统中的配置资源信息中包括指向共享数据的地址信息时，浏览器可以根据所述指向共享数据的地址，向所述共享数据所在的域发送跨域数据调用请求。当配置资源信息中包括标识信息时，浏览器在解析配置资源信息时通过该标识信息在本地或云端获取指向共享数据的地址，本发明实施例的具体实施方式并不以共享数据的地址的获取方式为限。

具体的，可以采用JSONP(JSON with Padding)方案向所述共享数据所在的域发送数据调用请求，实现对跨域数据的请求。在配置资源信息中，可以包括一个scrip标签(用于定义客户端脚本的标签)，并且给该标签指定请求地址，该请求地址就是指向共享数据的地址。Script标签可以绑定onload事件，在onload事件中会完成对页面是否登录的判断。

请求共享数据时，会携带有所请求的共享数据的系统标识(ID)，例如，假设A系统的系统标识为A，B系统的系统标识为B，C系统的系统标识为C，那么A系统可以请求到与标识A对应的共享数据，B系统可以请求到与标识B对应的共享数据、C系统可以请求到与标识C对应的共享数据。假设D系统希望集成A、B、C三个系统的共享数据，那么D系统的在请求共享数据时，就会携带A、B、C三个系统的标识，D系统可以请求到A、B、C三个系统的共享数据，系统会对A、B、C三个系统的共享数据进行数据合并(merge)。也就是说，可以通过改变不同系统的配置资源信息中需要获取的共享数据所对应系统的系统标识，就可以获得系统标识对应系统的共享数据。当各系统需要将页面样式的一部分跟其他系统的页面样式的对应部分进行合并时，则可以同时请求其他系统的共享数据。通过上述机制，可以实现各系统对其他系统的共享数据的获取和合并。

在获取共享数据时，浏览器判断是否登录所述共享数据所在的域，如果已登录，则获取所述共享数据中与当前web系统相关的共享数据，否则，跳转到统一登录页面，在统一登录页面进行登录后获取与当前web系统相关的共享数据。具体的，可以根据服务器返回的代码中的标志值判断是否登录，如果标志值为真(true)说明已经登录，如果标志值为假(false)则说明未登录。由于该多个web系统都是构建在统一登录的技术架构上，如果当前页面没有登录，则需要跳转到统一登录页面。

如果当前页面没有登录，则获取不了登录的cookie，此时会在onload事件处理函数中新建一个框架(iframe)，这个框架会跳转到统一登录页面进行登录cookie的获取，当获取到cookie后会登录跳转至数据请求页，将与当前web系统相关的共享数据放入所述数据请求页，返回iframe；使用HTML5中引进的PostMessage的方式将所述数据请求页的共享数据返回，完成数据的获取，PostMessage可以实现跨域数据的返回。

Script标签还可以绑定onerror事件，当请求所述共享数据失败时，将被隐藏的所述页面的页面样式进行渲染，也就是当请求的数据无法返回时，可以对页面进行回退，回退到以前的版本，保证系统的可用性。

步骤S140，对所述页面的结构和样式进行分析，将分析结果与请求到的共享数据进行结合。

当完成上述onload事件的注册后，配置资源信息执行完毕，对页面的解析和渲染过程的阻塞就会被解除，因此上述请求共享数据的过程与和浏览器对页面的处理同步进行，不会阻塞对页面的解析，当页面的onload事件触发时，浏览器会对页面的结构和样式进行分析。页面的结构通常包括框结构和层次结构。其中，框结构用来对页面的布局进行分隔，将页面分成几个框。而层次结构是指页面中的元素可能分布在不同的层次中。

通过对页面结构的分析，以及分析每个DOM元素的样式和属性，完成对元素的归类。对元素的归类可以涉及到整体布局类的元素，例如侧边栏、顶部栏和内容区域的类名和标签名，并存储到配置数据库，得到当前web系统的基本数据信息，也就是说配置数据库中会存储页面的原有结构和样式。

浏览器根据所述配置资源信息中的模板片段，将获取的数据插入模板片段生成HTML代码；将生成的所述HTML代码插入所述页面中，其中，模板片段可以是预先配置好的。插入页面后会对页面的结构进行再造，修改页面的原有结构和样式，也就是将分析结果与请求到的共享数据进行结合。修改后可以进一步的分析哪些元素属于内容区域，哪些元素属于头部导航区域，哪些元素属于侧边栏区域等，计算当前页面侧边栏所占的区域的大小或百分比，新的样式中侧边栏所占区域的大小或百分比，然后将新的页面的结构和样式数据写入到配置数据库中，供数据库学习。

在这里需要注意的是，由于HTML代码是插入到页面中的，为了防止和页面中的样式发生冲突，HTML代码中的元素的类名可以是动态生成的，这样就可以使HTML代码中的新样式不对原有页面想要保留的样式造成影响。例如，假设原有的页面中有个元素是按钮(button)，新的样式也有button，如果原有的button和新的button使用相同的类名，原有的button的样式就会影响新的button的样式，动态生成类名可以让以前的样式对新的不会有影响。

在此步骤中，获取到的共享数据中的新的样式和结构与原有的页面的样式和结构结合，在页面的onload事件触发后，对页面的DOM结构进行重塑，将共享数据与原页面的结构和样式进行结合。

由于在浏览器进行渲染前，即完成对原有样式的隐藏，共享数据的请求、共享数据与原有页面的结构数据的结合等，因此，对于用户来说，将不会感知到系统原有样式的影响。

步骤S150，将结合后的数据以及被隐藏的所述页面样式中需保留的部分进行渲染。

下面将结合图4A至图4C以及图5对本实施例进行说明。图4A至图4C分别示出了待改版的A、B、C系统的界面示意图，由图4A至图4C中的界面图可以看出，A系统、B系统和C系统在改版前的侧边栏区域中的内容各不相同。假设改版希望将A系统、B系统和C系统的侧边栏区域改成相同的样式，将侧边栏区域的大小以及所占的比例进行调整，并且改变侧边栏中菜单信息以及用户信息等，但是内容区域中的内容不变。以系统C为例，在本实施例提供的上述方法中，共享数据存放有新的侧边栏区域内的菜单信息以及用户信息。浏览器在执行配置资源信息的代码的过程中，将C系统的原有页面的页面样式进行隐藏，在对页面的结构和样式进行分析的过程中将新共享数据插入到原有页面，对原有页面的结构和样式进行修改，也就是将原有页面的结构和样式和请求得到的共享数据结合。在渲染的过程中，根据结合了共享数据的页面的层次结构和框结构进行布局并将页面绘制(paint)出来，所显示出来的界面如图5所示。从图5可以看出，改版后系统的内容区域中的内容没有改变，侧边栏区域的大小和比例以及菜单信息及用户信息均发生了改变。

通过本发明实施例中的web系统页面的显示方法，可以在不修改系统全部代码的基础上实现对web系统的无感知修改。开发人员只需要对共享数据进行统一维护，只需要进行一次代码修改就能够实现对多个web系统的样式交互进行统一修改，在对多个系统进行改版时，成本大大降低，同时保证了交互样式的统一性。

第二实施例

图6示出了本发明第二实施例所提供的web系统页面的显示方法的流程示意图，该web系统页面的显示方法可以在用户终端100的浏览器执行，该方法包括以下步骤：

步骤S210，获取当前web系统的页面，在所述页面的头部信息中获取配置资源信息，所述配置资源信息包括共享数据和与当前web系统相关的个性化配置。

所述个性化配置例如可以包括对当前web系统的图标、数据源或特定样式进行配置。通过在配置资源信息中给系统的图标、数据源及样式赋上不同的值即可以实现对当前web系统的图标、数据源或特定样式的个性化配置。

步骤S220，根据所述配置资源信息对所述页面的页面样式进行隐藏。

步骤S230，根据所述配置资源信息获取指向共享数据的地址，请求所述共享数据中与当前web系统相关的共享数据。

步骤S240，对所述页面的结构和样式进行分析，将分析结果与请求到的共享数据进行结合。

步骤S250，根据所述配置资源信息中的模板片段，将结合后的数据生成HTML代码。

步骤S260，判断所述配置资源信息中是否存在页面插件，如果存在页面插件，则执行步骤S270，否则，执行步骤S280。

考虑到为web系统提供进一步的个性化定制的需求，可以在页面代码中开放插件接口，使得开发者可以写入插件代码。例如当某web系统需要提供消息通知模块，由于页面代码开放了插件接口，开发者只需要写入插件代码就可以实现对该web系统的个性化定制，不需要更改原系统的代码。

步骤S270，执行所述页面插件，并将所述页面插件与生成的所述HTML代码插入所述页面中，对插入所述HTML代码和页面插件的页面进行渲染。

步骤S280，将生成的所述HTML代码插入所述页面中，对插入所述HTML代码的页面进行渲染。

步骤S290，将被隐藏的页面样式中需保留的部分进行渲染。

可以理解的是，对插入HTML代码的页面进行渲染以及对被隐藏的页面样式中需保留的部分进行渲染可以同时进行。

本实施例通过在配置资源信息中设置系统的个性化配置以及在在页面代码中开放插件接口，可以在对系统进行改版时对不同的系统提供不同的个性化数据，满足各个不同系统的个性化需求。

第三实施例

为进一步说明上述实施例中的web系统页面的显示方法，本发明第三实施例还提供一种web系统页面的显示装置，用于执行第一实施例中的web系统页面的显示方法。图7示出了本实施例提供的web系统页面的显示装置的结构框图，如图7所示，本发明实施例中的web系统页面的显示装置30包括：页面处理模块31，用于获取当前web系统的页面，在所述页面的头部信息中获取配置资源信息；隐藏模块32，用于根据所述配置资源信息对所述页面的页面样式进行隐藏；请求模块33，用于根据所述配置资源信息获取指向共享数据的地址，请求所述共享数据中与当前web系统相关的共享数据；结合模块34，用于对所述页面的结构和样式进行分析，将分析结果与请求到的共享数据进行结合；渲染模块35，用于并将结合后的数据以及被隐藏的所述页面样式中需保留的部分进行渲染。

进一步的，考虑到请求共享数据时可能会出现请求失败的问题，所述渲染模块35还用于当请求所述共享数据失败时，将被隐藏的所述页面的页面样式进行渲染。

进一步的，请参见图8，所述请求模块33具体的可以包括：调用单元331，用于根据所述指向共享数据的地址，向所述共享数据所在的域发送跨域数据调用请求；判断单元332，用于判断是否登录所述共享数据所在的域；获取单元333，用于如果所述判断单元332判断已登录，则获取所述共享数据中与当前web系统相关的共享数据，否则，跳转到统一登录页面，在统一登录页面进行登录后获取与当前web系统相关的共享数据。

进一步的，考虑到未登录到共享数据所在域时需要跳转到统一登录页面的情况，所述获取单元333具体可以用于：新建一个框架；通过所述框架跳转到统一登录页面进行登录cookie的获取；当获取到所述登录cookie后跳转至数据请求页，将与当前web系统相关的共享数据放入所述数据请求页，返回所述框架；使用PostMessage的方式将所述数据请求页的共享数据返回。

进一步的，请参见图9，所述渲染模块35具体可以包括：代码生成单元351，用于根据所述配置资源信息中的模板片段，将结合后的数据生成HTML代码；渲染单元352，用于将生成的所述HTML代码插入所述页面中，对插入所述HTML代码的页面进行渲染。

本实施例中的各模块可以是由软件代码实现，此时，上述的各模块可存储于用户终端100的存储器102内。以上各模块同样可以由硬件例如集成电路芯片实现。

通过本实施例中的装置，可以在不修改系统全部代码的基础上实现对web系统的无感知修改。开发人员只需要对共享数据进行统一维护，只需要进行一次代码修改就能够实现对多个web系统的样式交互进行统一修改，在对多个系统进行改版时，成本大大降低，同时保证了交互样式的统一性。

第四实施例

为进一步说明上述实施例中的web系统页面的显示方法，本发明第四实施例还提供一种web系统页面的显示装置，用于执行第二实施例中的web系统页面的显示方法。图10出了本实施例提供的web系统页面的显示装置的结构框图，如图10示，本发明实施例中的web系统页面的显示装置40包括：页面处理模块41，用于获取当前web系统的页面，在所述页面的头部信息中获取配置资源信息；隐藏模块42，用于根据所述配置资源信息对所述页面的页面样式进行隐藏；请求模块43，用于根据所述配置资源信息获取指向共享数据的地址，请求所述共享数据中与当前web系统相关的共享数据；结合模块44，用于对所述页面的结构和样式进行分析，将分析结果与请求到的共享数据进行结合；渲染模块45，用于并将结合后的数据以及被隐藏的所述页面样式中需保留的部分进行渲染。

进一步的，所述渲染模块45可以包括：代码生成单元451，用于根据所述配置资源信息中的模板片段，将结合后的数据生成HTML代码；渲染单元452，用于将生成的所述HTML代码插入所述页面中，对插入所述HTML代码的页面进行渲染。

进一步的，考虑到为web系统提供深度个性化定制的需求，可以在配置资源信息中开放插件接口，使得开发者可以写入插件代码。所述渲染模块45还包括：判断单元453，用于判断所述配置资源信息中是否存在页面插件，所述渲染单元还用于如果存在页面插件，执行所述页面插件，并将所述页面插件与生成的所述HTML代码插入所述页面中，对插入所述HTML代码和页面插件的页面进行渲染。

进一步的，考虑到为web系统提供个性化配置的问题，所述配置资源信息中可以包括与所述当前web系统相关的个性化配置，所述个性化配置可以包括对当前web系统的图标、数据源或特定样式等进行配置。

通过本实施例中的装置，可以通过执行页面中的页面插件或者配置资源信息中的个性化配置，实现对web系统的个性化修改，并可以在不修改系统全部代码的基础上实现对web系统的无感知修改。

本实施例中的各模块可以是由软件代码实现，此时，上述的各模块可存储于用户终端100的存储器102内。以上各模块同样可以由硬件例如集成电路芯片实现。

第五实施例

图11示出本发明第五实施例所提供的web系统的结构示意图。如图11所示，本所述系统包括：用户终端100和共享数据服务器200。

所述共享数据服务器200用于存储对应不同web系统的共享数据。

所述浏览器用于获取当前web系统的页面，在所述页面的头部信息中获取配置资源信息，根据所述配置资源信息对所述页面的页面样式进行隐藏，根据所述配置资源信息中指向所述共享数据的地址，请求所述共享数据中与当前web系统相关的共享数据，对所述页面的结构和样式进行分析，将分析结果与请求到的共享数据进行结合，将结合后的数据以及被隐藏的所述页面样式中需保留的部分进行渲染。

综上所述，本发明实施例提供的web系统页面的显示方法和装置，开发人员只需要对共享数据进行统一维护，只需要进行一次代码修改就能够实现对多个web系统的样式交互进行统一修改，在对多个系统页面进行改版时，成本大大降低，同时保证了交互样式的统一性。

本发明实施例所提供的web系统页面的显示装置可以为设备上的特定硬件或者安装于设备上的软件或固件等。本发明实施例所提供的装置，其实现原理及产生的技术效果和前述方法实施例相同，为简要描述，装置实施例部分未提及之处，可参考前述方法实施例中相应内容。所属领域的技术人员可以清楚地了解到，为描述的方便和简洁，前述描述的系统、装置和单元的具体工作过程，均可以参考上述方法实施例中的对应过程，在此不再赘述。

在本发明所提供的实施例中，应该理解到，所揭露装置和方法，可以通过其它的方式实现。以上所描述的装置实施例仅仅是示意性的，例如，所述单元的划分，仅仅为一种逻辑功能划分，实际实现时可以有另外的划分方式，又例如，多个单元或组件可以结合或者可以集成到另一个系统，或一些特征可以忽略，或不执行。另一点，所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些通信接口，装置或单元的间接耦合或通信连接，可以是电性，机械或其它的形式。

所述作为分离部件说明的单元可以是或者也可以不是物理上分开的，作为单元显示的部件可以是或者也可以不是物理单元，即可以位于一个地方，或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例方案的目的。

另外，在本发明提供的实施例中的各功能单元可以集成在一个处理单元中，也可以是各个单元单独物理存在，也可以两个或两个以上单元集成在一个单元中。

所述功能如果以软件功能单元的形式实现并作为独立的产品销售或使用时，可以存储在一个计算机可读取存储介质中。基于这样的理解，本发明的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个存储介质中，包括若干指令用以使得一台计算机设备(可以是个人计算机，服务器，或者网络设备等)执行本发明各个实施例所述方法的全部或部分步骤。而前述的存储介质包括：U盘、移动硬盘、只读存储器(ROM，Read-Only Memory)、随机存取存储器(RAM，Random Access Memory)、磁碟或者光盘等各种可以存储程序代码的介质。

最后应说明的是：以上所述实施例，仅为本发明的具体实施方式，用以说明本发明的技术方案，而非对其限制，本发明的保护范围并不局限于此，尽管参照前述实施例对本发明进行了详细的说明，本领域的普通技术人员应当理解：任何熟悉本技术领域的技术人员在本发明揭露的技术范围内，其依然可以对前述实施例所记载的技术方案进行修改或可轻易想到变化，或者对其中部分技术特征进行等同替换；而这些修改、变化或者替换，并不使相应技术方案的本质脱离本发明实施例技术方案的精神和范围。都应涵盖在本发明的保护范围之内。因此，本发明的保护范围应所述以权利要求的保护范围为准。

Claims (15)

1.一种web系统页面的显示方法，其特征在于，所述方法包括：

获取当前web系统的页面，在所述页面的头部信息中获取配置资源信息；

根据所述配置资源信息对所述页面的页面样式进行隐藏；

根据所述配置资源信息获取指向共享数据的地址，请求所述共享数据中与当前web系统相关的共享数据；

对所述页面的结构和样式进行分析，将分析结果与请求到的共享数据进行结合；

将结合后的数据以及被隐藏的所述页面样式中需保留的部分进行渲染。

2.根据权利要求1所述的方法，其特征在于，所述方法还包括：当请求所述共享数据失败时，将被隐藏的所述页面的页面样式进行渲染。

3.权利要求1所述的方法，其特征在于，所述根据所述配置资源信息获取指向共享数据的地址，请求所述共享数据中与当前web系统相关的共享数据，包括：

根据所述指向共享数据的地址，向所述共享数据所在的域发送跨域数据调用请求；

判断是否登录所述共享数据所在的域，如果已登录，则获取所述共享数据中与当前web系统相关的共享数据，否则，跳转到统一登录页面，在统一登录页面进行登录后获取与当前web系统相关的共享数据。

4.根据权利要求3所述的方法，其特征在于，所述跳转到统一登录页面，在统一登录页面进行登录后获取与当前web系统相关的共享数据，包括：

新建一个框架；

通过所述框架跳转到统一登录页面进行登录cookie的获取；

当获取到所述登录cookie后跳转至数据请求页，将与当前web系统相关的共享数据放入所述数据请求页，返回所述框架；

使用PostMessage的方式将所述数据请求页的共享数据返回。

5.根据权利要求1所述的方法，其特征在于，所述将分析结果与请求到的共享数据进行结合，包括：

根据所述配置资源信息中的模板片段，将结合后的数据生成HTML代码；

将生成的所述HTML代码插入所述页面中。

6.根据权利要求5所述的方法，其特征在于，将生成的所述HTML代码插入所述页面中，对插入所述HTML代码的页面进行渲染，包括：

判断所述配置资源信息中是否存在页面插件，如果存在页面插件，执行所述页面插件，并将所述页面插件与生成的所述HTML代码插入所述页面中，对插入所述HTML代码和页面插件的页面进行渲染。

7.根据权利要求1所述的方法，其特征在于，所述配置资源信息中还包括与所述当前web系统相关的个性化配置，所述个性化配置包括对当前web系统的图标、数据源或特定样式进行配置。

8.一种web系统页面的显示装置，其特征在于，所述装置包括：

页面处理模块，用于获取当前web系统的页面，在所述页面的头部信息中获取配置资源信息；

隐藏模块，用于根据所述配置资源信息对所述页面的页面样式进行隐藏；

请求模块，用于根据所述配置资源信息获取指向共享数据的地址，请求所述共享数据中与当前web系统相关的共享数据；

结合模块，用于对所述页面的结构和样式进行分析，将分析结果与请求到的共享数据进行结合；

渲染模块，用于将结合后的数据以及被隐藏的所述页面样式中需保留的部分进行渲染。

9.根据权利要求8所述的装置，其特征在于，所述渲染模块还用于当请求所述共享数据失败时，将被隐藏的所述页面的页面样式进行渲染。

10.根据权利要求8所述的装置，其特征在于，所述请求模块，包括：

调用单元，用于根据所述指向共享数据的地址，向所述共享数据所在的域发送跨域数据调用请求；

判断单元，用于判断是否登录所述共享数据所在的域；

获取单元，用于如果所述判断单元判断已登录，则获取所述共享数据中与当前web系统相关的共享数据，否则，跳转到统一登录页面，在统一登录页面进行登录后获取与当前web系统相关的共享数据。

11.根据权利要求10所述的装置，其特征在于，所述获取单元具体用于：

新建一个框架；通过所述框架跳转到统一登录页面进行登录cookie的获取；当获取到所述登录cookie后跳转至数据请求页，将与当前web系统相关的共享数据放入所述数据请求页，返回所述框架；使用PostMessage的方式将所述数据请求页的共享数据返回。

12.根据权利要求8所述的装置，其特征在于，所述渲染模块包括：

代码生成单元，用于根据所述配置资源信息中的模板片段，将结合后的数据生成HTML代码；

渲染单元，用于将生成的所述HTML代码插入所述页面中，对插入所述HTML代码的页面进行渲染。

13.根据权利要求12所述的装置，其特征在于，所述渲染模块包括：

判断单元，用于判断所述配置资源信息中是否存在页面插件，所述渲染单元还用于如果存在页面插件，执行所述页面插件，并将所述页面插件与生成的所述HTML代码插入所述页面中，对插入所述HTML代码和页面插件的页面进行渲染。

14.根据权利要求8所述的装置，其特征在于，所述配置资源信息中还包括与所述当前web系统相关的个性化配置，所述个性化配置包括对当前web系统的图标、数据源或特定样式进行配置。

15.一种web系统，其特征在于，所述系统包括：用户终端和共享数据服务器，

所述共享数据服务器，用于存储对应不同web系统的共享数据；

所述用户终端，用于获取当前web系统的页面，在所述页面的头部信息中获取配置资源信息，根据所述配置资源信息对所述页面的页面样式进行隐藏，根据所述配置资源信息中指向所述共享数据的地址，请求所述共享数据中与当前web系统相关的共享数据，对所述页面的结构和样式进行分析，将分析结果与请求到的共享数据进行结合，将结合后的数据以及被隐藏的所述页面样式中需保留的部分进行渲染。