最近在項目開發(fā)中遇到一個情況,引入jssdk后開發(fā)者工具分享成功.
情況1:
手機分享失敗或點擊鏈接跳轉(zhuǎn)首頁的問題音五。
解決如下:
encodeURIComponent(location.href.split("#")[0]);
刪除網(wǎng)址中的#
進行網(wǎng)址編碼
后端進行解碼
原因
微信客戶端會將#后的字符串進行處理
完整代碼(僅供參考,修改可用)
具體數(shù)據(jù)由后端返回
分享的link網(wǎng)址由后端拼接,網(wǎng)址加上了淳梦?
可避免被處理 https://wechat-dev.chinacsa.me/?#//goodsDetail/67
getWxConfig() {
let self = this;
let fullUrl = encodeURIComponent(location.href.split("#")[0]);
self.url = self.$HOST + '/common/wechat_js';
self.$axios.get(self.url, {
params: {
apis: ['onMenuShareAppMessage', 'onMenuShareTimeline'],
fullUrl: fullUrl
}
}).then((res) => {
console.log(res);
// console.log(self.baseInfo);
goodsId: self.goodsId
let data = JSON.parse(res.data.data);
wx.config({
debug: false, // 開啟調(diào)試模式,調(diào)用的所有api的返回值會在客戶端alert出來,若要查看傳入的參數(shù)昔字,可以在pc端打開谭跨,參數(shù)信息會通過log打出,僅在pc端時才會打印李滴。
appId: data.appId, // 必填螃宙,公眾號的唯一標識
timestamp: data.timestamp, // 必填,生成簽名的時間戳
nonceStr: data.nonceStr, // 必填所坯,生成簽名的隨機串
signature: data.signature, // 必填谆扎,簽名
jsApiList: ['onMenuShareAppMessage', 'onMenuShareTimeline'] // 必填,需要使用的JS接口列表
});
})
wx.ready(function() {
wx.onMenuShareAppMessage({
title: self.shareData.name, // 分享標題
desc: self.shareData.descrip,
link: self.shareData.url, // 分享鏈接芹助,該鏈接域名或路徑必須與當前頁面對應的公眾號JS安全域名一致
imgUrl: self.shareData.imgUrl, // 分享圖標
success: function() {
self.$toast.success('分享成功');
}
})
wx.onMenuShareTimeline({
title: self.shareData.name, // 分享標題
link: self.shareData.url, // 分享鏈接堂湖,該鏈接域名或路徑必須與當前頁面對應的公眾號JS安全域名一致
imgUrl: self.shareData.imgUrl, // 分享圖標
success: function() {
self.$toast.success('分享成功');
}
})
})
}
情況2 網(wǎng)址帶中文標識
如: http://www.porn.com/userId=1&username=哈哈哈
產(chǎn)生情況:Android微信端分享成功 IOS微信端分享失敗
原因:IOS微信端中l(wèi)ink無法辨識中文,因此需要進行轉(zhuǎn)義
(link是分享出去的url)
urlEncode(url)
即可.