美文网首页
微信分享安卓没问题IOS分享失效

微信分享安卓没问题IOS分享失效

作者: minterjiang | 来源:发表于2017-07-20 00:06 被阅读3022次

    简单说一下,这次踩过的的坑。搞了两天才解决。
    需求是 微信分享 自定义标题,图片,介绍,和链接。
    网上都有相关文章,代码也比较简单,至于怎么配置域名,然后签名算法,这里就不说了,网上各种语言的版本代码都有而且都比较成熟,主要说下我踩过的坑。
    所有代码都写好,部署到服务器上 拿起我的安卓手机,测试一切正常。

    安卓分享图片

    后来在IOS上分享出来的就不能够自定义这些信息。如图和没有接微信分享接口的效果是一样的就是分享当前页面。

    IOS分享图

    开始也找不到原因,开启微信的Debug模式 弹出的都是正确的,后来网上找了很多资料,说是图片的大小不能超过32kb。并且要是JS安全域名下的。我也都设置好了,还是不行。

    然后我就摸不着头脑了,我以为官方的微信JS-SDK Demo(http://203.195.235.76/jssdk/) 也会有问题,结果官方的demo没毛病,那只好一行代码一行代码的对比,这中间多少泪就不说了,比对到最后也没发现有问题。
    一行代码一行代码的排除 最后的最后的最后, 才发现原来 link 需要在JS安全域名下。

    IOS分享的时候图片的链接地址 和 link 都需要在 JS安全域名下并且带http头。

    @{
        ViewBag.Title = "xx梦想加油站";
        Layout = null;
    }
    <!DOCTYPE html>
    <html lang="zh-cn">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>xx梦想加油站</title>
    </head>
    <body>    
        <script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
        <script type="text/javascript">
            wx.config({
                debug: false,
                appId: '@ViewBag.AppId',
                timestamp: @ViewBag.ts,
                nonceStr: '@ViewBag.noncestr',
                signature: '@ViewBag.signature',
                jsApiList: [
                  'onMenuShareTimeline',
                  'onMenuShareAppMessage',           
                ]
            });
            wx.ready(function() {
                //config信息验证后会执行ready方法,所有接口调用都必须在config接口获得结果之后
                var sharetitle='@ViewBag.Name 正在参加浦软梦想加油站活动。';
                var sharedescript='请你为我点亮梦想,快来一起参加吧! ';
                var sharelink='http://xxx.com/h5.html';
                var shareimgurl='http://m.xxx.com/Content/skin/images/cover.png';
    
                var shareData = {
                    title: sharetitle,
                    desc: sharedescript,
                    link:sharelink,
                    imgUrl:shareimgurl
                };
                //分享给朋友
                wx.onMenuShareAppMessage({
                    title: sharetitle,
                    desc: sharedescript,
                    link: sharelink,
                    imgUrl:shareimgurl,
                    trigger: function (res) {
                        // 不要尝试在trigger中使用ajax异步请求修改本次分享的内容,因为客户端分享操作是一个同步操作,这时候使用ajax的回包会还没有返回
                        alert('用户点击发送给朋友');
                    },
                    success: function (res) {
                        alert('已分享');
                    },
                    cancel: function (res) {
                        alert('已取消');
                    },
                    fail: function (res) {
                        alert(JSON.stringify(res));
                    }
                });    
                
                //分享给朋友圈
                wx.onMenuShareTimeline({
                    title: sharetitle,
                    link: sharelink,   
                    desc: sharedescript,
                    imgUrl:shareimgurl,
                    trigger: function (res) {
                        // 不要尝试在trigger中使用ajax异步请求修改本次分享的内容,因为客户端分享操作是一个同步操作,这时候使用ajax的回包会还没有返回
                        // alert('用户点击分享到朋友圈');
                    },
                    success: function (res) {
                        // alert('已分享');
                    },
                    cancel: function (res) {
                        // alert('已取消');
                    },
                    fail: function (res) {
                        // alert(JSON.stringify(res));
                    }
                });
    
                wx.onMenuShareAppMessage(shareData);
                wx.onMenuShareTimeline(shareData);
            });
            wx.error(function(res){
                // config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,也可以在返回的res参数中查看,对于SPA可以在这里更新签名。
                alert(JSON.stringify(res));
            });
        </script>
    </body>
    </html>
    
    

    相关文章

      网友评论

          本文标题:微信分享安卓没问题IOS分享失效

          本文链接:https://www.haomeiwen.com/subject/yowrkxtx.html