前端做微信好友分享_前端微信分享，调用微信分享，分享朋友圈，分享微信好友，分享qq空间，qq好友...
項目中很多使用到微信分享的地方，對于前端來說也算很簡單了，建議寫該功能時使用微信調試工具，便于調試，直接上代碼
第一步，引入微信配置文件
//這里的AJAX用于獲取后臺數據，當然也可以不用這么寫，您只需要提取您需要的代碼即可
$.ajax({
url: "后臺接口地址，用于獲取需要的微信配置",
data: {
//需要encodeURIComponent轉碼，默認為分享當前地址
url: encodeURIComponent(window.location.href)
},
type: 'POST',
success: function(res) {
//獲取數據之后的操作，如果配置信息在其他地方獲取，刪掉這段AJAX請求，該參數就好
console.log(res);
var obj = res.data;
//配置微信參數
wx.config({
debug: true, //開啟調試模式,調用的所有api的返回值會在客戶端alert出來
appId:obj.appid, //在微信綁定公眾號時生成的appid,有后臺返回
timestamp: obj.timestamp, //生成簽名的時間戳，由后臺返回
nonceStr: obj.nonceStr, //生成簽名的隨機串，由后臺返回
signature: obj.signature, //簽名，由后臺返回
jsApiList: ['onMenuShareAppMessage', 'onMenuShareTimeline']
//jsApiList參數可以有很多，一下一一對應列出來
//但是下面需要添加對應的參數信息(下面只寫了分享到微信好友和朋友圈，方便復制)
//onMenuShareQQ 分享到QQ好友
//onMenuShareWeibo 分享到騰訊微博
//onMenuShareQZone 分享QQ空間
});
wx.onMenuShareTimeline({
//以下是微信的分享的配置信息，建議從后端獲取
title: "分享出去的標題",
link: "分享出去的連接地址！！！這里的地址必須是當前在微信綁定的域名下的地址",
imgUrl: "分享出去的圖片地址！！！圖片也必須是綁定域名下的圖片",
desc: "詳細描述",
trigger: function(res) {
// 觸發時需要做的事...
},
success: function() {
// alert('分享到朋友圈成功');
},
cancel: function() {
// alert('你沒有分享到朋友圈');
},
fail: function(res) {
//這里必須寫，可以再非微信端彈出錯誤信息，方便調試
alert(JSON.stringify(res));
}
});
wx.onMenuShareAppMessage({
title: "分享出去的標題",
link: "分享出去的連接地址！！！這里的地址必須是當前在微信綁定的域名下的地址",
desc: "詳細描述",
imgUrl: "分享出去的圖片地址！！！圖片也必須是綁定域名下的圖片",
trigger: function(res) {
// 觸發時需要做的事...
},
success: function(res) {
//alert('分享給朋友成功');
},
cancel: function(res) {
//alert('你沒有分享給朋友');
},
fail: function(res) {
//這里必須寫，可以再非微信端彈出錯誤信息，方便調試
alert(JSON.stringify(res));
}
});
}
});
OK，直接復制粘貼，改改參數就行了，很簡單，比較坑的是，我們在配置了這些參數之后，也只能通過微信右上角的按鈕來手動分享，這就很尷尬了，哈哈哈。。。。。。
我是這么操作的
分享成功圖片
在成功之后的回調里，顯示這張圖片就好了，感覺好Low的樣子，Low就Low吧。。。。。。
寫的比較詳細，新手試用最佳，如有錯希望各位在下方評論出來，謝謝。
總結
以上是生活随笔為你收集整理的前端做微信好友分享_前端微信分享，调用微信分享，分享朋友圈，分享微信好友，分享qq空间，qq好友...的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： webpack 打包第三方库_webpa
- 下一篇： hi3516配置wifi_HISI 35