首先,登录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. requireJS的使用_API-1

    requireJS的使用_API(1) 之前有介绍过requireJS(模块化开发),可以看看 ,但是不详细,所以今天参考官网来详细介绍一下: 1.加载js文件: RequireJS的目标是鼓励代码的 ...

  2. sk_buff整理笔记(两、操作函数)

    承接上一:sk_buff 整理笔记(一.数据结构)这一篇要讲的是内核为sk_buff结构提供的一些操作函数. 第一.首先要讲的是sk_buff中的四大指针: 四大指针各自是:head.data.tai ...

  3. angularjs从零开始(一)

    简介   AngularJS是为了克服HTML在构建应用上的不足而设计的.HTML是一门很好的为静态文本展示设计的声明式语言,但要构建WEB应用的话它就显得乏力了.所以我做了一些工作(你也可以觉得是小 ...

  4. 【C语言的日常实践(八)】弦

    串数据类型是一个重要的,但C有没有明确的语言字符串数据类型.头文件string.h它包括大多数字符串处理函数. 故,有操作的串.通常包括string.h头文件. 1.字符串的长度:对字符串进行的操作中 ...

  5. STUN协议简介

    STUN简要 STUN(Simple Traversal of UDP over NATs,NAT 的UDP简单穿越)是一种网络协议.它同意位于NAT(或多重NAT)后的client找出自己的公网地址 ...

  6. HDU - 5008 Boring String Problem (后缀数组+二分法+RMQ)

    Problem Description In this problem, you are given a string s and q queries. For each query, you sho ...

  7. awk学习总结(两) How awk works and awk CMD in a file

    测试文件names Tom Savage 100 Molly Lee 200 John Doe 300 $0 代表file的整行; $1,第一列;$2,第二列...... $ awk '/Tom/{p ...

  8. hdu To and Fro

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1200 代码: #include <stdio.h> #include <string ...

  9. Corel VideoStudio Pro X7(会声会影)

    今天了解一天的视频剪辑方面的知识,自己也动手做了一个. 好啦!下面给大家一些建议: 剪辑软件选择: 1.易学易用.容易上手.模板丰富:会声会影:(需要安装包的可以留言和私信我)2.功能齐全.占用资源少 ...

  10. 读取上传的CSV为DataTable

    csv导入文件会把每列的数据用英文逗号分割开来,如果遇到某列中包含英文逗号,则会把该列用英文双引号进行包装. 如果csv文件中某列的数据本身包含英文逗号,应该使用读取字符串的方式进行解析数据,如csv ...