当前位置：文江博客话题详情

怎样定义手机端的微信和QQ浏览器分享出去的图片和文案？

发布于 2022-09-04 05:21:13 字数 168 浏览 27 评论 0

如题，需求就是用户手动使用浏览器自带分享时的文案和图片能自定义。微信能用自家jdk解决，却没找到QQ浏览器怎样弄。不过看到一些直接调用浏览器自带分享功能的例子，如：share.js，可惜并不是我需要的效果。

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

无可置疑 2022-09-11 05:21:13

腾讯移动web开发平台提供较全面的解决方案，看这里。

在你的项目加上

http://qzonestyle.gtimg.cn/qz...

在页面加上分享设置代码。

/**
 * 定制接口
 * @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微信权限验证配置信息，具体例子如：

//传递的url必须是调用JS接口页面的完整URL
fetch('http://你的服务器/wx/api?url=' + window.location.href.split("#")[0])
    .then(res => res.json)
    .then(json => {
        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: json.appId, // 公众号的唯一标识
                timestamp: json.timestamp, // 生成签名的时间戳
                nonceStr: json.nonceStr, // 生成签名的随机串
                signature: json.signature // 签名
            }
        });
    })

签名算法及细节参考这里。

说两件需要注意的事：