首先，登录QQ互联：http://connect.qq.com/intro/login  ，注册成为开发者

选择申请加入，并创建你的应用。

创建成功后可以获取到appid和appkey

在网站的主页引入下面代码

<script type="text/javascript" src="http://qzonestyle.gtimg.cn/qzone/openapi/qc_loader.js"   　data-appid="APPID" data-redirecturi="REDIRECTURI" charset="utf-8">  </script>

其中APPID就是你应用的appid，REDIRECTURI则是你注册应用时填写的回调地址

QQ提供了多种快速登录的方式，这里只说JS SDK的方式

在确定上面js引入成功后，在页面合适位置放置下面代码

<span id="qqLoginBtn" ></span>

<script type="text/javascript">
QC.Login({
btnId : "qqLoginBtn",//插入按钮的html标签id
size : "B_M",//按钮尺寸
scope : "get_user_info",//展示授权，全部可用授权可填 all
display : "pc"//应用场景，可选
});
</script>

此时可以弹出登录窗，如果要获取用户信息，则需要一个回调页面，这里使用的是官方的demo，QQ_callback.html,源码如下

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title> QQConnect JSDK - redirectURI </title>
<style type="text/css">
html, body{font-size:14px; line-height:180%;}
</style>

</head>
<body>

<div>
<h3>数据传输中，请稍后...</h3>
</div>

</body>
</html>

<script type="text/javascript" src="http://qzonestyle.gtimg.cn/qzone/openapi/qc_loader.js" charset="utf-8" data-callback="true"></script>

在主页写入接受回调的js代码：

<script type="text/javascript">
//从页面收集OpenAPI必要的参数。get_user_info不需要输入参数，因此paras中没有参数
var paras = {};

//用JS SDK调用OpenAPI
QC.api("get_user_info", paras)
//指定接口访问成功的接收函数，s为成功返回Response对象
.success(function(s){
console.info(s);
console.info(s.data);
//成功回调，通过s.data获取OpenAPI的返回数据
alert("获取用户信息成功！当前用户昵称为："+s.data.nickname);
})
//指定接口访问失败的接收函数，f为失败返回Response对象
.error(function(f){
//失败回调
alert("获取用户信息失败！");
})
//指定接口完成请求后的接收函数，c为完成请求返回Response对象
.complete(function(c){
QC.Login.getMe(function(openId, accessToken){
alert("当前登录用户的openId为："+openId+ " accessToken为："+accessToken);
});
//完成请求回调
alert("获取用户信息完成！");

});
</script>

腾讯现在不提供用户的qq号码，所以只好根据用户的openid来标示用户的唯一性。

以上文章内容经过上线项目测试正常。可以获取到用户的昵称等信息，以及openid

