微信自定义分享的那些坑!

自定义分享在开发工具里和pc微信好用,在手机上不好用


当你想开发一个微信页面并可以自定义分享给朋友或者分享到朋友圈,qq空间的时候,发现微信文档简直是*****,自行体会。话不多说。我遇到的问题是这样的,问题代码如下

$.post("/v1/jsSign", {url: encodeURIComponent(location.href.split('#')[0])}, function (dataTotal) {
            if (dataTotal.code = 1) {
                var userAppId = dataTotal.data.appId;
                var userTimestamp = dataTotal.data.timestamp;
                var userNonceStr = dataTotal.data.nonceStr;
                var userSignature = dataTotal.data.signature;
                var shareUrl = "";//分享的链接域名必须和当前域名和js安全域名相同
                var shareTitle = "正在邀请你****";
                wx.config({
                    debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
                    appId: userAppId, // 必填,公众号的唯一标识
                    timestamp: userTimestamp, // 必填,生成签名的时间戳
                    nonceStr: userNonceStr, // 必填,生成签名的随机串
                    signature: userSignature,// 必填,签名,见附录1
                    jsApiList: ['checkJsApi', 'onMenuShareTimeline', 'onMenuShareAppMessage'] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2
                });
                wx.checkJsApi({
                    jsApiList: ['checkJsApi','onMenuShareTimeline', 'onMenuShareAppMessage'], // 需要检测的JS接口列表,所有JS接口列表见附录2,
                    success: function (res) {
                        // 以键值对的形式返回,可用的api值true,不可用为false
                        // 如:{"checkResult":{"chooseImage":true},"errMsg":"checkJsApi:ok"}
                    }
                });
                wx.ready(function () {
                    wx.onMenuShareTimeline({
                        title: shareTitle, // 分享标题
                        link: url1, // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
                        imgUrl:'', // 分享图标
                        success: function () {
                            // 用户确认分享后执行的回调函数
                        },
                        cancel: function () {
                            // 用户取消分享后执行的回调函数
                        }
                    });
                    wx.onMenuShareAppMessage({
                        title:shareTitle,  // 分享标题
                        desc: '惊喜大礼等你来拿', // 分享描述
                        link: url1, // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
                        imgUrl:'', // 分享图标
                        type: 'link', // 分享类型,music、video或link,不填默认为link
                        success: function () {
                            // 用户确认分享后执行的回调函数
                        },
                        cancel: function () {
                            // 用户取消分享后执行的回调函数
                        }
                    });
                });
            }
        });


 
 按照微信jssdk文档写完,根本不知道注意点在哪,比较坑的问题如下:

在pc端微信和微信web调试工具好用,功能是正常的,但是在移动端就是不好用,而且jssdk手机也也能正常调起,在成功回调里写弹出框也好用,但是就是自定义分享不好用

前提:获取js签名按照官方文档就行,至于appId错误等这些错误多注意一下。

如果js签名没问题,微信公众平台安全域名与当前页面域名还有分享页面域名一致还不好使排查如下:

1、分享标题是否还有敏感字眼如:红包

2、jssdk是否正确使用

3、分享的域名及shareUrl必须带协议,必须带协议,必须带协议!如:微信域名是mp.weixin.qq.com
则分享的域名为https://mp.weixin.qq.com如果协议是http,则为http://mp.weixin.qq.com,切记

4、如果分享的链接想是微信授权的链接怎么办呢?域名不一样,自定义分享不成功。只需加一个中间跳转页面即可,分享链接指向该中间页面,页面是空白的,只有一个location.href="http://open.weixin.qq.com....."跳转,







展开阅读全文
  • 3
    点赞
  • 7
    评论
  • 0
    收藏
  • 一键三连
    一键三连
  • 扫一扫,分享海报

相关推荐
©️2020 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值