簡單說一下,這次踩過的的坑逝撬。搞了兩天才解決。
需求是 微信分享 自定義標(biāo)題溯警,圖片愧膀,介紹檩淋,和鏈接。
網(wǎng)上都有相關(guān)文章媚朦,代碼也比較簡單日戈,至于怎么配置域名询张,然后簽名算法,這里就不說了浙炼,網(wǎng)上各種語言的版本代碼都有而且都比較成熟份氧,主要說下我踩過的坑。
所有代碼都寫好弯屈,部署到服務(wù)器上 拿起我的安卓手機(jī)蜗帜,測試一切正常。
安卓分享圖片
后來在IOS上分享出來的就不能夠自定義這些信息资厉。如圖和沒有接微信分享接口的效果是一樣的就是分享當(dāng)前頁面厅缺。
IOS分享圖
開始也找不到原因,開啟微信的Debug模式 彈出的都是正確的宴偿,后來網(wǎng)上找了很多資料湘捎,說是圖片的大小不能超過32kb。并且要是JS安全域名下的窄刘。我也都設(shè)置好了窥妇,還是不行。
然后我就摸不著頭腦了都哭,我以為官方的微信JS-SDK Demo(http://203.195.235.76/jssdk/) 也會(huì)有問題秩伞,結(jié)果官方的demo沒毛病逞带,那只好一行代碼一行代碼的對比欺矫,這中間多少淚就不說了,比對到最后也沒發(fā)現(xiàn)有問題展氓。
一行代碼一行代碼的排除 最后的最后的最后穆趴, 才發(fā)現(xiàn)原來 link 需要在JS安全域名下。
IOS分享的時(shí)候圖片的鏈接地址 和 link 都需要在 JS安全域名下并且?guī)ttp頭遇汞。
@{
ViewBag.Title = "xx夢想加油站";
Layout = null;
}
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>xx夢想加油站</title>
</head>
<body>
<script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
<script type="text/javascript">
wx.config({
debug: false,
appId: '@ViewBag.AppId',
timestamp: @ViewBag.ts,
nonceStr: '@ViewBag.noncestr',
signature: '@ViewBag.signature',
jsApiList: [
'onMenuShareTimeline',
'onMenuShareAppMessage',
]
});
wx.ready(function() {
//config信息驗(yàn)證后會(huì)執(zhí)行ready方法未妹,所有接口調(diào)用都必須在config接口獲得結(jié)果之后
var sharetitle='@ViewBag.Name 正在參加浦軟夢想加油站活動(dòng)。';
var sharedescript='請你為我點(diǎn)亮夢想空入,快來一起參加吧络它! ';
var sharelink='http://xxx.com/h5.html';
var shareimgurl='http://m.xxx.com/Content/skin/images/cover.png';
var shareData = {
title: sharetitle,
desc: sharedescript,
link:sharelink,
imgUrl:shareimgurl
};
//分享給朋友
wx.onMenuShareAppMessage({
title: sharetitle,
desc: sharedescript,
link: sharelink,
imgUrl:shareimgurl,
trigger: function (res) {
// 不要嘗試在trigger中使用ajax異步請求修改本次分享的內(nèi)容,因?yàn)榭蛻舳朔窒聿僮魇且粋€(gè)同步操作歪赢,這時(shí)候使用ajax的回包會(huì)還沒有返回
alert('用戶點(diǎn)擊發(fā)送給朋友');
},
success: function (res) {
alert('已分享');
},
cancel: function (res) {
alert('已取消');
},
fail: function (res) {
alert(JSON.stringify(res));
}
});
//分享給朋友圈
wx.onMenuShareTimeline({
title: sharetitle,
link: sharelink,
desc: sharedescript,
imgUrl:shareimgurl,
trigger: function (res) {
// 不要嘗試在trigger中使用ajax異步請求修改本次分享的內(nèi)容化戳,因?yàn)榭蛻舳朔窒聿僮魇且粋€(gè)同步操作,這時(shí)候使用ajax的回包會(huì)還沒有返回
// alert('用戶點(diǎn)擊分享到朋友圈');
},
success: function (res) {
// alert('已分享');
},
cancel: function (res) {
// alert('已取消');
},
fail: function (res) {
// alert(JSON.stringify(res));
}
});
wx.onMenuShareAppMessage(shareData);
wx.onMenuShareTimeline(shareData);
});
wx.error(function(res){
// config信息驗(yàn)證失敗會(huì)執(zhí)行error函數(shù)埋凯,如簽名過期導(dǎo)致驗(yàn)證失敗点楼,具體錯(cuò)誤信息可以打開config的debug模式查看扫尖,也可以在返回的res參數(shù)中查看,對于SPA可以在這里更新簽名掠廓。
alert(JSON.stringify(res));
});
</script>
</body>
</html>