页面数据处理方法和装置与流程

本发明涉及计算机领域，具体而言，涉及一种页面数据处理方法和装置。

背景技术：

当前互联网环境下，单页面应用已经成为主流，利于代码的重复使用，但是如果多人开发时候容易出现问题，因为开发功能的版本都不一样导致发布的时候比较混乱，当前是把各个功能拆分成独立的子系统这样便于后期开发，但整合一起就比较麻烦，因为各个系统是相对独立，需要通过一个菜单组件把所有的系统连接起来。并且可以相互跳转。

相关技术中的目前前端框架路由系统只支持系统的路由跳转，无法跳转到其他单页面系统中的页面。

针对相关技术中多个单页面系统之间无法跳转的问题，目前尚未提出有效的解决方案。

技术实现要素：

本发明的主要目的在于提供一种页面数据处理方法和装置，以解决多个单页面系统之间无法跳转的问题。

为了实现上述目的，根据本发明的一个方面，提供了一种页面数据处理方法，该方法包括：接收用户发送的从当前页面跳转到目标页面的跳转指令，其中，所述跳转指令是对导航菜单中的页面触发标识点击触发的，所述导航菜单中包含多个单页面系统的页面，每个单页面系统包括多个页面；判断当前页面和目标页面是否属于同一个单页面系统；如果不属于同一个单页面系统，则获取目标页面的页面地址；将所述目标页面的系统地址和所述目标页面的页面地址拼接成目标页面的地址；根据所述目标页面的地址向服务器请求跳转到所述目标页面。

进一步地，判断当前页面和目标页面是否属于同一个单页面系统包括：判断地址栏中的当前页面的系统地址与配置文件中存储的目标页面的系统地址是否一致，其中，所述配置文件中存储有所述导航菜单中的页面的系统地址和页面地址；如果一致，则判断当前页面和目标页面属于同一个单页面系统；如果不一致，则判断当前页面和目标页面不属于同一个单页面系统。

进一步地，在接收跳转指令之前，所述方法还包括：在待整合的每个单页面系统的页面中导入相同的导航菜单；将导航菜单中的每个单页面系统中的页面的地址存储到所述配置文件中。

进一步地，所述方法还包括：在接收到所述跳转指令时，在当前单页面系统与所述目标页面所属的单页面系统的数据库具有关联关系的情况下，获取当前存储在cookie中的当前页面中的目标数据的标识信息；将所述当前页面中的目标数据的标识信息拼接到当前页面的url中；根据所述目标页面的地址向服务器请求跳转到所述目标页面包括：根据所述当前页面的url向服务器请求所述标识信息对应的数据并在所述目标页面中显示。

进一步地，所述单页面系统包括用于管理案件的单页面系统，所述目标数据包括案件数据，所述标识信息包括案件的id。

为了实现上述目的，根据本发明的另一方面，还提供了一种页面数据处理装置，该装置包括：接收单元，用于接收用户发送的从当前页面跳转到目标页面的跳转指令，其中，所述跳转指令是对导航菜单中的页面触发标识点击触发的，所述导航菜单中包含多个单页面系统的页面，每个单页面系统包括多个页面；判断单元，用于判断当前页面和目标页面是否属于同一个单页面系统；获取单元，用于在不属于同一个单页面系统时，获取目标页面的页面地址；拼接单元，用于将所述目标页面的系统地址和所述目标页面的页面地址拼接成目标页面的地址；请求单元，用于根据所述目标页面的地址向服务器请求跳转到所述目标页面。

进一步地，所述判断单元包括：判断模块，用于判断地址栏中的当前页面的系统地址与配置文件中存储的目标页面的系统地址是否一致，其中，所述配置文件中存储有所述导航菜单中的页面的系统地址和页面地址；确定模块，用于在一致时，判断当前页面和目标页面属于同一个单页面系统；确定模块还用于在不一致时，判断当前页面和目标页面不属于同一个单页面系统。

进一步地，所述装置还包括：导入单元，用于在接收跳转指令之前，在待整合的每个单页面系统的页面中导入相同的导航菜单；存储单元，用于将导航菜单中的每个单页面系统中的页面的地址存储到所述配置文件中。

为了实现上述目的，根据本发明的另一方面，还提供了一种存储介质，包括存储的程序，其中，在所述程序运行时控制所述存储介质所在设备执行本发明的页面数据处理方法。

