这个问题折磨了好久，问了很多人都觉得很简单，的确很简单相对于做过了的人来说的话，的确如此，但是第一次做的话，太多坑要踩了，决定记录下来
1、公众号配置：
如果你们的公众号有专人保管，那么跟他说把安全域名加一下，安全域名用于微信的验证，没有这一步操作，下面的都白搭。比如我们的测试公众号，绑定的就是我们测试服务器的域名。同理，生产也是如此。
2、后端配置VUE:
要想使用微信的JS-SDK功能，需要生成签名，配合appId才能使用，这些步骤通常是由后端生成的。这里省去3000字描述如何生成签名，反正你找后端同学就对了。
3、前端配置
终于轮到我们前端上场了，啰嗦了那么多，下面让我们正式起飞。
4，安装微信JS-SDK
首先我们通过npm 安装 微信的js-sdk，当然你也可以在index.html页面中直接加
<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
引用，哪种方式都可以。
//安装
npm install weixin-js-sdk --save
//在需要使用的路由里进行引用 也可以进行全局引用
import wx from 'weixin-js-sdk'
话不多说，先上代码了
//微信分享
WeChatshare(){
let that=this;
let data={url:window.location.href.split('#')[0]};
this.axios.post('/api/v1/signture',data)
.then((res)=>{
wx.config({
debug: false, //开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
appId: res.data.data.appId, //必填，公众号的唯一标识
timestamp: res.data.data.timestamp, // 必填，生成签名的时间戳
nonceStr: res.data.data.nonceStr, // 必填，生成签名的随机串
signature: res.data.data.signature, // 必填，签名
jsApiList: ['onMenuShareTimeline','onMenuShareAppMessage'] // 必填，需要使用的JS接口列表
});
//拼接当前地址
let shareUrl=window.location.href.split('#')[0]+'#'+window.location.href.split('#')[1];
shareUrl = shareUrl.split('#')[0] + 'static/html/redirect.html?app3Redirect=' + encodeURIComponent(shareUrl);
wx.ready(function () {
//分享给朋友
wx.onMenuShareAppMessage({
title: that.fenxi_title,
desc: that.fenxi_describe,
link: shareUrl,
imgUrl: that.fenxi_img,
success: function (res) {
alert('分享成功！');
},
cancel:function(res){
alert('分享失败！');
}
})
//分享到朋友圈
wx.onMenuShareTimeline({
title: that.fenxi_title,
link: shareUrl,
imgUrl: that.fenxi_img,
success: function (res) {
alert('分享成功！');
},
cancel:function(res){
alert('分享失败！');
}
})
});
})
.catch((res)=>{
// console.log(res);
})
},
还是分解下吧
一开始还是先查看微信公众平台
https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115
wx.config({
debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
appId: '', // 必填，公众号的唯一标识
timestamp: , // 必填，生成签名的时间戳
nonceStr: '', // 必填，生成签名的随机串
signature: '',// 必填，签名
jsApiList: [] // 必填，需要使用的JS接口列表
});
wx.ready(function () {
//分享给朋友
wx.onMenuShareAppMessage({
title: "",// 分享标题
desc: "",// 分享描述
link: "",// 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: "",// 分享图标
success: function (res) {
alert('分享成功！');
},
cancel:function(res){
alert('分享失败！');
}
})
//分享到朋友圈
wx.onMenuShareTimeline({
title: "",// 分享标题
link: "",// 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: "",// 分享图标
success: function (res) {
alert('分享成功！');
},
cancel:function(res){
alert('分享失败！');
}
})
});
根据sdk文档的教程来，如果都没问题的话还是报签名错误，那应该是后台的问题了
后面可能还会出现分享的链接一直跳转至首页问题，我用的vue 带hash '#/' 微信分享后点开链依然是首页，百度了下，记录下来
第一种方法
网上很多网友都说这个方法可行 通过尝试后发现依然还是出现那个问题
//将地址拼接
window.location.href.split('#')[0]+'#'+window.location.href.split('#')[1]
第二种方法 使用url重定向 测试有效
在static文件夹下，新建html/redirect.html。
redirect.html 内容：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<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>
</body>
</html>
然后最后的地址
let shareUrl=window.location.href.split('#')[0]+'#'+window.location.href.split('#')[1];
shareUrl = shareUrl.split('#')[0] + 'static/html/redirect.html?app3Redirect=' + encodeURIComponent(shareUrl);//需要分享的地址
到了这里就结束了，可能写的不是太好，请打算指教
