通过qq空间qq聊天新浪微博和微信二维码分享平台提供的接口实现把网页中对应的图片、标题、描述的信息参数用javascript获取后传进接口中,实现一键分享

使用到的接口(测试时需要登录,网址和图片必须是公网的,不能localhost):

1.分享到QQ空间接口:https://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=你的网址&sharesource=qzone&title=你的分享标题&pics=你的分享图片&summary=你的分享描述信息

2.分享给QQ好友接口:http://connect.qq.com/widget/shareqq/index.html?url=你的分享网址&sharesource=qzone&title=你的分享标题&pics=你的分享图片地址&summary=你的分享描述&desc=你的分享简述

3.分享到新浪微博接口:http://service.weibo.com/share/share.php?url=你的分享网址&sharesource=weibo&title=你的分享标题&pic=你的分享图片&appkey=你的key,需要在新浪微博开放平台中申请

一键分享代码参考如下:

html
  1. <div class="fl">分享到:</div>
  2. <div onclick="shareTo('qzone')">
  3. <img src="http://zixuephp.net/static/images/qqzoneshare.png" width="30">
  4. </div>
  5. <div onclick="shareTo('qq')">
  6. <img src="http://zixuephp.net/static/images/qqshare.png" width="32">
  7. </div>
  8. <div onclick="shareTo('sina')">
  9. <img src="http://zixuephp.net/static/images/sinaweiboshare.png" width="36">
  10. </div>
  11. <div onclick="shareTo('wechat')">
  12. <img src="http://zixuephp.net/static/images/wechatshare.png" width="32">
  13. </div>
js
  1. function shareTo(stype){
  2. var ftit = '';
  3. var flink = '';
  4. var lk = '';
  5. //获取文章标题
  6. ftit = $('.pctitle').text();
  7. //获取网页中内容的第一张图片
  8. flink = $('.pcdetails img').eq(0).attr('src');
  9. if(typeof flink == 'undefined'){
  10. flink='';
  11. }
  12. //当内容中没有图片时,设置分享图片为网站logo
  13. if(flink == ''){
  14. lk = 'http://'+window.location.host+'/static/images/logo.png';
  15. }
  16. //如果是上传的图片则进行绝对路径拼接
  17. if(flink.indexOf('/uploads/') != -1) {
  18. lk = 'http://'+window.location.host+flink;
  19. }
  20. //百度编辑器自带图片获取
  21. if(flink.indexOf('ueditor') != -1){
  22. lk = flink;
  23. }
  24. //qq空间接口的传参
  25. if(stype=='qzone'){
  26. window.open('https://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url='+document.location.href+'?sharesource=qzone&title='+ftit+'&pics='+lk+'&summary='+document.querySelector('meta[name="description"]').getAttribute('content'));
  27. }
  28. //新浪微博接口的传参
  29. if(stype=='sina'){
  30. window.open('http://service.weibo.com/share/share.php?url='+document.location.href+'?sharesource=weibo&title='+ftit+'&pic='+lk+'&appkey=2706825840');
  31. }
  32. //qq好友接口的传参
  33. if(stype == 'qq'){
  34. window.open('http://connect.qq.com/widget/shareqq/index.html?url='+document.location.href+'?sharesource=qzone&title='+ftit+'&pics='+lk+'&summary='+document.querySelector('meta[name="description"]').getAttribute('content')+'&desc=php自学网,一个web开发交流的网站');
  35. }
  36. //生成二维码给微信扫描分享,php生成,也可以用jquery.qrcode.js插件实现二维码生成
  37. if(stype == 'wechat'){
  38. window.open('http://zixuephp.net/inc/qrcode_img.php?url=http://zixuephp.net/article-1.html');
  39. }
  40. }

使用说明:

这里的如获取文章标题、文章图片、logo图片地址等一些其他信息是按照本站的规则来的,使用时需要修改成自己站点的calss或id选择器来获取。如果调试不成功,可以尝试本站中的分享功能,分享时会打开新窗口,那条链接是最终要分享的,已经拼接好的参数链接,可以复制进行比对参考。

最终分享链接示例:

1.分享到qq空间:

https://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=http://zixuephp.net/article-309.html?sharesource=qzone&title=一键分享到QQ空间、QQ好友、新浪微博、微信代码&pics=http://zixuephp.net/uploads/image/20170810/1502335815192079.png&summary=通过各自平台的开发接口,进行参数指定,进行一键分享javascript代码功能

2.分享到qq好友:

https://connect.qq.com/widget/shareqq/index.html?url=http://zixuephp.net/article-309.html?sharesource=qzone&title=一键分享到QQ空间、QQ好友、新浪微博、微信代码&pics=http://zixuephp.net/uploads/image/20170810/1502335815192079.png&summary=通过各自平台的开发接口,进行参数指定,进行一键分享javascript代码功能&desc=php自学网,一个web开发交流的网站

3.分享到新浪微博:

http://service.weibo.com/share/share.php?url=http://zixuephp.net/article-309.html?sharesource=weibo&title=一键分享到QQ空间、QQ好友、新浪微博、微信代码&pic=http://zixuephp.net/uploads/image/20170810/1502335815192079.png&appkey=2706825840&sudaref=zixuephp.net&display=0&retcode=6102#_loginLayer_1528860698455

