APP分享h5頁面（vue cli）到微信不能正常請求接口的問題

當APP中分享h5連結到微信中時，微信會自動拼接一些參數在h5連結的後面，此時可能會影響vue cli寫的h5中請求接口的觸發成功，以及相關的其他功能操作；

我的處理方法邏輯比較簡單，就是判斷位址是否被添加了微信的參數，然後擷取url取其中自己需要的，在給到location.replace();

微信自動拼接的通常為

朋友圈   &from=timeline&isappinstalled=0

微信群   &from=groupmessage&isappinstalled=0

好友分享 &from=singlemessage&isappinstalled=0
           

識别url

getQueryString: function (name) {//根據字段看網址是否拼接&字元串
	  var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
	  var r = window.location.search.substr(1).match(reg);
	  if (r != null)
	      return unescape(r[2]);
	  return null;
	}

	// 如果存在相關拼接參數，就重新加載url
			let from = getQueryString('from');
			let appinstall = getQueryString('appinstall');
			let sec = getQueryString('sec');
			let timekey = getQueryString('timekey');
			if (from || appinstall || sec || timekey) {
				let newUrl = window.location.href.split('?')[0];
				let urlParams = getUrlParams();  
				//getUrlParams()為擷取url參數函數
				newUrl = newUrl + "?regularCode=" + regularCode;
				location.replace(newUrl);
			}
           

抓取url參數對象

function getUrlParams () {
        var url = window.location.href.split('#')[0];
        const parseQueryString = url => {
            var json = {};
            var arr = url.substr(url.indexOf('?') + 1).split('&');
            arr.forEach(item => {
                var tmp = item.split('=');
                json[tmp[0]] = tmp[1];
            });
            return json;
        }
        return parseQueryString(url)
    }
           

如此一來，便可以去除目前頁面自動添加的參數，消除其影響，頁面和你在本地寫的一樣了；