为了实现上述目的，根据本发明的另一方面，还提供了一种处理器，用于运行程序，其中，所述程序运行时执行本发明的页面数据处理方法。

本发明通过接收用户发送的从当前页面跳转到目标页面的跳转指令，其中，跳转指令是对导航菜单中的页面触发标识点击触发的，导航菜单中包含多个单页面系统的页面，每个单页面系统包括多个页面；判断当前页面和目标页面是否属于同一个单页面系统；如果不属于同一个单页面系统，则获取目标页面的页面地址；将目标页面的系统地址和目标页面的页面地址拼接成目标页面的地址；根据目标页面的地址向服务器请求跳转到目标页面，解决了多个单页面系统之间无法跳转的问题，进而达到了能够在多个单页面系统之间跳转的效果。

附图说明

构成本申请的一部分的附图用来提供对本发明的进一步理解，本发明的示意性实施例及其说明用于解释本发明，并不构成对本发明的不当限定。在附图中：

图1是根据本发明实施例的页面数据处理方法的流程图；

图2是根据本发明实施例的导航菜单的示意图；

图3是根据本发明实施例的页面数据处理装置的示意图。

具体实施方式

需要说明的是，在不冲突的情况下，本申请中的实施例及实施例中的特征可以相互组合。下面将参考附图并结合实施例来详细说明本发明。

为了使本技术领域的人员更好地理解本申请方案，下面将结合本申请实施例中的附图，对本申请实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本申请一部分的实施例，而不是全部的实施例。基于本申请中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都应当属于本申请保护的范围。

需要说明的是，本申请的说明书和权利要求书及上述附图中的术语“第一”、“第二”等是用于区别类似的对象，而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换，以便这里描述的本申请的实施例。此外，术语“包括”和“具有”以及他们的任何变形，意图在于覆盖不排他的包含，例如，包含了一系列步骤或单元的过程、方法、系统、产品或设备不必限于清楚地列出的那些步骤或单元，而是可包括没有清楚地列出的或对于这些过程、方法、产品或设备固有的其它步骤或单元。

为了便于描述，以下对本申请实施例涉及的几个术语进行说明：

单页：单页web应用(singlepagewebapplication，spa)，就是只有一张web页面的应用。单页应用程序(spa)是加载单个html页面并在用户与应用程序交互时动态更新该页面的web应用程序。浏览器一开始会加载必需的html、css和javascript，所有的操作都在这张页面上完成，都由javascript来控制。

前端路由：对于用户来说，路由就是浏览器地址栏中的url与所见网页的对应关系。而对于web开发人员来说，路由更像是url与处理函数的对应关系。传统的服务端路由，根据客户端请求的不同网址，返回不同的网页内容，这种情况一是会造成服务器压力增加，二是每次都重新请求，响应较慢、用户体验下降。于是，单页应用(spa,singlepageapplication)应运而生。在url地址改变的过程中，通过js来实现不同ui之间的切换(js对dom的操作)，而不再向服务器重新请求页面，只通过ajax向服务端请求数据，对用户来说这种无刷新的、即时响应是更好的体验。其中，根据url地址栏的变化而展示不同的ui，就是通过前端路由来实现的。目前主流的支持单页应用的前端框架，基本都有配套的或第三方的路由系统。

vue：vue.js是一款流行的javascript前端框架，旨在更好地组织与简化web开发。vue所关注的核心是mvc模式中的视图层，同时，它也能方便地获取数据更新，并通过组件内部特定的方法实现视图与模型的交互。

vuerouter：vue.js官方的路由管理器。

本发明实施例提供了一种页面数据处理方法。

图1是根据本发明实施例的页面数据处理方法的流程图，如图1所示，该方法包括以下步骤：

步骤s102：接收用户发送的从当前页面跳转到目标页面的跳转指令，其中，跳转指令是对导航菜单中的页面触发标识点击触发的，导航菜单中包含多个单页面系统的页面，每个单页面系统包括多个页面；

步骤s104：判断当前页面和目标页面是否属于同一个单页面系统；

步骤s106：如果不属于同一个单页面系统，则获取目标页面的页面地址；

步骤s108：将目标页面的系统地址和目标页面的页面地址拼接成目标页面的地址；

步骤s110：根据目标页面的地址向服务器请求跳转到目标页面。

