vue直接获取url中的参数

一、场景描述

• 前端vue框架项目，后端springboot框架；
• lz的需求场景是集成单点登录，通过登录页面路径后追加参数，向后端springboot项目发送请求，后端接收请求后同时获取到追加的参数。

二、解决方式

• 网上有说通过路由的方式，lz尝试后失败
• lz采用不通过路由直接获取url中参数的方法尝试成功

三、解决步骤

1、在vue项目根目录下创建一个urlParse.js文件

export default{
  getUrlKey:function(name){
    return decodeURIComponent((new RegExp('[?|&]'+name+'='+'([^&;]+?)(&|#|;|$)').exec(location.href)||[,""])[1].replace(/\+/g,'%20'))||null;
  }
}

2、在vue项目根目录下main.js中注册全局方法

import urlParse  from './urlParse'    //获取url参数
 
Vue.prototype.$urlParse=urlParse   //注册全局方法

3、vue的登录页面中该方法

//AuthToken 表示vue项目登录页面路径后追加的参数
let AuthToken=this.$urlParse.getUrlKey("AuthToken")