网页分享到微信要怎么才能自定义标题，内容和图片呢？

　　网页分享到微信要怎么才能自定义标题，内容和图片呢？

　　微信分享网页时，如何自定义标题、内容、图片？需求概览

　　网页链接可直接在微信中转发，用户在微信内置浏览器中打开后，可通过微信浏览器右上角分享给好友、朋友圈、QQ等。但是如果你这样直接分享，用户看到的只是一个没有任何图形内容的链接。

　　如下图，图1是别人分享给我的链接的效果，图2是我分享给别人的链接的效果。两个程序的用户体验我觉得不用多说了，一看就知道了。

　　

　　项目实现

　　要实现上图中自定义文案和图标的效果，必须使用微信提供的JS-SDK。微信JS-SDK是微信公众平台为Web开发者提供的基于微信的Web开发工具包。请参考微信JS-SDK文档。 （如果不懂技术或者没有认证公众号，也可以使用wecard工具实现相关效果。）

　　

　　具体步骤：

　　1、准备好注册的域名和空间，并将域名绑定到空间。

　　2、登录微信公众平台，进入“公众号设置”的功能设置，填写js接口安全域名。这是你的微信浏览器要打开的域名地址。您无法添加 IP 地址。

　　3、引入js文件，在需要调用js接口的页面插入js文件。

　　http://res.wx.qq.com/open/js/jweixin-1.2.0.js

　　4、通过config接口注入权限并验证配置（这一步是整个步骤中最关键的一步，只有配置信息正确后才能调用JS-SDK）

　　wx.config({

    debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。

    appId: '', // 必填，公众号的唯一标识

    timestamp: , // 必填，生成签名的时间戳

    nonceStr: '', // 必填，生成签名的随机串

    signature: '',// 必填，签名，见附录1

    jsApiList: [] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2

});

　　详细访问代码

　　 

　　   + (currentLink.indexOf("?") > -1 ? ("&u=" + "${u!}" + "&t=" + "${t!}" + "&o=" + "${o!}" + "&s=" + "${s!}") : ("?u=" + "${u!}" + "&t=" + "${t!}" + "&o=" + "${o!}" + "&s=" + "${s!}"));

           shareLink = shareLink  + (shareLink.indexOf("?") > -1 ? ("&city=" + "深圳") : ("?city=" + "深圳"));

    var shareImgUrl = "${IMGPATH!}/images/banner2.png";

    var shareGid = "";

wx.ready(function () {

     //分享给朋友

        wx.onMenuShareAppMessage({

         title: shareTitle,

            desc: shareDesc,

            link: shareLink,

            imgUrl: shareImgUrl,

            success: function (res) {

        shared(shareLink, "friend", shareGid);

            },

            fail: function (res) {

              alert(JSON.stringify(res));

            }

        });

     //分享到朋友圈

        wx.onMenuShareTimeline({

         title: shareTitle,

            desc: shareDesc,

            link: shareLink,

            imgUrl: shareImgUrl,

            success: function (res) {

        shared(shareLink, "Timeline", shareGid);

            },

            fail: function (res) {

              alert(JSON.stringify(res));

            }

        });

       //分享到QQ

        wx.onMenuShareQQ({

         title: shareTitle,

            desc: shareDesc,

            link: shareLink,

            imgUrl: shareImgUrl,

            success: function (res) {

        shared(shareLink, "QQ", shareGid);

            },

            fail: function (res) {

              alert(JSON.stringify(res));

            }

        });

       //分享到腾讯QQ

        wx.onMenuShareWeibo({

         title: shareTitle,

            desc: shareDesc,

            link: shareLink,

            imgUrl: shareImgUrl,

            success: function (res) {

        shared(shareLink, "Weibo", shareGid);

            },

            fail: function (res) {

              alert(JSON.stringify(res));

            }

        });

       //分享到QZone

        wx.onMenuShareQZone({

         title: shareTitle,

            desc: shareDesc,

            link: shareLink,

            imgUrl: shareImgUrl,

            success: function (res) {

        shared(shareLink, "QZone", shareGid);

            },

            fail: function (res) {

              alert(JSON.stringify(res));

            }

        });

    });

    function shared(url, type, gid){

     var rUrl = basePath + "/share/add?type=" + type + "&url=" + encodeURI(url);

     if(!!gid) {

     rUrl += "&gid=" + gid;

     }

     $.ajax({

            type: "GET",

            url: rUrl,

            dataType: "json",

            success: function(rs){

             //alert("分享成功");

            }

     });

    }

   " _ue_custom_node_="true">