微信分享常遇问题
1、invalid signature 签名失败
签名一般都是后台生成，检查 appid 是否和后台一致
2.config:ok 分享出去的却不是自己想要的
1.url问题
window.location.href.split('#')[0]，传递url时候去掉#后面的数据
根据实际情况是否对url进行decodeURLCompent）
2.分享link问题
分享出去的链接需要在appid对应的公众号上添加js安全域名
协议//相对写法，不要写死
3.图片链接
图片链接 协议需要写死 http或者https
vue中 可能会遇到 奇怪的问题
ios 分明config:ok 有时候下一页分享却有问题
ios用vue 路由跳转，进入下一页，这时候复制这个链接，发现还是上一页的链接
除了修改跳转方式，还可以通过路由拦截。修改url
router.afterEach((to, from) => {
const u = navigator.userAgent.toLowerCase()
// 微信中跳转
if(u.indexOf("like mac os x") < 0 || u.match(/MicroMessenger/i) != 'micromessenger') return
// 有个坏处就是可能会有奇怪的bug 所以在这针对要分享的页面单独处理 xxxx替换
if (to.path.indexOf('xxxx') > -1){
if (to.path !== global.location.pathname) {
location.assign(to.fullPath)
}
}
})
安卓有时候在vue main.js 分明配置ok 跳转下一页 却不好使 刷新一下就ok
在当前页重新配置吧~
附：
判断是否为微信的方法
function isWeiXin() {
var ua = window.navigator.userAgent.toLowerCase();
if (ua.match(/MicroMessenger/i) == 'micromessenger') {
return true;
} else {
return false;
}
}
微信分享配置
// 是否为微信
if (isWeiXin()){
let url = window.location.href.split('#')[0]
// 解码
url = decodeURIComponent(url)
axios.get('后台地址', { params: { url: url } }).then((response) => {
if (response.data) {
let data = response.data.result
wx.config({
debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
appId: 'xxxxxxxxxxx', // 必填，公众号的唯一标识
timestamp: data.timestamp, // 必填，生成签名的时间戳
nonceStr: data.noncestr, // 必填，生成签名的随机串
signature: data.signature, // 必填，签名，见附录1
jsApiList: [
'checkJsApi',
'hideOptionMenu',
'onMenuShareTimeline',
'onMenuShareAppMessage',
'onMenuShareQQ',
'onMenuShareWeibo',
'onMenuShareQZone'
] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
})
}
})
// }
//微信分享设置
let descs = '我要我的滋味'
this.wxshare({ title: '自定title', imgUrl: '', descs: descs });
}
wxshare({ title, imgUrl, descs }) {
wx.ready(function () {
let url = window.location.href;
// config信息验证后会执行ready方法，所有接口调用都必须在config接口获得结果之后，config是一个客户端的异步操作，所以如果需要在页面加载时就调用相关接口，则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口，则可以直接调用，不需要放在ready函数中。
let shareConfig = {
title: title || '默认title',
link: ,
imgUrl: imgUrl || '默认连接',
desc: descs,
type: 'link',
success: function () {
// 用户确认分享后执行的回调函数
// alert('分享成功')
// alert(imgUrl)
// alert('分享成功')
},
cancel: function () {
// alert('分享取消');
}
}
wx.onMenuShareTimeline(shareConfig);
wx.onMenuShareAppMessage(shareConfig);
wx.onMenuShareQQ(shareConfig);
wx.onMenuShareWeibo(shareConfig);
wx.onMenuShareQZone(shareConfig);
});
},
