微信、手机QQ和QQ空间的web app分享API代码

文章目录

在腾讯移动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:          '父爱,在你看不到的地方1',
         summary:        '父爱如山,感觉不到只因身在此山中2',
         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: ''
        }
    });
});

测试页面

20151010102926_j6CcOIQQKM

注意事项

  1. 由于手机QQ限制,分享URL必须与页面URL同一域名,否则设置不生效。
  2. 可根据当前页面的客户端环境,判断是否需要WX配置,减少不必要请求。

「五年博客,如果觉得我的文章对您有用,请帮助本站成长」

订阅周报 关注微博

原创文章:微信、手机QQ和QQ空间的web app分享API代码 ,未经许可,禁止转载,©版权所有
原文出处:前端开发博客 (http://caibaojian.com/mqq-share.html)

发表评论

请登录后发表评论:

“微信、手机QQ和QQ空间的web app分享API代码”有4个评论

  1. Happyrgfdg_390

    我需要制作以上二维码 APP 作者请联系我QQ2392687858

    登录回复
  2. 只待一如当初

    有相关API么

    登录回复