微信测试号实现微信网页的分享

1、要做什么呢

转换成  的效果。

2、一个微信公众号的分享,起初我的设想是使用微信内置浏览器JsAPI(WeixinJSBridge)来实现,但是我查了一下(

网上说:在这里有必要跟大家再说一下:这个API在以前公布的部分接口被官方和谐掉很久 了, 比如一键关注、分享给好友、分享到朋友圈等。当然,你可能会发现微信官方推送的一些文章还能使用这些功能,粗略估计,官方是对这个API增加了白名单控 制,判断Referer,如果是微信官方的地址、或者是有合作的商家地址,则允许调用,否则,返回“access denied”!),当时我也试过啦一次,发现没有效果,所以就放弃啦。

3、代码实现:

 $(document).ready()
    {	
        $.ajax({
            type: "post",
            dataType: "json",
            async: false,
            url: "<%=request.getContextPath()%>/mer/finShareConfig.do",//获取
            data: {
            	merId:Request.QueryString('merId'),
            	url:  encodeURIComponent(window.location.href.split("#")[0])  //encodeURIComponent(window.location.href.split("#")[0]) encodeURIComponent(URL.split('#')[0])  window.location.href.split('#')[0]
            },
            complete: function () { },
            success: function (data) {

            	 var data =data.map;
            	 wx.config({
                     appId: data.appId,//APPID
                     timestamp: data.timestamp,//上面main方法中拿到的时间戳timestamp
                     nonceStr: data.nonceStr,//上面main方法中拿到的随机数nonceStr
                     signature: data.signature,//上面main方法中拿到的签名signature
                     //需要调用的方法接口
                     jsApiList: ['onMenuShareTimeline','onMenuShareAppMessage','onMenuShareQQ']
                 });
            	 
            }
        });
    } 
    
    
    wx.error(function (res) {
       
    });
    wx.ready(function(){
    	var title=vm.activity.shareTitle;//查询你要分享的标题
    	var desc=vm.activity.shareDesc;//分享的描述
    	var sharePic =vm.config.value+'/upload'+vm.activity.sharePic;//分享的图片
        wx.onMenuShareTimeline({
            title: title, // 分享标题
            desc:  desc, // 分享描述
            link: window.location.href, // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
            imgUrl: sharePic, // 分享图标
            success: function () {
                // 用户点击了分享后执行的回调函数
            }
        });
        wx.onMenuShareAppMessage({
            title: title, // 分享标题
            desc: desc, // 分享描述
            link: window.location.href, // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
            imgUrl: sharePic, // 分享图标
            type: '', // 分享类型,music、video或link,不填默认为link
            dataUrl: '', // 如果type是music或video,则要提供数据链接,默认为空
            success: function () {
                // 用户点击了分享后执行的回调函数
            }
        });
        wx.onMenuShareQQ({
            title: title, // 分享标题
            link:window.location.href, // 分享链接
            imgUrl: sharePic, // 分享图标
            shareUrl:window.location.href,
            success: function () {

                // 用户确认分享后执行的回调函数
            },
            cancel: function () {
                // alert("失败")
                // 用户取消分享后执行的回调函数
                // config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,也可以在返回的res参数中查看,对于SPA可以在这里更新签名。
            }
        });
    });

4、主要参考博客:

                           https://www.cnblogs.com/gamedaybyday/p/6207830.html

                           https://www.jianshu.com/p/bf743d52c6d3

                           https://www.jianshu.com/p/a3be3c457bc5

猜你喜欢

转载自blog.csdn.net/cheng_zhang_zhong/article/details/88387669