前一段之間做微信自定義分享,積累了一些經驗,分享給大家。
步驟一、二在微信開發者文檔中已經很詳細了,直接從步驟三開始吧。
步驟三要參數微信的參數,除了appId之外,其他的參數都是動態的,這裡,我用的php語言,在後端生成的參數,代碼如下:
php端代碼:
public function getwxinfo(){ $dataurl = I('dataurl'); include('./ThinkPHP/Library/Vendor/jssdk/jssdk.php'); $jssdk = new \JSSDK('appId','appSecret'); $signPackage = $jssdk->GetSignPackage($dataurl); exit(response('1','ok',$signPackage)); }
生成簽名時,必須獲取當前頁面的URL,所以$dataurl是通過下面JS動態獲取的,切記。
JS端代碼:
var dataurl = window.location.href; $.ajax({ type:'post', data:{'dataurl':dataurl}, url:'/index.php/Home/Index/getwxinfo', dataType:'json', success:function(json){ var list = json.data; var appId = list.appId; var timestamp = list.timestamp; var nonceStr = list.nonceStr; var signature = list.signature; weixinInfo(appId,timestamp,nonceStr,signature); }, error:function() { //alert('網絡不給力哦...') } }); function weixinInfo(appId,timestamp,nonceStr,signature){ wx.config({ debug: false, appId: appId, timestamp:timestamp , nonceStr:nonceStr, signature:signature, jsApiList: [ 'checkJsApi', //判斷當前客戶端版本是否支持指定JS接口 'onMenuShareTimeline', //分享到朋友圈 'onMenuShareAppMessage', //分享給好友 'onMenuShareQQ', //分享到QQ 'onMenuShareWeibo' //分享到微博 ] }); } wx.ready(function () { //微信好友 var s_title = '分享標題'; var s_desc = '分享描述'; var s_link = '分享後的鏈接'; var s_imgUrl = '圖片鏈接'; wx.onMenuShareAppMessage({ //例如分享到朋友圈的API title: s_title, // 分享標題 desc: s_desc, // 分享描述 link: s_link, // 分享鏈接 imgUrl: s_imgUrl, // 分享圖標 success: function () { }, cancel: function () { } }); //朋友圈 wx.onMenuShareTimeline({ title: s_title, // 分享標題 link: s_link, // 分享鏈接 imgUrl: s_imgUrl, // 分享圖標 success: function () { }, cancel: function () { } }); //QQ好友 wx.onMenuShareQQ({ title: s_title, // 分享標題 desc: s_desc, // 分享描述 link: s_link, // 分享鏈接 imgUrl: s_imgUrl, // 分享圖標 success: function () { }, cancel: function () { } }); }); wx.error(function (res) {
alert(res.errMsg); //打印錯誤消息。及把 debug:false,設置為debug:ture就可以直接在網頁上看到彈出的錯誤提示
});
就這麼簡單。
以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持幫客之家。