qq、微信二次分享

三世轮回 提交于 2019-12-06 02:01:34

在腾讯移动web开发平台上发现这么一个分享组件:支持自定义微信、手机QQ和QQ空间的对外分享功能。现在常用的百度分享只适合在PC上使用,到了移动的时代了,分享到微信,手机QQ和QQ空间这几个却无法实现自定义。有了这个组件之后就方便许多了,推荐给大家使用。另外UC浏览器和QQ浏览器也有自己的内嵌API分享设置,后面将会分享如何在这两个中自定义分享的内容。

 

 

组件地址:http://qzonestyle.gtimg.cn/qzone/qzact/common/share/share.js

 

组件功能:

 

定制微信,手机QQ,QQ空间APP内的分享内容。

 

组件接口:

 

/**
 * 定制接口
 * @param opts 定制内容
 */setShareInfo({
    title:          '分享标题', // 分享标题
    summary:        '分享内容', // 分享内容
    pic:            'http://qzonestyle.gtimg.cn/aoi/sola/20150617094556_OvfOpoRKRB.png', // 分享图片
    url:            'http://qzs.qzone.qq.com/qzone/qzact/act/2015/father-day-m/index.html', // 分享链接
    // 微信权限验证配置信息,若不在微信传播,可忽略
    WXconfig: {
        swapTitleInWX: true, // 是否标题内容互换(仅朋友圈,因朋友圈内只显示标题)
        appId: appId, // 公众号的唯一标识
        timestamp: timestamp, // 生成签名的时间戳
        nonceStr: nonceStr, // 生成签名的随机串
        signature: signature // 签名
    }
});

 

未使用模块加载器:

 

<script type="text/javascript" src="http://qzonestyle.gtimg.cn/qzone/qzact/common/share/share.js"></script>
<script type="text/javascript">
     setShareInfo({
         title:          '分享标题',
         summary:        '分享内容',
         pic:            'http://qzonestyle.gtimg.cn/aoi/sola/20150617094556_OvfOpoRKRB.png',
         url:            'http://qzs.qzone.qq.com//qzone/qzact/act/2015/father-day-m/index.html',
         WXconfig:       {
             swapTitleInWX: true,
             appId: '',
             timestamp: '',
             nonceStr: '',
             signature: ''
         }
     });</script>

 

使用seajs:

 

seajs.use('http://qzonestyle.gtimg.cn/qzone/qzact/common/share/share.js', function(setShareInfo) {
     setShareInfo({
         title:          '分享标题',
         summary:        '分享内容',
         pic:            'http://qzonestyle.gtimg.cn/aoi/sola/20150617094556_OvfOpoRKRB.png',
         url:            'http://qzs.qzone.qq.com//qzone/qzact/act/2015/father-day-m/index.html',
         WXconfig:       {
             swapTitleInWX: true,
             appId: '',
             timestamp:'',
             nonceStr: '',
             signature: ''
         }
     });
});

 

 

使用requirejs:

 

require(['http://qzonestyle.gtimg.cn/qzone/qzact/common/share/share.js'], function(setShareInfo) {
    setShareInfo({
        title:          '分享标题',
        summary:        '分享内容',
        pic:            'http://qzonestyle.gtimg.cn/aoi/sola/20150617094556_OvfOpoRKRB.png',
        url:            'http://qzs.qzone.qq.com//qzone/qzact/act/2015/father-day-m/index.html',
        WXconfig:       {
            swapTitleInWX: true,
            appId: '',
            timestamp:'',
            nonceStr: '',
            signature: ''
        }
    });
});

 

 

注意事项:

 

由于手机QQ限制,分享URL必须与页面URL同一域名,否则设置不生效。

可根据当前页面的客户端环境,判断是否需要WX配置,减少不必要请求。

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!