QQ登录将用户信息存储在cookie中,命名为__qc__k ,请不要占用

__qc__k :


1) :: 在页面顶部引入JS SDK库:

将“js?”后面的appid参数(示例代码中的:100229030)替换成您自己的appid:
示例代码:
<script type="text/javascript" src="http://qzonestyle.gtimg.cn/qzone/openapi/qc_loader.js" data-appid="100229030" charset="utf-8"></script>
 

2) :: HTML页面中粘贴如下代码,插入QQ登录按钮

点击下述登录按钮进行体验:
 
示例代码:

<span id="qqLoginBtn"></span>
<script type="text/javascript">
QC.Login({
btnId:"qqLoginBtn" //插入按钮的节点id
});
</script>


3) :: 调用openapi:

3.1) ※ 调用openapi获取当前登录用户基本信息:
发送参数:

返回数据:

返回 json格式的用户信息;请指定接口访问成功的接收参数,如demo中的success(function(s)),即指定将成功返回值传递到s中; 其中所有API的返回均为response对象,包括:data, code, status等属性,分别表示数据、返回码、请求的响应状态

示例代码:

<script type="text/javascript">
var paras = {};

QC.api("get_user_info", paras)
.success(function(s){//成功回调
alert("获取用户信息成功!当前用户昵称为:"+s.data.nickname);
})
.error(function(f){//失败回调
alert("获取用户信息失败!");
})
.complete(function(c){//完成请求回调
alert("获取用户信息完成!");
});
</script>

 

3.2) ※ 调用openapi发分享 [相同url参数只能分享一次]:
发送参数:

{
images:"http://y.photo.qq.com/img?s=OnbP8BwOF&l=y.jpg",
title:"#QQ互联JSSDK测试#我是标题啊标题",
url:"http://connect.qq.com/",
comment:"我是评论:转发原因",
summary:"我是摘要:内容说明"
}

返回数据:

 
示例代码:

<script type="text/javascript">
//从页面收集openapi必要的参数
var paras = {
images:"http://y.photo.qq.com/img?s=OnbP8BwOF&l=y.jpg",
title:"#QQ互联JSSDK测试#我是标题啊标题",
url:"http://connect.qq.com/",
comment:"我是评论:转发原因",
summary:"我是摘要:内容说明"
};

//用jssdk调用openapi
QC.api("add_share", paras)
.success(function(s){//请自行改写成功回调
alert("分享成功,请到空间内查看!");
})
.error(function(f){//请自行改写失败回调
alert("分享失败!");
})
.complete(function(c){//请自行改写完成请求回调
alert("分享完成!");
});
</script>

 

3.3) ※ 调用openapi发微博:
发送参数:

{content : "#QQ互联JSSDK测试#曾经沧海难为水,除却巫山不是云。"}
			

返回数据:

 
示例代码:

<script type="text/javascript">
var paras = {content : "#QQ互联JSSDK测试#曾经沧海难为水,除却巫山不是云。"};

QC.api("add_t", paras)
.success(function(s){//成功回调
alert("发送微博成功,请到腾讯微博内查看!");
})
.error(function(f){//失败回调
alert("发送微博失败!");
})
.complete(function(c){//完成请求回调
alert("发送微博完成!");
});
</script>

 

3) :: 获取openId 与 accessToken

用户通过“QQ登录”登录成功后,可以调用示例代码将获取到openId与accessToken

  • openid是用户身份的唯一标识,请保存在本地,以便用户下次登录时可对应到其之前的身份信息,不需要重新授权。
  • accessToken:表示当前用户在此网站/应用的登录状态与授权信息,也请保存在本地。
示例代码:

<script type="text/javascript">
if(QC.Login.check()){//如果已登录
QC.Login.getMe(function(openId, accessToken){
alert(["当前登录用户的", "openId为:"+openId, "accessToken为:"+accessToken].join("\n"));
});
//这里可以调用自己的保存接口
//...
}
</script>

转自:本页面用来演示如何通过JS SDK,创建完整的QQ登录流程,并调用openapi接口

