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

2017-07-20  本文已影响3022人  minterjiang

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

安卓分享图片

后来在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>

上一篇下一篇

猜你喜欢

热点阅读