我的网页链接:https://www.zhangw.vip/details.html?id=51
1、页面已加入JS <script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
2、公众号已配置JS接口安全域名
3、阿里云服务器白名单已配置
4、前端主要JS代码如下
$(document).ready(function () {
//分享朋友圈
getWeCharShareData();
});
function getWeCharShareData(){
//获取当前页面的url
var linkUrl = window.location.href;
console.log(linkUrl);
//调用后台获取接口参数
$.ajax({
type:'GET',
url:baseUrl+'/api/v1/pub/wechat/share',
data:{
link_url:linkUrl
},
dataType: 'json',
success: function(resp){
console.log(JSON.stringify(resp));
//JSON.stringify()
if (resp.code == 0) {
weCharShare(resp.data.signature, resp.data.appId, resp.data.jsapi_ticket, resp.data.url, resp.data.nonceStr, resp.data.timestamp, resp.data.title, resp.data.desc, resp.data.imgUrl);
} else{
}
},
error: function(jqXHR, textStatus, errorThrown){
alert("其他错误:" + jqXHR.status);
}
});
}
function weCharShare(usignature, uappId, ujsapi_ticket, uurl, unonceStr, utimestamp, utitle, udesc, uimgUrl){
var signature = usignature;
var appId = uappId;
var jsapi_ticket = ujsapi_ticket;
var url = uurl;
var nonceStr = unonceStr;
var timestamp = utimestamp;
var title = utitle;
var desc = udesc;
var imgUrl = uimgUrl;
//**配置微信信息**
wx.config ({
debug : true,
appId : appId,
timestamp : timestamp,
nonceStr : nonceStr,
signature : signature,
jsApiList : [
// 所有要调用的 API 都要加到这个列表中
//自定义“分享到朋友圈”及“分享到QQ空间”按钮的分享内容
'updateTimelineShareData',
//自定义“分享给朋友”及“分享到QQ”按钮的分享内容
'updateAppMessageShareData'
]
});
wx.ready(function(){
// config信息验证后会执行ready方法,所有接口调用都必须在config接口获得结果之后,config是一个客户端的异步操作,所以如果需要在页面加载时就调用相关接口,则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口,则可以直接调用,不需要放在ready函数中。
// 微信分享的数据
var shareData = {
"imgUrl" : imgUrl,
"link" : url,
"desc" : desc,
"title" : title,
success : function () {
// 分享成功可以做相应的数据处理
console.log("回调000000");
}
};
});
//分享微信朋友圈
wx.updateTimelineShareData ({
"title" : title,
"desc" : desc,
"link" : url,
"imgUrl" : imgUrl,
success : function () {
// 分享成功可以做相应的数据处理
console.log("回调000000");
}
});
//分享给朋友
wx.updateAppMessageShareData({
title: title, // 分享标题
desc: desc, // 分享描述
link: url, // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: imgUrl, // 分享图标
success: function () {
// 设置成功
console.log("回调updateAppMessageShareData");
}
});
wx.checkJsApi({
jsApiList: ['updateTimelineShareData','updateAppMessageShareData'], // 需要检测的JS接口列表,所有JS接口列表见附录2,
success: function(res) {
// 以键值对的形式返回,可用的api值true,不可用为false
// 如:{"checkResult":{"chooseImage":true},"errMsg":"checkJsApi:ok"}
console.log("检查检查");
console.log(JSON.stringify(res));
}
});
}
5、部署生产环境后,真机测试看到debug弹出内容均为OK或者success,以下截图为第一步中的文章链接测试:
6、点击右上角三个点选择分享到朋友圈,仍然是一个链接:
7、微信开发者工具测试看控制台内容感觉无问题:
麻烦请问下这还有可能是什么原因造成没有自定义分享效果?
外链打开分享配置不生效。只能通过公众号菜单链接打开,收藏链接打开,扫码二维码打开,app分享链接微信打开,才能生效