本页面用来演示如何通过JS SDK,创建完整的QQ登录流程,并调用openapi接口的更多相关文章

  1. yii2 如何在页面底部加载css和js

    作者:白狼 出处:www.manks.top/article/yii2_load_js_css_in_end 本文版权归作者,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接 ...

  2. 文件上传漏洞演示脚本之js验证

    文件上传漏洞演示脚本之js验证 0 0       716   关于文件上传漏洞,想必玩web安全的同学们都有接触,之前本站也发布过一篇文章介绍文件上传漏洞的各种绕过方法,但是只是有文档却没有演示代码 ...

  3. 如何在一个网站或者一个页面,去书写你的JS代码

    // JavaScript Document //如何在一个网站或者一个页面,去书写你的JS代码: //1.js的分层(功能) : jquery(tools) 组件(ui) 应用(app), mvc( ...

  4. 页面跳转后样式丢失js失效

    2 页面跳转后样式丢失js失效 问题描述: 用ajax跳转的时候,从a.html跳转到b.html后,b.html的css以及js都失效了. 解决办法: 将当前页面需要用到的css以及js放在< ...

  5. 使用 v-cloak 防止页面加载时出现 vue.js 的变量名

    知识点:使用 v-cloak 防止页面加载时出现 vue.js 的变量名 场景:在使用vue语法,实现下拉框功能时,展示数据列表之前,出现对应的 vuejs 变量名 代码: var vm = new ...

  6. 爬虫实战:汽车之家配置页面 破解伪元素和混淆JS

    本篇介绍如何破解汽车之家配置页面的伪元素和混淆的JS. ** 温馨提示:如需转载本文,请注明内容出处.** 本文链接:https://www.cnblogs.com/grom/p/9242156.ht ...

  7. 当页面提交时,执行相关JS函数检查输入是否合法

    当页面提交时,执行相关JS函数检查输入是否合法 关键代码 <form action="tj.php" method="post" onSubmit=&qu ...

  8. 微信 JS SDK 的 chooseImage 接口在部分安卓机上容易造成页面刷新

    该问题的症状是,当调用 chooseImage 接口并选择拍照,选择照片确定之后,然后从相机返回后,当前web页面就刷新了一次,导致拍照的图片无法选择上传:但是如果直接从相册中选择图片,则不会出现这个 ...

  9. Bounce.js – 快速创建漂亮的 CSS3 动画效果

    Bounce.js 是一个用于制作漂亮的 CSS3 关键帧动画的 JavaScript 库,使用其特有的方式生成的动画效果.只需添加一个组件,选择预设,然后你就可以得到一个短网址或者导出为 CSS 代 ...

随机推荐

  1. 测开之路一百二十四:flask之MVC响应过程

    MVC流程 原本的请求响应 结构: 视图: from flask import Flask, render_template app = Flask(__name__) @app.route(&quo ...

  2. POI读取指定Excel中行与列的数据

    import org.apache.poi.xssf.usermodel.XSSFCell; import org.apache.poi.xssf.usermodel.XSSFRow; import ...

  3. LeetCode——142 设计链表2

    题目 代码 class Solution { public: ListNode *detectCycle(ListNode *head) { ListNode *fast = head, *slow ...

  4. Java -Tips

    1. /* xxxx */表示多行注释,双斜杠开始表示单行注释.多行注释的快捷键: 先选中多行代码,然后按下ctrl+/就可以把选中的多行代码给注释掉.

  5. SQLServer中的Merge使用

    Merge DML 作用: 数据同步 数据转换 基于源表对目标表做Insert,Update,Delete操作 Merge关键字的一些限制 使用Merge关键字只能更新一个表 源表中不能有重复的记录 ...

  6. Node.js实战10:“流”是Node.js最强大的功能之一。

    流是Nodejs的高级应用,掌握流的使用,才能真正胜任NodeJS开发. Nodejs中,流是基于事件的API,用于管理和处理数据,而且效率很好! 什么是流? 流是一个抽象接口,Node 中有很多对象 ...

  7. Python所有转义字符总汇

    转义字符就是让程序按照已经设置好的字符输出,不然程序当成其他的输出了,下面总结所有python转义字符 \\ 反斜杠符号\' 单引号\" 双引号\a 响铃\b 退格(Backspace)\e ...

  8. SQL SERVER 数据库跨服务器备份

    原文:https://www.cnblogs.com/jaday/p/6088200.html 需求介绍:每天备份线上正式库并且把备份文件复制到测试服务器,测试服务器自动把数据库备份文件还原. 方案介 ...

  9. 剑指offer--字符串

    C/C++中每个字符串都以字符'\0'作为结尾,这样我们就可以很方便的找到字符串最后的尾部.由于这个特点,每个字符串中都有一个额外字符的开销,稍不留神就会造成字符串的越界. 为了节省内存,C/C++把 ...

  10. 即时通讯(II)

    Socket 连接Demo Socket客户端代码 #import "ViewController.h" //0.导入头文件 #include <netinet/in.h&g ...