微信分享网页时自定义标题、描述和图片

用微信打开一个网页，选择右上角的“发送给朋友”后，收到的消息是这样的：

而为了推广效果，我们更希望能自定义标题、描述和图片，效果如下图：

下面介绍下怎样来实现这个功能

<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js" ></script>
<script type="text/javascript">
    var imgUrl = 'http://dev.mymax.cn/affix/manmanhouse/images/share.jpg'; 
    var lineLink = 'http://dev.mymax.cn/affix/manmanhouse/index.html'; 
    var descContent = '人类天生就爱玩游戏，游戏为什么吸引人？如果借助游戏的规律，是否可以让工作学习变得更精彩？';
    var shareTitle = '游戏化学习工作坊第四站-北京清华科技园';
    var appid = '';

    $.ajax({
        type : 'POST',
        url :  "http://dev.mymax.cn/running/comm/weixin/open/jsSDKConfig", //这个地址并非通用且长期有效，请去微信官方查看文档，并自行配置
        dataType : "json",
        data:{url:window.location.href},
        success : function(response){
             var appId = response.s.appId;
                var timestamp = response.s.timeStamp;
                var nonceStr = response.s.nonceStr;
                var signature = response.s.signature;

                wx.config({
                    debug: false,
                    appId: appId,
                    timestamp: timestamp,
                    nonceStr: nonceStr,
                    signature: signature,
                    jsApiList: [
                        'checkJsApi',
                        'onMenuShareTimeline',
                        'onMenuShareAppMessage'
                    ]
                });
                 wx.ready(function() {
                         
                        wx.onMenuShareTimeline({
                            title: shareTitle, // 分享标题
                            link: lineLink, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
                            imgUrl: imgUrl, // 分享图标
                            success: function () {
                                // 用户确认分享后执行的回调函数
                            },
                            cancel: function () {
                                // 用户取消分享后执行的回调函数
                            }
                        });
                        wx.onMenuShareAppMessage({
                            title: shareTitle, // 分享标题
                            desc: descContent, // 分享描述
                            link: lineLink, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
                            imgUrl: imgUrl, // 分享图标
                            type: '', // 分享类型,music、video或link，不填默认为link
                            dataUrl:'' , // 如果type是music或video，则要提供数据链接，默认为空
                            success: function () {
                                // 用户确认分享后执行的回调函数
                                
                            },
                            cancel: function () {
                                // 用户取消分享后执行的回调函数
                            }
                        });
                });
        },
        error:function(response){
            window.parent.growl("删除失败["+response.responseText+"]!","error");
        }
    });
</script>

上方代码只为HTML中的部分，ajax的url地址并非通用且长期有效，还需要在微信公众号中绑定同样域名设置接口权限。

具体的方法请查看微信官方技术文档：微信JS-SDK说明文档，自行配置。