一键分享到QQ空间、QQ好友、新浪微博、微信代码的更多相关文章

  1. QQ空间|qq人气号怎么赚钱?

    回报,付出的终极诉求,咱不论情怀. 在<怎么做一个QQ人气号>中,笔者大致提及,打造人气空间的流程,这里简单剖析下QQ人气空间的盈利模式. 关键词:转让,出售,广告,微商,合作,网红,接推 ...

  2. share.js一键分享到微博、QQ空间、QQ好友、微信、腾讯微博、豆瓣、Facebook、Twitter、Linkedin、Google+、点点等

    官网上面 https://github.com/overtrue/share.js非常详细的介绍了share.js他的使用 使用方式有:第一:使用 npm npm install social-sha ...

  3. 手机QQ内置网页,微信内置网页中进行分享到QQ和微信的操作

    微信内的网页分享: API内容详见微信开发文档  https://mp.weixin.qq.com/wiki 这里需要注意的是:调用微信API的时候修改的是微信内网页右上角三个点那里打开后,选择分享之 ...

  4. 乐易贵宾VIP教程:百度贴吧 - QQ部落 - QQ空间 Post实战系列视频课程

    教程挺不错,3套案例的实战,有需要的可以看一下百度贴吧课程目录:1.百度登录抓包分析2.百度登录[代码实现]3.百度验证码登录[代码实现]4.贴吧关注[抓包分析]5.贴吧关注(代码编写)6.贴吧签到[ ...

  5. 模仿QQ空间 网页设计

    目的:1.通过模仿QQ空间,全自主写代码,熟悉网页设计的流程 2.熟练的掌握HTML.CSS.JS的应用 3.将在此过程中遇到的问题及其解决方法记录在此,以便取用. 开始: 一.登陆界面(index. ...

  6. 腾讯QQ空间超分辨率技术TSR

    腾讯QQ空间超分辨率技术TSR:为用户节省3/4流量,处理效果和速度超谷歌RAISR 雷锋网AI科技评论: 随着移动端屏幕分辨率越来越高,甚至像iPhone更有所谓的“视网膜屏”,人们对高清图片的诉求 ...

  7. 树莓派自动播报温湿度到QQ空间、微博

    原文链接 https://aoaoao.me/951.html 这是个比较无聊的应用...灵感来自于一个叫做“古城钟楼”的微博账号,此账号每天都会定点报时,除此之外没有其他任何内容,以此吸引了近50万 ...

  8. JS/java实现QQ空间自动点赞

    使用方法: 1:进入QQ空间 2:复制下面代码 3:按F12或右键审查元素 进入控制台 也就是console 4:粘贴  回车键  喝口水 5:如果嫌慢的话可以 修改这段代码. window.setI ...

  9. SEO那些事:一句代码一键分享网站

    这是很久以前就已经写过的笔记了,有一个习惯,每次遇到一个问题,都会进行百度,然后把解决问题的关键点记录下来,有人问我,为什么更新频率如此之快,大部分都是从前积累的知识点. 其实每天工作所涉及的知识点都 ...

随机推荐

  1. asp.net mvc4 新特性

    摘自:ASP.MVC Web编程 几种模板的解释

  2. Git学习三

    一.准备Github远程仓库 1.github官网注册账户 2.ubuntu端创建SSH Key $ssh-keygen -t rsa -C "youremail@example.com&q ...

  3. springboot整合elasticsearch出错:java.lang.NoClassDefFoundError: org/elasticsearch/plugins/NetworkPlugin

    Caused by: java.lang.NoClassDefFoundError: org/elasticsearch/plugins/NetworkPlugin at java.lang.Clas ...

  4. QT5每日一学(三) QT登陆对话框

    一.使用设计模式创建界面 1.新建Qt Widgets Application,项目名称为login,类名和基类保持MainWindow和QMainWindow不变. 2.完成项目创建后,向项目中添加 ...

  5. 题解报告:hdu 2030 汉字统计

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=2030 Problem Description 统计给定文本文件中汉字的个数. Input 输入文件首先 ...

  6. Java Annontation(注解)详解

    java中经常用到注解(Annontation),索性整理了下关于注解的相关知识点: 一.概念 Annontation是Java5开始引入的新特征,类似与.NET 中的attribute.中文名称一般 ...

  7. 安装SNMP

    http://songknight.blog.51cto.com/2599480/655337

  8. XML To Linq 读取Sharepoint列表中的附件列信息

    通过页面查看,列表附件信息列的内容如下: var x = @"<div class='ExternalClass9936DCD1F074427B891D09CFCEFC2AB6'> ...

  9. WindowForm.计算器

    设计计算器: 外部变量: 数字键按钮: 运算符按钮事件代码: 清零按钮 等号按钮: 思维导图:

  10. 移动web开发填坑(一)

    上周开始接触移动web开发,默默的掉进了很多坑里面.本文主要总结本周遇到的坑以及如何填坑. 1.px与rem换算. 设计稿的宽度一般是640px,而iphone是320px,所以测量设计稿的结果首先要 ...