在微擎调用微信JSSDK实现分享功能

最近遇到一个项目是基于微擎框架做一个分享功能的,微擎本身是自带分享功能的,只是这次想要实现自定义分享内容,故进行了以下代码处理
* $_W[‘account’][‘jssdkconfig’]是微擎封装好的jssdk签名包的内容
* php页面代码

<?php
    if (!defined('IN_IA')) { 
         exit('Access Denied');
    }
    global $_W, $_GPC;
    $shareCon = array(
                         'title' ='分享标题', 
                         'link' => 'www.baidu.com',
                         'imgUrl' => '../addons/ewei_shop/static/images/404.png', 
                         'desc' => '测试分享内容'
                );
    $signPackage = $_W['account']['jssdkconfig'];
    echo '<pre>';
    print_r($_W['account']['jssdkconfig']);
    include $this->template('diyposter/test');
?>

php代码截图

  • html页面代码
<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
<script>
wx.config({
    debug: false,
    appId: '{$signPackage["appId"]}',
    timestamp: '{$signPackage["timestamp"]}',
    nonceStr: '{$signPackage["nonceStr"]}',
    signature: '{$signPackage["signature"]}',
    jsApiList: [
        'checkJsApi',
        'onMenuShareTimeline',
        'onMenuShareAppMessage',
        'onMenuShareQQ',
        'onMenuShareWeibo',
        'onMenuShareQZone'
        ]
});

wx.ready(function(){
    // 分享朋友圈
    wx.onMenuShareTimeline({
    title:'{$shareCon["title"]}',
    link:window.location.href,
    imgUrl:'{php echo tomedia($shareCon["imgUrl"]);}',
    success:function(){
        //发送成功的方法
        alert('已分享');
    },
    cancel:function(){
        //发送取消的方法
        alert('已取消');
    }
});

// 分享给朋友
wx.onMenuShareAppMessage({
    title:'{$shareCon["title"]}',
    desc:'{$shareCon["desc"]}',
    link:window.location.href,
    imgUrl:'{php echo tomedia($shareCon["imgUrl"]);}',
    success:function(){
        //发送成功的方法
        alert('已分享');
    },
    cancel:function(){
        //发送取消的方法
        alert('已取消');
        }
    });
})
</script>

html代码截图

打印出来的签名包数据字段

分享成功后的页面弹框
分享给好友的页面截图

猜你喜欢

转载自blog.csdn.net/zhemejinnameyuanxc/article/details/81258584