微信自定义分享

前一段之间做微信自定义分享，积累了一些经验，分享给大家。

步骤一、二在微信开发者文档中已经很详细了，直接从步骤三开始吧。

步骤三要参数微信的参数，除了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就可以直接在网页上看到弹出的错误提示
});

就这么简单。