QQ三方登录步骤详解的更多相关文章

  1. sql server 2008 数据库管理系统使用SQL语句创建登录用户步骤详解

    介绍了sql server 2008 数据库管理系统使用SQL语句创建登录用户步骤详解 --服务器角色: --固定服务器角色具有一组固定的权限,并且适用于整个服务器范围. 它们专门用于管理 SQL S ...

  2. Linux centos7环境下安装MySQL的步骤详解

    Linux centos7环境下安装MySQL的步骤详解 安装MySQL mysql 有两个跟windows不同的地方 1).my.ini 保存到/etc/my.ini 2).用户权限,单独用户执行 ...

  3. 安装Cloudera manager agent步骤详解

    安装Cloudera manager agent步骤详解 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 本篇博客主要是针对:https://www.cnblogs.com/yinz ...

  4. 安装Cloudera manager Server步骤详解

    安装Cloudera manager Server步骤详解 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 本篇博客主要是针对:https://www.cnblogs.com/yin ...

  5. C#自制Web 服务器开发：mysql免安装版配置步骤详解分享

    mysql免安装版配置步骤详解分享 1.准备工作 下载mysql的最新免安装版本mysql-noinstall-5.1.53-win32.zip,解压缩到相关目录,如:d:\ mysql-noinst ...

  6. Ubuntukylin-14.04-desktop（ 不带分区）安装步骤详解

    不多说,直接上干货! Ubuntukylin-14.04-desktop(带分区)安装步骤详解 Ubuntu14.04安装之后的一些配置 Ubuntukylin-14.04-desktop( 不带分区 ...

  7. Ubuntukylin-14.04-desktop（带分区）安装步骤详解

    不多说,直接上干货! 成功! Ubuntukylin-14.04-desktop( 不带分区)安装步骤详解 Ubuntukylin-14.04-desktop( 不带分区)安装步骤详解 Ubuntu1 ...

  8. Ubuntu11.10 带图形安装步骤详解

    不多说,直接上干货! 成功!  关于Ubuntu的网络设置.静态IP设置,见 Ubuntukylin-14.04-desktop( 不带分区)安装步骤详解 Ubuntukylin-14.04-desk ...

  9. ASP.NET连接Oracle数据库的步骤详解(转)

    ASP.NET连接Oracle数据库的步骤详解   本文我们主要介绍了ASP.NET连接Oracle数据库的步骤及每个步骤需要进行的设置,希望能够对您有所帮助.   在用ASP.NET开发应用程序时, ...

随机推荐

  1. NPOI以及在ASP.NET MVC中的使用

    NPOI以及在ASP.NET MVC中的使用 1.前言 相信大家在工作中经常要遇到一些导入导出Execl操作.学习贵在分享,分享使人快乐,园子里的前辈已经有很多好的文章,鄙人也是能力有限,在这里把这些 ...

  2. java多线程（同步和死锁，生产者和消费者问题）

    首先我们来看看同步与死锁: 所谓死锁.这是A有banana,B有apple. A至B说:你把apple对我来说,,我会banana给你. B至A说:你把banana对我来说,,我会apple给你. 可 ...

  3. UBUNTU如何改变mysql默认文件夹数据文件夹

    停止mysql维修 * sudo /etc/init.d/mysql stop 原始文件夹的副本 * cp -r /var/lib/mysql /home/yourname/somewhere 改动权 ...

  4. VAXVOIP SDK Licensekey

    Insert the following key to the SDK with SetLicenseKey call: VAXVOIP.COM-191P238P55P253P97P229P51P76 ...

  5. int有符号和无符号类型内存 -- C

    /* int 有符号 0xffffffff == -1 0xfffffffe == -2 最小 0x80000000 == -21 4748 3648 最大 0x7fffffff == 21 4748 ...

  6. TCP流量控制协议

    说明: 本文仅供学习交流.转载请标明出处,欢迎转载! 本文是下面文献相关内容的总结 [1] <TCP/IP具体解释 卷1:协议> [2] <TCP/IP协议族 第4版> [3] ...

  7. 接收终端Request.InputStream阅读

    接收终端Request.InputStream阅读请求页面参数,最后字符串. byte[] byts = new byte[HttpContext.Current.Request.InputStrea ...

  8. 【高德地图API】从零开始学高德JS API（三）覆盖物——标注|折线|多边形|信息窗口|聚合marker|麻点图|图片覆盖物

    原文:[高德地图API]从零开始学高德JS API(三)覆盖物——标注|折线|多边形|信息窗口|聚合marker|麻点图|图片覆盖物 摘要:覆盖物,是一张地图的灵魂.有覆盖物的地图,才是完整的地图.在 ...

  9. 管理员控制Windows Service

    C# 以管理员方式启动Winform,进而使用管理员控制Windows Service   问题起因: 1,) 问题自动分析Windows服务在正常运行时,确实会存在程序及人为原因导致该服务停止.为了 ...

  10. 通过EA导入数据库存在表结构并生成文档

    通过EA导入数据库存在表结构并生成文档   慕课网,程序员升职加薪神器,点击免费学习 目录[-] 导入数据源,表结构 生成表结构的文档 Enterprise Architect 是超级强大项目管理功能 ...