最近工作上遇到了這樣一個Bug：“vue微信分享出來的鏈接點開是首頁”

公司網站有PC端和移動端，兩個版本。其中如果手機訪問PC端，則自動跳轉到移動端。（這是常規操作，沒啥稀奇點。）

可神奇的問題來了。

在移動端中有微信分享功能，如果手機直接訪問手機端的地址進入子頁面分享，點開分享的鏈接進入的是子頁面。但是如果是從PC端跳轉進入手機端，分享子頁面鏈接打開將會是主頁。

這個問題我也百度了各種方法，折騰了一天，然而都沒啥用。

最后自己想了一個替代方案：

在static目錄下新建一個名為html的文件夾，在html文件夾中再新建一個redirect.html（看到這個文件名是不是知道我要干啥了）

沒錯，我們做一個重定向。

html中寫入以下內容

<script>  let url = location.href.split('?') let pars = url[1].split('&') let data = {} pars.forEach((n, i) => { let p = n.split('=') data[p[0]] = p[1] }) if (!!data.app3Redirect) { self.location = decodeURIComponent(data.app3Redirect) } </script>

只需要script標簽就可以了，反正只是做重定向。

接下來就簡單了，原本設置給微信的分享鏈接是

shareWxLink = window.location.href

現在我們給他改成

shareWxLink = window.location.href.split('#')[0] + 'static/html/redirect.html?app3Redirect=' + encodeURIComponent(window.location.href)

這樣，我們就把當前頁的地址編碼后放到參數app3Redirect里面，當訪問redirect.html時將自動重定向到解碼后的原地址。

到此，終于把這個坑爹的Bug給修復了。

以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持VeVb武林網。