Web网页如何实现QQ好友，QQ空间，微博分享

最新推荐文章于 2023-01-16 10:09:44 发布

小马同学

最新推荐文章于 2023-01-16 10:09:44 发布

阅读量4.2k

点赞数 4

分类专栏：前端

本文链接：https://blog.csdn.net/qq_40205116/article/details/102906710

版权

前端专栏收录该内容

27 篇文章 8 订阅

订阅专栏

前段时间写了一个个人博客项目，其中博客想做一下可以一键分享给好友，这里做一下整理。
QQ好友，QQ空间，微博分享实现起来都是差不多的，就是请求地址需要改一下，参数基本都是一样的。

分享参数信息

/*获取当前网页链接，分享的链接*/
var url = window.location.href;
var desc = "分享描述";
var title = "分享标题";
var summary = "分享摘要";
var pics = "图片";

QQ好友分享

请求地址：http://connect.qq.com/widget/shareqq/index.html?url=你的分享网址&sharesource=qzone&title=你的分享标题&pics=你的分享图片地址&summary=你的分享描述&desc=你的分享简述

先设定一个标签点击事件

<P onclick="qqShare()">qq好友分享</P>

点击方法（参数在前面给出来了）

function qqShare() {
    var urlPath = "https://connect.qq.com/widget/shareqq/index.html?url="+ encodeURI(url) +
        "&desc=" + desc +
        "&title=" + title +
        "&summary=" + summary +
        "&pics=" + pics;
    window.open (urlPath)
}

QQ空间分享

请求地址：https://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=你的分享网址&sharesource=qzone&title=你的分享标题&pics=你的分享图片地址&summary=你的分享描述&desc=你的分享简述

先设定一个标签点击事件

<P onclick="qqQzone()">qq空间分享</P>

点击方法（参数和前面的一样）

这里需要注意的一点是请求地址url前面的方法是encodeURIComponent，而不是encodeURI，encodeURI也可以用，当时如果请求地址后面跟的有参数的话，就会出问题，所以建议使用encodeURIComponent

function qqQzone() {
    var urlPath = "http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url="+ encodeURIComponent(url) +
        "&desc=" + desc +
        "&title=" + title +
        "&summary=" + summary +
        "&pics=" + pics;
    window.open (urlPath)
}

微博分享

请求地址：http://service.weibo.com/share/share.php ?url=你的分享网址&sharesource=qzone&title=你的分享标题&pics=你的分享图片地址&summary=你的分享描述&desc=你的分享简述

先设定一个标签点击事件

<P onclick="weibo()">微博分享</P>

点击方法（参数和前面的一样）

微博分享基本和QQ好友分享一样，就是分享链接地址不一样，需要改一下

function weibo() {
    var urlPath = "http://service.weibo.com/share/share.php?url="+ encodeURI(url) +
        "&desc=" + desc +
        "&title=" + title +
        "&summary=" + summary +
        "&pics=" + pics;
    window.open (urlPath)
}