阅读说明：本技术 一种基于Vue Router为url添加统一参数的方法 (Method for adding uniform parameters to url based on Vue Router ) 是由 阮超 王小普 于 2020-06-29 设计创作，主要内容包括：本发明提供了一种基于Vue Router为url添加统一参数的方法,该方法包括以下的步骤：S1、进入页面；S2、后端服务器判断页面是否含有hash值参数,如含有hash值参数则进入步骤S3,如未含有hash值参数则直接进入步骤S4；S3、根据hash值参数绑定页面的上下级关系；S4、页面请求后端服务器生成唯一的hash值参数,绑定hash值参数到页面访问url；S5、Vue Router判断url是否含有hash值参数,如有则进入步骤S6,如没有则进入步骤S7；S6、获取hash值参数,并将hash值参数存储至本地,后进入步骤S8；S7、后端服务器判断本地有无hash值参数,如有则返回至步骤S,如没有则进入步骤S8；S8、页面正常访问；本发明的有益效果是：可以方便快捷地生成分享参数并识别记录。(The invention provides a method for adding uniform parameters to url based on Vue Router, which comprises the following steps: s1, entering a page; s2, the back-end server judges whether the page contains a hash value parameter, if so, the step S3 is carried out, and if not, the step S4 is directly carried out; s3, binding the upper and lower level relations of the page according to the hash value parameter; s4, the page request back-end server generates a unique hash value parameter and binds the hash value parameter to the page access url; s5, judging whether the url contains a hash value parameter by the Vue Router, if so, entering a step S6, and if not, entering a step S7; s6, acquiring the hash value parameter, storing the hash value parameter to the local, and then entering the step S8; s7, the back-end server judges whether the hash value parameter exists locally, if yes, the step S is returned, and if not, the step S8 is carried out; s8, normally accessing the page; the invention has the beneficial effects that: the sharing parameters can be conveniently and quickly generated and the records can be identified.)

一种基于Vue Router为url添加统一参数的方法

技术领域

本发明涉及互联网技术领域，更具体的说，本发明涉及一种基于Vue Router为url添加统一参数的方法。

背景技术

随着网络和通信的高速发展，基于固定网络及移动通信网络中的流媒体业务正逐渐被人们了解和接受。简单来说，流媒体就是应用流技术在网络上传输的多媒体文件，而流技术就是把连续的影像和声音信息经过压缩处理后放到服务器上，让用户一边下载一边观看、收听，而不需要等整个压缩多媒体文件下载到本地后才可以观看的网络传输技术。整个过程需要如下两个部件，一是提供流媒体文件并且将流媒体文件进行流化的流媒体服务器，二是能够访问流媒体服务器、下载流化后的流媒体文件并播放流媒体的客户端。运营商提供流媒体服务器，用户可以通过手机终端或者PC终端，经有线固定网络或者无线通信网络，来访问流媒体服务器。

客户端是通过流媒体服务器公开的链接来实现流媒体内容的访问，所以流媒体服务器需要提供访问其内部的流媒体内容的链接，这里的链接即为URL。链接可以说是用户与服务器端的桥梁纽带，而且是唯一的联系访问方式。如果用户需要访问不同的流媒体内容，则其通过访问不同的链接来实现；并且，不同流媒体内容对应的链接是不同的，一个链接只能访问一个流媒体内容。

流媒体服务器提供的媒体***，即URL，至少需要包含如下几个元素：协议类型、流媒体服务器的IP地址、流媒体服务器的端口号、被访问流媒体内容的相对路径和被访问流媒体内容的文件名。用户只要掌握了作为流媒体服务器资源的URL，就可以随时随地的访问URL指定的流媒体内容。

现有技术中，对于页面分享的链接，不能够识别是由谁分享出去的，用户点击分享的链接，不能够识别根据谁分享的链接访问的，其次，对于订单的关联关系无法识别。

发明内容

为了克服现有技术的不足，本发明提供了一种基于Vue Router为url添加统一参数的方法，可以方便快捷地生成分享参数并识别记录。

本发明解决其技术问题所采用的技术方案是：一种基于Vue Router为url添加统一参数的方法，其改进之处在于，该方法包括以下的步骤：

S1、进入页面；

S2、后端服务器判断页面是否含有hash值参数，如含有hash值参数则进入步骤S3，如未含有hash值参数则直接进入步骤S4；

S3、根据hash值参数绑定页面的上下级关系；

S4、页面请求后端服务器生成唯一的hash值参数，绑定hash值参数到页面访问url；

S5、Vue Router判断url是否含有hash值参数，如有则进入步骤S6，如没有则进入步骤S7；

S6、获取hash值参数，并将hash值参数存储至本地，后进入步骤S8；

S7、后端服务器判断本地有无hash值参数，如有则返回至步骤S，如没有则进入步骤S8；

S8、页面正常访问。

进一步的，所述的步骤S1中，在进入页面时，请求后端服务器的后端接口，以授权登录获取用户信息。

进一步的，在进入页面时，通过微信授权登录以获取用户信息。

进一步的，所述的步骤S4与步骤S5之间还包括以下的步骤：

通过后端接口返回至页面，并进行页面重定向。

