基于VUE的标签参数传递方法、装置、设备及存储介质制造方法及图纸

本说明书涉及web前端开发技术领域，提供了一种基于VUE的标签参数传递方法、装置、设备及存储介质，该方法包括：接收页面请求；基于VUE组件的全局前置守卫钩子函数验证所述页面请求中的标签参数的合法性；所述标签参数用于收集用户浏览行为；当所述页面请求中的标签参数通过合法性验证时，基于所述VUE组件的全局后置守卫钩子函数将所述标签参数缓存于所述VUE组件的VUEX模块中；在所述页面请求跳转至目标页面时，从所述VUEX模块中获取所述标签参数并提交至服务端处理。本说明书实施例可以提高标签参数在页面间传递的正确性和安全性，并减少开发代码量。减少开发代码量。减少开发代码量。

【技术实现步骤摘要】
基于VUE的标签参数传递方法、装置、设备及存储介质


[0001]本说明书涉及web前端开发
，尤其是涉及一种基于VUE的标签参数传递方法、装置、设备及存储介质。

技术介绍

[0002]打标是对用户浏览网页进行行为分析的一个重要统计手段，通过在URL(Uniform Resource Locator，统一资源定位器)里添加标签参数，在后台请求时提交，最终将标签参数留存到后台。目前，最常用的标签参数传递手段就是使用参数显式传递的手段，将标签参数在各页面间不断传递，各页面通过解析URL参数从而获取到标识并在页面的JavaScript方法中使用。例如，HTML页面在外嵌给APP(Application)、小程序或其他页面的链接时，可以通过打开新标签页的方式将标签参数绑定传入H5(即HTML5)以便于进行统计分析。
[0003]然而，现有技术方案将标签参数直接暴露在URL中，并在各页面传递，使得非法参数攻击的概率大大增加(例如用户可以直接在URL里修改标签参数)，从而导致统计的数据不准确。不仅如此，对代码开发而言，由于存在多页面跳转，因此需要在每个跳转事件里加入标签参数，大大增加了开发量，且容易遗漏。因此，如何提高标签参数在页面间传递的正确性和安全性，并减少开发代码量，已成为目前亟待解决的技术问题。

技术实现思路

