這篇文章可能把問題想復雜了，設置微信分享推薦閱讀這篇文章 >> 前端調用微信分享函數封裝（適用於原生頁面和其他框架項目）
前言：
前兩天在做微信公眾號里的項目的時候有一個需求是在 vue 項目中實現微信分享，然后在自定義分享鏈接的時候出了一些問題，分享出去的自定義鏈接（鏈接中攜帶參數）總是會直接跳到項目首頁，而且是玄學跳轉，時而自定義鏈接正常，時而直接跳到首頁，答案在文章最后面。
正文：
1. 這里不說微信分享中的配置微信 js-sdk ，請自行查閱微信公眾號開發文檔
2. 闡述下 解決此問題的一些思路
解決這個問題需要知道這樣的信息，微信公眾號中的項目在請求簽名和自定義分享鏈接的時候對於Vue 的#路由不太友好
1. 請求簽名時如果使用Vue的全路徑（包括#部分路由）請求時會報簽名失敗或者無效的簽名，因此我們需要使用以下方法來避免此問題
- 使用 location.href.split('#')[0] 獲取到url中#之前的部分，將獲取的url 傳給后台請求簽名
- 請求使用post, 保證傳給后台的url是不經過任何加工的
以上兩步確認無誤，如果簽名失敗就可以將鍋甩給后台了
2. 自定義分享鏈接失敗，分享出去后總是跳到首頁，這個問題確實是困擾了我好一段時間，因為這個自定義鏈接是時而正常跳轉，時而跳到首頁的
附上我的自定義鏈接錯誤示例
link: `${location.origin}/***/inde.html#/sharepage?id=123456`
如上，因為分享出去的鏈接不是當前頁面的鏈接，所以需要拼接一下
當用戶從分享進來的鏈接進來的時候是需要先重定向獲取code 再進入這個鏈接，所以先判斷鏈接中是否有code並且code是否正常，分享出去的鏈接code肯定是不正常的，所以就有了如下代碼
1 let url 2 if (location.href.includes('/sharepage)) { // 說明是分享的頁面 3 let id = location.href.split('?')[1].split('=')[1] // 這里簡單獲取下參數id 4 url = `${location.origin}/***/index.html#/sharepage?id=${id}` 5 } else { 6 url = `${location.origin}/***/index.html` // 正常的重定向鏈接 7 } 8 9 window.location.href = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=******&redirect_uri=${url}?response_type=code&scope=snsapi_base&state=123` // 重定向
如上代碼，分享鏈接經常跳到首頁，而且幾率很大
尋找問題，在 App.vue 中 created 周期函數中 alert(location.href) 查看當前進入的鏈接地址是否正確，是否是自己安排好的地址，這里 console.log(location.href) 然后用 vconsole 查看日志是沒有用的，因為重定向了，alert會在它重定向前截停並彈框從分享的鏈接進入的路徑，測試后發現，當跳轉到首頁的時候 alert 出來的也是首頁，然后判斷到不是分享的頁面也就直接重定向到首頁了，但也有幾率是alert 出分享頁面的鏈接並能跳轉到正常的鏈接，google之后，網友有一些說法，說自定義的分享鏈接#后的部分會被截取掉，可以使用 手動拼接的方式來定義分享的鏈接，如下
1 link: location.href.split('#')[0] + '#' + location.href.split('#')[1]
當然如果分享出去的鏈接不是當前頁面的話，后面的部分可以自定義，這個方法主要在於手動拼接#，而且有很多網友回復成功，看了這個方法之后筆者
並沒有直接套用，因為這樣的做法分享出去的鏈接還是有 # 號的，而且筆者遇到的情況是個概率事件，也就是時靈時不靈，所以筆者放棄了這個方法，有興趣的可以試試這個方法，但是上面的方法是讓筆者想到了另一種思路，代碼如下:
1 let noSharp = location.href.split('#')[0] 2 let url = noSharp.includes('?') : `${noSharp}&shareId=1234` : `${noSharp}?shareId=1234` 3 link: url
可以看出，分享出去的鏈接並不是分享頁面的鏈接，而是首頁鏈接攜帶了一個參數 shareId ，而且鏈接中不會有 # 號，不用考慮 # 后面的內容被微信截取掉，能這樣做是因為有一個前提：重定向的鏈接並不會對 # 有偏見，看下面代碼
1 let url 2 if (location.href.includes('shareId')) { // 用是否有shareId 來判斷是不是分享出去的鏈接 3 let searchData = getUrlSearch()// 這里需要一個獲取url中search 參數的方法,不詳述 4 let shareId = searchData.shareId 5 url = `${location.origin}/***/index.html#/sharepage?id=${shareId}` 6 } else { 7 url = `${location.origin}/***/index.html` 8 } 9 window.location.href = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=*****&redirect_uri=${url}?response_type=code&scope=snsapi_base&state=123`
如上，我們可以在進入鏈接之后判斷有沒有分享的參數，如果有分享的參數，那就在這里手動拼接分享的頁面並將分享鏈接中的參數拼接在后面。
然后重定向到它該去的地方，經筆者測試，可行。
如果各位看官有更好的想法的話請多多指教，互相學習。
以上