进一步的，所述的步骤S6中，hash值参数存入sessionStorage中。

进一步的，所述的步骤S8中，每次路由变化，从sessionStorage中获取hash值参数，并将hash值参数加入路由参数中。

进一步的，每次路由变化，都能获取路到路由参数，每次请求后端接口将路由参数带上，并传递至后端服务器。

本发明的有益效果是：本发明提供了一种vue.js框架中使用Vue Router添加链接参数的方法，该方法可以方便快捷地生成分享参数并识别记录，可以很好的根据链接的参数来识别用户，可以很好的根据参数识别订单的上下级关系。

附图说明

图1为本发明的一种基于Vue Router为url添加统一参数的方法的流程示意图。

具体实施方式

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

以下将结合实施例和附图对本发明的构思、具体结构及产生的技术效果进行清楚、完整地描述，以充分地理解本发明的目的、特征和效果。显然，所描述的实施例只是本发明的一部分实施例，而不是全部实施例，基于本发明的实施例，本领域的技术人员在不付出创造性劳动的前提下所获得的其他实施例，均属于本发明保护的范围。另外，专利中涉及到的所有联接/连接关系，并非单指构件直接相接，而是指可根据具体实施情况，通过添加或减少联接辅件，来组成更优的联接结构。本发明创造中的各个技术特征，在不互相矛盾冲突的前提下可以交互组合。

参照图1所示，本发明揭示了一种基于Vue Router为url添加统一参数的方法，通过该方法，实现了对链接参数的添加，可以很方便快捷地生成分享参数并识别记录，进而很好的根据链接的参数来识别用户、根据参数识别订单的上下级关系。具体的，在本实施例中，本发明的基于Vue Router为url添加统一参数的方法包括以下的步骤：

S1、进入页面，在进入页面时，请求后端服务器的后端接口，以授权登录获取用户信息；

本实施例中，在进入页面时，通过微信授权登录以获取用户信息；

S2、后端服务器判断页面是否含有hash值参数，如含有hash值参数则则对参数进行检验，并进入步骤S3，如未含有hash值参数则直接进入步骤S4；

S3、根据hash值参数绑定页面的上下级关系；

S4、页面请求后端服务器生成唯一的hash值参数，绑定hash值参数到页面访问url；通过后端接口返回至页面，并进行页面重定向；

S5、Vue Router判断url是否含有hash值参数，如有则进入步骤S6，如没有则进入步骤S7；

S6、获取hash值参数，并将hash值参数存储至本地，后进入步骤S8；

本实施例中，hash值参数存入sessionStorage中；

S7、后端服务器判断本地有无hash值参数，如有则返回至步骤S，如没有则进入步骤S8；

S8、页面正常访问；

步骤S8中，每次路由变化，从sessionStorage中获取hash值参数，并将hash值参数加入路由参数中。

步骤S8中，每次路由变化，都能获取路到路由参数，每次请求后端接口将路由参数带上，并传递至后端服务器，通过后端服务器进行处理。

通过上述的实施例，本发明提供了一种vue.js框架中使用Vue Router添加链接参数的方法，该方法可以方便快捷地生成分享参数并识别记录，可以很好的根据链接的参数来识别用户，可以很好的根据参数识别订单的上下级关系，另外可以很好的记录访问数据的相关联系。

用户在***时，一般情况下，该链接的来源分为以下几种：第一，用户自行输入url地址；第二、由其他人对链接进行的分享。

基于第一种情况，当用户点击链接时进入页面，授权登录后，后端服务器则会判断页面是否含有hash值参数，此种情况下页面是没有hash值参数的，因此直接进入步骤S4，页面请求后端服务器生产唯一的hash值参数，在页面绑定hash值参数后，返回至页面，必要的时候进行页面重定向。进一步的，页面处理参数的过程如下：Vue Router判断url含有hash值参数，获取hash值参数，并将hash值参数存储至本地，此后页面即可正常访问。

基于第二种情况，当用户点击其他人分享的链接进入页面时，授权登录后，后端服务器则会判断页面是否含有hash值参数，此种情况下，由于其他人在分享链接时已经进入页面，必定会生成唯一的hash值参数。此时，后端服务器则会判断页面含有hash值参数，进而绑定访问关系，形成页面的上下级关系，此后返回至页面，必要的时候进行页面重定向。Vue Router判断url含有hash值参数，获取hash值参数，并将hash值参数存储至本地，此后页面即可正常访问。

基于此种方法，本发明提供了一种vue.js框架中使用Vue Router添加链接参数的方法，在用户自行输入url地址访问页面时，可以方便快捷地生成分享参数并识别记录，在用户打开其他人分享的链接时，可以根据链接的hash值参数来识别用户，实现链接分享者的追踪；当用户在链接中实现下单等操作时，则可以根据链接的hash值参数识别订单的上下级关系，也可以很好的记录访问数据的相关联系。

以上是对本发明的较佳实施进行了具体说明，但本发明创造并不限于所述实施例，熟悉本领域的技术人员在不违背本发明精神的前提下还可做出种种的等同变形或替换，这些等同的变形或替换均包含在本申请权利要求所限定的范围内。