该实施例采用接收用户发送的从当前页面跳转到目标页面的跳转指令，其中，跳转指令是对导航菜单中的页面触发标识点击触发的，导航菜单中包含多个单页面系统的页面，每个单页面系统包括多个页面；判断当前页面和目标页面是否属于同一个单页面系统；如果不属于同一个单页面系统，则获取目标页面的页面地址；将目标页面的系统地址和目标页面的页面地址拼接成目标页面的地址；根据目标页面的地址向服务器请求跳转到目标页面，从而解决了多个单页面系统之间无法跳转的问题，进而达到了能够在多个单页面系统之间跳转的效果。

在本发明实施例中，跳转指令可以是用户通过点击页面导航菜单中的目标页面的触发标识发出的指令，触发标识对应的页面是目标页面，导航菜单中有多个单页面系统的页面，每个单页面系统包括多个页面，这多个页面可以全部隐藏也可以全部显示，根据跳转指令可以判断当前页面和目标页面是否属于同一个单页面系统中的页面，如果不属于同一个单页面系统，则导航菜单根据目标页面的地址向服务器请求跳转到目标页面，目标页面的地址是由目标页面的系统地址和页面地址拼接而成的，目标页面的系统地址可以存储在配置文件中，页面地址可以携带在跳转指令中，当前页面的系统地址和页面地址可以在地址栏中获取到。通过导航菜单和目标页面的地址可以实现不同的单页面系统之间的跳转。

可选的，判断当前页面和目标页面是否属于同一个单页面系统包括：判断地址栏中的当前页面的系统地址与配置文件中存储的目标页面的系统地址是否一致，其中，配置文件中存储有导航菜单中的页面的系统地址和页面地址；如果一致，则判断当前页面和目标页面属于同一个单页面系统；如果不一致，则判断当前页面和目标页面不属于同一个单页面系统。

在判断当前网页和目标网页是否属于同一个单页面系统中的页面时，是通过当前页面的系统地址和目标页面的系统地址是否一致来判断的，如果一致，则属于同一个单页面系统，如果不一致，则不属于同一个单页面系统。

可选的，在接收跳转指令之前，在待整合的每个单页面系统的页面中导入相同的导航菜单；将导航菜单中的每个单页面系统中的页面的地址存储到配置文件中。

在整合多个单页面系统时，可以在需要整合的多个单页面系统的页面中导入相同的导航菜单，以实现导航功能，然后将导航菜单中的每个单页面系统的页面地址存储到配置文件中，以备后续调用。

可选的，在接收到跳转指令时，在当前单页面系统与目标页面所属的单页面系统的数据库具有关联关系的情况下，获取当前存储在cookie中的当前页面中的目标数据的标识信息；将当前页面中的目标数据的标识信息拼接到当前页面的url中；根据目标页面的地址向服务器请求跳转到目标页面包括：根据当前页面的url向服务器请求标识信息对应的数据并在目标页面中显示。

本发明实施例的技术方案还可以实现多个单页面系统之间的数据传递，在可选的应用场景中，用户在a系统的子页面正在浏览某个案件的信息，此时想要查看该案件在b系统中的相关信息，可以直接点击b系统的子页面跳转到b系统中，b系统的页面即显示有与该案件相关的信息，后台流程为：如果两个页面所述的两个单页面系统的数据库具有关联关系，例如都含有案件信息，在用户浏览a页面中的案件时，该案件的表示信息如id等存储在cookie中，在用户点击了跳转触发标识时，导航菜单系统从cookie中提取案件id拼接到a页面的url中，导航菜单从a页面的url中提取案件id发送给b页面的服务器，b页面的服务器将案件对应的信息发送过来并在b页面中显示案件对应的信息，这样可以实现不同的单页面系统之间的数据传输。

可选的，单页面系统可以是用于管理案件的单页面系统，例如立案管理系统、案件管理系统、工作管理系统等，目标数据可以案件数据，标识信息可以是案件的id、编号等。

本发明实施例还提供了一种优选实施方式。

step1，每个单页面系统导入一个相同的导航菜单，导航菜单下每个地址都是一个页面，但这多个网页属于不同的子系统。导航的数据保存在config.js配置文件中，config.js存储了各个系统的地址和页面的路由地址等信息。

