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

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


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


实现工具:GetwxLink

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

<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>

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容