当前位置: 移动技术网 > IT编程>开发语言>JavaScript > js实现微信自定义分享功能的代码教程

js实现微信自定义分享功能的代码教程

2018年03月28日  | 移动技术网IT编程  | 我要评论

1.首先要进行js接口安全域名的设置和配置

\

分享页面引用微信js

<script src="https://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
//公众号appid,时间戳,随机字符串,后台返回签名信息,分享标题,分享链接,分享内容48字以内,分享图片
Myth.common.wxShare.WxShare('<%=appId%>', '<%=timestamp%>', '<%=nonceStr%>', '<%=signature%>', '<%=newTitle%>', '<%=Link%>', '<%=Desc%>', '<%=ImgUrl%>');
///封装模块JS
(function (window, $) {
    var Myth = window.Myth = function () { };
    Myth.fn = Myth.prototype;
    var common = Myth.common = Myth.fn.common = {}
    //微信分享
    var wxShare=common.wxShare= {
        WxShare: function (appId, timestamp, nonceStr, signature, title, link, desc, imgUrl) {
            //通过config接口注入权限验证配置
            wx.config({
                debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
                appId: appId, // 必填,公众号的唯一标识
                timestamp: timestamp, // 必填,生成签名的时间戳
                nonceStr: nonceStr, // 必填,生成签名的随机串
                signature: signature,// 必填,签名,见附录1
                jsApiList: ['checkJsApi', 'onMenuShareTimeline', 'onMenuShareAppMessage', 'onMenuShareQQ', 'onMenuShareWeibo', 'onMenuShareQZone'] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2
            });
            //通过ready接口处理成功验证
            wx.ready(function () {
                //判断当前客户端版本是否支持指定JS接口
                //wx.checkJsApi({
                //    jsApiList: ['onMenuShareAppMessage', 'onMenuShareQQ', 'onMenuShareWeibo', 'onMenuShareQZone'], // 需要检测的JS接口列表,所有JS接口列表见附录2,
                //    success: function (res) {
                //        // 以键值对的形式返回,可用的api值true,不可用为false
                //        // 如:{"checkResult":{"chooseImage":true},"errMsg":"checkJsApi:ok"}
                //        if (res) {
                //            alert(JSON.stringify(res));
                //        }
                //    }
                //});
                var data = {
                    title: title, // 分享标题
                    link: link, // 分享链接
                    desc: desc, // 分享描述
                    imgUrl: imgUrl, // 分享图标
                    success: function (res) {
                        // 用户确认分享后执行的回调函数
                        //shareSuccess(res);
                    },
                    cancel: function (res) {
                        // 用户取消分享后执行的回调函数
                    },
                    fail: function (res) {
                        //shareFail();
                    }
                };
                //分享到朋友圈
                wx.onMenuShareTimeline(data);
                //分享给朋友
                wx.onMenuShareAppMessage(data);
                //分享到QQ
                wx.onMenuShareQQ(data);
                //分享到腾讯微博
                wx.onMenuShareWeibo(data);
                //分享到QQ空间
                wx.onMenuShareQZone(data);
            });
            //通过error接口处理失败验证
            wx.error(function (res) {
                //alert(JSON.stringify(res));
            });
            function shareSuccess(res) {
                alert("分享成功:" + JSON.stringify(res));
            }
            function shareFail(res) {
                alert("分享失败:" + JSON.stringify(res));
            }
        }
    }
})(window, jQuery);

如对本文有疑问, 点击进行留言回复!!

相关文章:

验证码:
移动技术网