图2是根据本发明实施例的导航菜单的示意图，如图2所示，菜单栏上显示的每行名称是一个单页面系统，点击这些名称右边的箭头可以显示该单页面系统的子页面，点击具体的某个子页面可以显示该页面内容，当系统内跳转时，页面上的内容有很多无需重新加载，只需要加载有更改的部分即可，可以减少加载等待时间，减少数据传输量。

导航菜单中每个页面的地址记录在配置文件中，配置文件的格式可以是：

{

name:‘网上预约立案’,//路由显示名字

url：window.ecourtapp.configs.navurls.windowcase,//当前系统地址

route:’/windowscase/createcaseonline？applutype＝2’//页面路由地址

class:’icon-weijieanjian’//icon-font

}

step2，在接收到跳转指令后，通过获取地址栏上的地址(当前页面)和配置文件中的系统地址(目标页面)做比对看是否是当前系统。

参考代码如下：

letnewurl＝item.url+'/#'+item.route

letquery＝”

leturl＝newurl.split('？')

letlocation＝url[0]

if(！window.location.href.includes(location))//判断要跳转的页面上是不是在当前子系统中，与当前地址栏上的地址做比对

step3，如果是当前页面和目标页面是同一个单页面系统，就走当前单页面系统自己的路由，如果是其他系统的页面，那么就从配置中拿到跳转系统的地址和路由，通过window.location.href函数跳转到其他系统。

参考代码如下：

通过本发明实施例的技术方案可以实现多个单页面之间的跳转和数据传输，且对但当前系统的改动最小。

需要说明的是，在附图的流程图示出的步骤可以在诸如一组计算机可执行指令的计算机系统中执行，并且，虽然在流程图中示出了逻辑顺序，但是在某些情况下，可以以不同于此处的顺序执行所示出或描述的步骤。

本发明实施例提供了一种页面数据处理装置，该装置可以用于执行本发明实施例的页面数据处理方法。

图3是根据本发明实施例的页面数据处理装置的示意图，如图3所示，该装置包括：

接收单元10，用于接收用户发送的从当前页面跳转到目标页面的跳转指令，其中，跳转指令是对导航菜单中的页面触发标识点击触发的，导航菜单中包含多个单页面系统的页面，每个单页面系统包括多个页面；

判断单元20，用于判断当前页面和目标页面是否属于同一个单页面系统；

获取单元30，用于在不属于同一个单页面系统时，获取目标页面的页面地址；

拼接单元40，用于将目标页面的系统地址和目标页面的页面地址拼接成目标页面的地址；

请求单元50，用于根据目标页面的地址向服务器请求跳转到目标页面。

该实施例采用接收单元10，用于接收用户发送的从当前页面跳转到目标页面的跳转指令，其中，跳转指令是对导航菜单中的页面触发标识点击触发的，导航菜单中包含多个单页面系统的页面，每个单页面系统包括多个页面；判断单元20，用于判断当前页面和目标页面是否属于同一个单页面系统；获取单元30，用于在不属于同一个单页面系统时，获取目标页面的页面地址；拼接单元40，用于将目标页面的系统地址和目标页面的页面地址拼接成目标页面的地址；请求单元50，用于根据目标页面的地址向服务器请求跳转到目标页面，从而解决了多个单页面系统之间无法跳转的问题，进而达到了能够在多个单页面系统之间跳转的效果。

可选地，判断单元20包括：判断模块，用于判断地址栏中的当前页面的系统地址与配置文件中存储的目标页面的系统地址是否一致，其中，配置文件中存储有导航菜单中的页面的系统地址和页面地址；确定模块，用于在一致时，判断当前页面和目标页面属于同一个单页面系统；确定模块还用于在不一致时，判断当前页面和目标页面不属于同一个单页面系统。

可选地，该装置还包括：导入单元，用于在接收跳转指令之前，在待整合的每个单页面系统的页面中导入相同的导航菜单；存储单元，用于将导航菜单中的每个单页面系统中的页面的地址存储到配置文件中。

所述页面数据处理装置包括处理器和存储器，上述接收单元、判断单元、获取单元等均作为程序单元存储在存储器中，由处理器执行存储在存储器中的上述程序单元来实现相应的功能。

处理器中包含内核，由内核去存储器中调取相应的程序单元。内核可以设置一个或以上，通过调整内核参数来能够在多个单页面系统之间跳转。

存储器可能包括计算机可读介质中的非永久性存储器，随机存取存储器(ram)和/或非易失性内存等形式，如只读存储器(rom)或闪存(flashram)，存储器包括至少一个存储芯片。

