H5 在微信上分享如何自定义标题+内容+图片

1、在微信上分享的时候发现只有头部标题显示，没有内容和图片，那么如何自定义内容和图片呢？ 首先第一步在 index.html先引入微信JS sdk

<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>

2、加上一下js代码，就可以达到自定分享效果了

$(function() {
//创建分享
        function funcShare() {
            $.ajax({
                async: false,
                url: "../ShareHandler.ashx",
                data: {
                    dataurl: location.href.split("#")[0]
                },
                success: function(res) {
                    var json = eval("(" + res + ")");
                    console.log(json);
                    var jsApiList = ["onMenuShareTimeline", "onMenuShareAppMessage", "onMenuShareQQ",
                        "onMenuShareWeibo", "onMenuShareQZone"
                    ];
                    wx.config({
                        debug: false,
                        appId: json.wxappid,
                        timestamp: json.timestamp,
                        nonceStr: json.noncestr,
                        signature: json.strSige,
                        jsApiList: jsApiList
                    });
                }
            });
        }


        //签名完成
        wx.ready(function() {

            // console.log("验证完成！！！");
            
            //分享的头部标题
            var title = "标题";
            //分享的内容
            var desc = "baidu.com";
            var link = location.href.split("#")[0];
            //分享要显示的右下角小图片
            var imgUrl = "http://www.to-morrow.com/attractInvestment/img/logo.png";

            //朋友圈
            wx.onMenuShareTimeline({
                title: title,
                link: link,
                imgUrl: imgUrl
            });

            //朋友
            wx.onMenuShareAppMessage({
                title: title,
                desc: desc,
                link: link,
                imgUrl: imgUrl
            });

            //QQ
            wx.onMenuShareQQ({
                title: title,
                desc: desc,
                link: link,
                imgUrl: imgUrl
            });

            //微博
            wx.onMenuShareWeibo({
                title: title,
                desc: desc,
                link: link,
                imgUrl: imgUrl
            });

            //QQ空间
            wx.onMenuShareQZone({
                title: title,
                desc: desc,
                link: link,
                imgUrl: imgUrl
            });

        });

        funcShare();


    })

标签：自定义,title,微信,H5,json,link,wx,imgUrl,desc
来源： https://www.cnblogs.com/laid/p/15177188.html