问题描述
环境:VUE
微信中直接通过URL访问H5网页，然后分享，能够正常显示分享链接的图片，标题，描述。效果是这样的
image
通过分享后的链接打开URL再次访问，分享效果是这样的:
image
目前都正常，再次分享，效果是这样的：
image
奇怪的是这种问题在PC端和模拟器上没有任何问题。
重复分享页面（第二次分享）显示失败
WXNB
问题排查
通过调试发现，问题是出在
wx.config({})
invalid signature签名错误
为什么会签名错误呢？
第一次签名成功，分享后的页面签名失败。
//通过调试后发现，通过微信分享后的页面微信会在URL上添加参数:&from=xxxxx
//反复分享，会反复出现&from=xxxxx&from=xxxxx的情况，
比如:
www.x.com
通过分享链接进入变成了http://www.x.com/#list?from=xxxx
坑就在这里了
第二次分享时候的链接变成了这样http://www.x.com/#list?from=xxxx&from=xxxx
URL参数中出现了两个from
不知道微信后台在处理签名的逻辑是怎么样的，反正这种情况就不允许
解决办法：
处理掉重复的URL参数名
暴力解决
因为我的分享都到首页
我的参数中都没有名叫from的参数
问题的根本在于处理掉重复的URL参数名
解决办法请勿模仿
// vue index.html
<script>
function getQueryVariable(variable) {
var query = window.location.search.substring(1);
var vars = query.split("&");
for (var i = 0; i < vars.length; i++) {
var pair = vars[i].split("=");
if (pair[0] == variable) { return pair[1]; }
}
return (false);
}
if(getQueryVariable('from')){
window.location.href = window.location.href.split('?')[0]
}
</script>