本发明实施例提供了一种存储介质，其上存储有程序，该程序被处理器执行时实现所述页面数据处理方法。

本发明实施例提供了一种处理器，所述处理器用于运行程序，其中，所述程序运行时执行所述页面数据处理方法。

本发明实施例提供了一种设备，设备包括处理器、存储器及存储在存储器上并可在处理器上运行的程序，处理器执行程序时实现以下步骤：接收用户发送的从当前页面跳转到目标页面的跳转指令，其中，跳转指令是对导航菜单中的页面触发标识点击触发的，导航菜单中包含多个单页面系统的页面，每个单页面系统包括多个页面；判断当前页面和目标页面是否属于同一个单页面系统；如果不属于同一个单页面系统，则获取目标页面的页面地址；将目标页面的系统地址和目标页面的页面地址拼接成目标页面的地址；根据目标页面的地址向服务器请求跳转到目标页面。本文中的设备可以是服务器、pc、pad、手机等。

本申请还提供了一种计算机程序产品，当在数据处理设备上执行时，适于执行初始化有如下方法步骤的程序：接收用户发送的从当前页面跳转到目标页面的跳转指令，其中，跳转指令是对导航菜单中的页面触发标识点击触发的，导航菜单中包含多个单页面系统的页面，每个单页面系统包括多个页面；判断当前页面和目标页面是否属于同一个单页面系统；如果不属于同一个单页面系统，则获取目标页面的页面地址；将目标页面的系统地址和目标页面的页面地址拼接成目标页面的地址；根据目标页面的地址向服务器请求跳转到目标页面。

本领域内的技术人员应明白，本申请的实施例可提供为方法、系统、或计算机程序产品。因此，本申请可采用完全硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且，本申请可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、cd-rom、光学存储器等)上实施的计算机程序产品的形式。

本申请是参照根据本申请实施例的方法、设备(系统)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理设备的处理器以产生一个机器，使得通过计算机或其他可编程数据处理设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。

这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理设备以特定方式工作的计算机可读存储器中，使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品，该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。

这些计算机程序指令也可装载到计算机或其他可编程数据处理设备上，使得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处理，从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。

在一个典型的配置中，计算设备包括一个或多个处理器(cpu)、输入/输出接口、网络接口和内存。

存储器可能包括计算机可读介质中的非永久性存储器，随机存取存储器(ram)和/或非易失性内存等形式，如只读存储器(rom)或闪存(flashram)。存储器是计算机可读介质的示例。

计算机可读介质包括永久性和非永久性、可移动和非可移动媒体可以由任何方法或技术来实现信息存储。信息可以是计算机可读指令、数据结构、程序的模块或其他数据。计算机的存储介质的例子包括，但不限于相变内存(pram)、静态随机存取存储器(sram)、动态随机存取存储器(dram)、其他类型的随机存取存储器(ram)、只读存储器(rom)、电可擦除可编程只读存储器(eeprom)、快闪记忆体或其他内存技术、只读光盘只读存储器(cd-rom)、数字多功能光盘(dvd)或其他光学存储、磁盒式磁带，磁带磁磁盘存储或其他磁性存储设备或任何其他非传输介质，可用于存储可以被计算设备访问的信息。按照本文中的界定，计算机可读介质不包括暂存电脑可读媒体(transitorymedia)，如调制的数据信号和载波。

还需要说明的是，术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含，从而使得包括一系列要素的过程、方法、商品或者设备不仅包括那些要素，而且还包括没有明确列出的其他要素，或者是还包括为这种过程、方法、商品或者设备所固有的要素。在没有更多限制的情况下，由语句“包括一个……”限定的要素，并不排除在包括要素的过程、方法、商品或者设备中还存在另外的相同要素。

本领域技术人员应明白，本申请的实施例可提供为方法、系统或计算机程序产品。因此，本申请可采用完全硬件实施例、完全软件实施例或结合软件和硬件方面的实施例的形式。而且，本申请可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、cd-rom、光学存储器等)上实施的计算机程序产品的形式。

以上仅为本申请的实施例而已，并不用于限制本申请。对于本领域技术人员来说，本申请可以有各种更改和变化。凡在本申请的精神和原理之内所作的任何修改、等同替换、改进等，均应包含在本申请的权利要求范围之内。