[0004]本说明书实施例的目的在于提供一种页面标签参数传递方法、装置、设备及存储介质，以提高标签参数在页面间传递的正确性和安全性，并减少开发代码量。
[0005]为达到上述目的，一方面，本说明书实施例提供了一种基于VUE的标签参数传递方法，包括：
[0006]接收页面请求；
[0007]基于VUE组件的全局前置守卫钩子函数验证所述页面请求中的标签参数的合法性；所述标签参数用于收集用户浏览行为；
[0008]当所述页面请求中的标签参数通过合法性验证时，基于所述VUE组件的全局后置守卫钩子函数将所述标签参数缓存于所述VUE组件的VUEX模块中；
[0009]在所述页面请求跳转至目标页面时，从所述VUEX模块中获取所述标签参数并提交至服务端处理。
[0010]本说明书实施例的基于VUE的标签参数传递方法，所述基于所述VUE组件的全局前置守卫钩子函数验证所述页面请求中的标签参数的合法性，包括：
[0011]基于所述全局前置守卫钩子函数识别所述页面请求所归属的performance事件类型；所述performance事件类型包括创建事件、刷新事件或回退事件；
[0012]当所述页面请求所归属的performance事件类型为创建事件时，对所述页面请求中的标签参数进行合法性验证。
[0013]本说明书实施例的基于VUE的标签参数传递方法中，对所述页面请求中的标签参
数进行合法性验证，包括：
[0014]将所述页面请求中的标签参数发送至所述服务端，以由所述服务端对所述标签参数进行合法性验证；
[0015]接收所述服务端返回的针对所述标签参数的验证结果；
[0016]根据所述验证结果确定所述标签参数的合法性。
[0017]本说明书实施例的基于VUE的标签参数传递方法，还包括：
[0018]当所述页面请求所归属的performance事件类型为刷新事件或回退事件时，默认所述页面请求中的标签参数合法。
[0019]本说明书实施例的基于VUE的标签参数传递方法，还包括：
[0020]当所述页面请求中的标签参数未通过合法性验证时，将所述页面请求重定向至报错页面。
[0021]本说明书实施例的基于VUE的标签参数传递方法，从所述VUEX模块中获取所述标签参数并提交至服务端处理，包括：
[0022]从所述VUEX模块中获取所述标签参数；
[0023]将所述标签参数封装至所述页面请求的请求头中；
[0024]将封装有所述标签参数的页面请求提交至所述服务端处理。
[0025]另一方面，本说明书实施例还提供了一种基于VUE的标签参数传递装置，包括：
[0026]接收模块，用于接收页面请求；
[0027]验证模块，用于基于VUE组件的全局前置守卫钩子函数验证所述页面请求中的标签参数的合法性；所述标签参数用于收集用户浏览行为；
[0028]存储模块，用于当所述页面请求中的标签参数通过合法性验证时，基于所述VUE组件的全局后置守卫钩子函数将所述标签参数缓存于所述VUE组件的VUEX模块中；
[0029]提交模块，用于在所述页面请求跳转至目标页面时，从所述VUEX模块中获取所述标签参数并提交至服务端处理。
[0030]另一方面，本说明书实施例还提供了一种计算机设备，包括存储器、处理器、以及存储在所述存储器上的计算机程序，所述计算机程序被所述处理器运行时，执行上述基于VUE的标签参数传递方法的指令。
[0031]另一方面，本说明书实施例还提供了一种计算机存储介质，其上存储有计算机程序，所述计算机程序被计算机设备的处理器运行时，执行上述基于VUE的标签参数传递方法的指令。
[0032]另一方面，本说明书实施例还提供了一种计算机程序产品包括计算机程序，所述计算机程序被计算机设备的处理器运行时，执行上述基于VUE的标签参数传递方法的指令。
[0033]由以上本说明书实施例提供的技术方案可见，本说明书实施例中，通过使用VUE组件进行标签参数缓存取代现有的浏览器URL参数互传，从而实现了页面间参数隐式传递，使得标签参数不易被修改；并且，通过对标签参数合法性验证进行控制，从而进一步降低了标签参数被修改的可能性，从而提高标签参数在页面间传递的正确性和安全性。此外，还可以使用VUE钩子函数对页面间跳转行为进行公共处理，从而减少各个VUE页面间单独处理，减少了代码量开发。
附图说明
[0034]为了更清楚地说明本说明书实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本说明书中记载的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动性的前提下，还可以根据这些附图获得其他的附图。在附图中：
[0035]图1示出了本说明书一些实施例中的业务系统的结构示意图；
[0036]图2示出了本说明书一些实施例中基于VUE的标签参数传递方法的流程图；
[0037]图3示出了本说明书一些实施例中基于VUE的标签参数传递的示意图；
[0038]图4示出了本说明书一些实施例中基于VUE的标签参数传递装置的结构框图；
[0039]图5示出了本说明书一些实施例中计算机设备的结构框图。
[0040]【附图标记说明】
[0041]10、客户端；
[0042]20、服务端；
[0043]41、接收模块；
[0044]42、验证模块；
[0045]43、存储模块；
[0046]44、提本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种基于VUE的标签参数传递方法，其特征在于，包括：接收页面请求；基于VUE组件的全局前置守卫钩子函数验证所述页面请求中的标签参数的合法性；所述标签参数用于收集用户浏览行为；当所述页面请求中的标签参数通过合法性验证时，基于所述VUE组件的全局后置守卫钩子函数将所述标签参数缓存于所述VUE组件的VUEX模块中；在所述页面请求跳转至目标页面时，从所述VUEX模块中获取所述标签参数并提交至服务端处理。2.如权利要求1所述的基于VUE的标签参数传递方法，其特征在于，所述基于所述VUE组件的全局前置守卫钩子函数验证所述页面请求中的标签参数的合法性，包括：基于所述全局前置守卫钩子函数识别所述页面请求所归属的performance事件类型；所述performance事件类型包括创建事件、刷新事件或回退事件；当所述页面请求所归属的performance事件类型为创建事件时，对所述页面请求中的标签参数进行合法性验证。3.如权利要求2所述的基于VUE的标签参数传递方法，其特征在于，对所述页面请求中的标签参数进行合法性验证，包括：将所述页面请求中的标签参数发送至所述服务端，以由所述服务端对所述标签参数进行合法性验证；接收所述服务端返回的针对所述标签参数的验证结果；根据所述验证结果确定所述标签参数的合法性。4.如权利要求2所述的基于VUE的标签参数传递方法，其特征在于，还包括：当所述页面请求所归属的performance事件类型为刷新事件或回退事件时，默认所述页面请求中的标签参数合法。5.如权利要求1所述的基于VUE的标签参数传递方法，其特征在于，还包括：当所述页面请...

【专利技术属性】
技术研发人员：陈圣君，
申请(专利权)人：中国银行股份有限公司，
类型：发明
国别省市：