本文分享我个人在微信分享功能上的一些逻辑错误,希望大家有所收获。
问题引出:
线上环境进行分享文章时,针对于中文状态下的双引号,等其他特殊符号可能会发生的转义问题。

问题思路:
首先我的前端页面中,PC端有一套代码,Mobile 端有两套代码,首先要确认最终进行分享的是移动端,也就是微信扫描二维码,然后根据二维码进入到文章详情页,在使用右上角的分享到....
解决思路:
在网上看了有很多,大多是根据接口返回过来的文章标题中的转义字符,进行转义如 替换成为空格
function escapeHtmlChars(str) {
return str.replace(/——/g, '——')
.replace(/—/g, '—')
.replace(/“/g, '"')
.replace(/”/g, '"');
}
以下是我个人的完整代码,大家在进行修改的时候一定要查看自己修改的是PC端还是移动端页面,我个人就是犯了这个逻辑错误!!!
$.ajax({
url:ajaxurl,
type:"post",
data:{urll:urll,ajaxurl:ajaxurl},
dataType:"json",
success:function(s){
var descContent = "{$article.excerpt}";
descContent = escapeHtmlChars(descContent);
console.log(descContent);
var tit = "{$article.title}";
tit = escapeHtmlChars(tit);
console.log(tit);
wx.config({
debug: false, //分享成功后可以关闭 false
appId: s.appid,
timestamp: s.timestamp,
nonceStr: s.nonceStr,
signature: s.signature,
jsApiList: ['onMenuShareTimeline','onMenuShareAppMessage','updateAppMessageShareData','updateTimelineShareData']
});
wx.ready(function(){
wx.updateAppMessageShareData({
title: tit, // 分享标题
desc: descContent, // 分享描述
link: s.url, // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: "xxx", // 分享图标
success: function () {
//alert('分享成功');
// 设置成功
}
});
wx.onMenuShareTimeline({
title: tit, // 分享标题
link: s.url, // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: "xxx", // 分享图标 使用绝对路径
success: function () {
//alert('分享成功2');
}
});
wx.onMenuShareAppMessage({
title: tit,
desc: descContent, // 分享描述
link: s.url, // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: "xxx", // 分享图标 使用绝对路径
type: '', // 分享类型,music、video或link,不填默认为link
dataUrl: '', // 如果type是music或video,则要提供数据链接,默认为空
success: function () {
//alert('分享成功');
},
fail: function (res) {
// //alert(JSON.stringify(res));
}
});
wx.error(function(res){
// config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,也可以在返回的res参数中查看,对于SPA可以在这里更新签名。
//alert("errorMSG:"+JSON.stringify(res));
});
});
},
error:function(){
//alert("通信失败");
console.log("通信失败");
}
});
修改完成之后,在进行扫码分享,一切正常了。