(转)第三方登录(QQ登录)开发流程详解
近排由于工作的繁忙,已经一个星期没写博文做分享了,接下来我对网站接入第三方登录----QQ登录的实现逻辑做一个详细的讲解。
对于整个流程的详细文档可以到QQ互联官网(http://wiki.connect.qq.com)查看,我这里就简单地进行描述,主要是分析代码的实现过程。
我用的是CI框架(MVC模式),模板引擎用的是smarty。
下图为整个接入流程:
一、准备工作
接入QQ登录前,网站需首先进行申请,获得对应的appid与appkey,以保证后续流程中可正确对网站与用户进行验证与授权。
申请appid和appkey的用途
appid:应用的唯一标识。在OAuth2.0认证过程中,appid的值即为oauth_consumer_key的值。
appkey:appid对应的密钥,访问用户资源时用来验证应用的合法性。在OAuth2.0认证过程中,appkey的值即为oauth_consumer_secret的值。
申请地址:http://connect.qq.com/intro/login/
二、放置“QQ登录按钮”
此步骤自己看文档就OK了。我这里是通过在按钮添加a链接实现跳转登录
V层:index.tpl
1
|
< a href="{$openLoginUrl.connectQQ}" class="icon connect-qq">< span icon-bg2="icon_qq_n"></ span > QQ登录</ a > |
三、使用Authorization_Code获取Access_Token
需要进行两步:
1. 获取Authorization Code;
2. 通过Authorization Code获取Access Token
Step1:获取Authorization Code
请求地址:
PC网站:https://graph.qq.com/oauth2.0/authorize
WAP网站:https://graph.z.qq.com/moc2/authorize
请求方法:
GET
请求参数:
请求参数请包含如下内容:
参数 | 是否必须 | 含义 |
---|---|---|
response_type | 必须 | 授权类型,此值固定为“code”。 |
client_id | 必须 | 申请QQ登录成功后,分配给应用的appid。 |
redirect_uri | 必须 | 成功授权后的回调地址,必须是注册appid时填写的主域名下的地址,建议设置为网站首页或网站的用户中心。注意需要将url进行URLEncode。 |
state | 必须 | client端的状态值。用于第三方应用防止CSRF攻击,成功授权后回调时会原样带回。请务必严格按照流程检查用户与state参数状态的绑定。 |
scope | 可选 | 请求用户授权时向用户显示的可进行授权的列表。
可填写的值是API文档中列出的接口,以及一些动作型的授权(目前仅有:do_like),如果要填写多个接口名称,请用逗号隔开。 例如:scope=get_user_info,list_album,upload_pic,do_like 不传则默认请求对接口get_user_info进行授权。 建议控制授权项的数量,只传入必要的接口名称,因为授权项越多,用户越可能拒绝进行任何授权。 |
display | 可选 | 仅PC网站接入时使用。
用于展示的样式。不传则默认展示为PC下的样式。 如果传入“mobile”,则展示为mobile端下的样式。 |
g_ut | 可选 | 仅WAP网站接入时使用。
QQ登录页面版本(1:wml版本; 2:xhtml版本),默认值为1。 |
返回说明:
1. 如果用户成功登录并授权,则会跳转到指定的回调地址,并在redirect_uri地址后带上Authorization Code和原始的state值。如:
PC网站:http://graph.qq.com/demo/index.jsp?code=9A5F************************06AF&state=test
WAP网站:http://open.z.qq.com/demo/index.jsp?code=9A5F************************06AF&state=test
注意:此code会在10分钟内过期。
2. 如果用户在登录授权过程中取消登录流程,对于PC网站,登录页面直接关闭;对于WAP网站,同样跳转回指定的回调地址,并在redirect_uri地址后带上usercancel参数和原始的state值,其中usercancel值为非零,如:
http://open.z.qq.com/demo/index.jsp?usercancel=1&state=test
下面我们来构造请求地址:
C层:login.php
1
2
3
4
5
6
7
|
public function index() { $redirect = "/user_center/index"; $this->smartyData['connectQQ'] = $this->model->connectQQ->getLoginUrl($this->getOpenLoginRedirectUrl(AccountType::ConnectQQ, $redirect)); $this->renderTemplateView('login/index.tpl'); } |
接下来我对这段代码进行分析
1、$redirect = "/user_center/index";
这是到最后登录成功后进行跳转的url,一般登录成功可以跳转的首页或者个人中心
2、$this->getOpenLoginRedirectUrl(AccountType::ConnectQQ, $redirect);
这里我说明下AccountType::ConnectQQ ,这是个常量而已,我的项目中有微博登录,所以是用一个常量来判断是QQ登录还是微博登录,它们的实现过程基本一致。
我先附上这个方法的代码:
1
2
3
4
5
|
private function getOpenLoginRedirectUrl( $accountType , $redirect ) { $url = "/login/openCallback/?type=$accountType" ; if (! empty ( $redirect )) $url = "$url&redirect=" . rawurlencode( $redirect ); return base_url( $url ); } |
此方法构造的链接是赋给请求参数 redirect_uri 的
3、$this->model->connectQQ->getLoginUrl();
此代码的意思是调用connectQQMolde.php 里的getLoginUrl()方法,其实它返回的就是请求的url地址
M层 connectQQMolde.php:
1
2
3
|
public function getLoginUrl( $redirectUrl ) { return "https://graph.qq.com/oauth2.0/authorize?response_type=code&client_id={$this->appId}&redirect_uri=" . urlencode( $redirectUrl ); } |
此时,就已经构造完了请求的url了,将此url赋给V层的index.tpl的qq图标的a链接那就OK了
1
|
<span style= "color: #ff0000; font-family: 'Microsoft YaHei'; font-size: 16px;" ><span style= "color: #000000;" > </span></span> |
Step2:通过Authorization Code获取Access Token
请求地址:
PC网站:https://graph.qq.com/oauth2.0/token
WAP网站:https://graph.z.qq.com/moc2/token
请求方法:
GET
请求参数:
请求参数请包含如下内容:
参数 | 是否必须 | 含义 |
---|---|---|
grant_type | 必须 | 授权类型,在本步骤中,此值为“authorization_code”。 |
client_id | 必须 | 申请QQ登录成功后,分配给网站的appid。 |
client_secret | 必须 | 申请QQ登录成功后,分配给网站的appkey。 |
code | 必须 | 上一步返回的authorization code。
如果用户成功登录并授权,则会跳转到指定的回调地址,并在URL中带上Authorization Code。 例如,回调地址为www.qq.com/my.php,则跳转到: http://www.qq.com/my.php?code=520DD95263C1CFEA087****** 注意此code会在10分钟内过期。 |
redirect_uri | 必须 | 与上面一步中传入的redirect_uri保持一致。 |
返回说明:
如果成功返回,即可在返回包中获取到Access Token。 如:
access_token=FE04************************CCE2&expires_in=7776000&refresh_token=88E4************************BE14
参数说明 | 描述 |
---|---|
access_token | 授权令牌,Access_Token。 |
expires_in | 该access token的有效期,单位为秒。 |
refresh_token | 在授权自动续期步骤中,获取新的Access_Token时需要提供的参数。 |
然后点击此链接,跳转到QQ登录界面,然后如果登录成功,就跳到 redirect_uri 的参数里 ,我这的参数的
1
|
<span style= "font-family: 'Microsoft YaHei'; font-size: 16px;" > /login/openCallback/?type=11&redirect=/user_center/index</span><br><br><span style= "font-family: 'Microsoft YaHei'; font-size: 16px;" > 此时是跳转到/login.php控制器的openCallback方法。</span><br><br><span style= "font-family: 'Microsoft YaHei'; font-size: 16px;" > 我们来看一下openCallback()方法</span><br> |
1
2
3
4
5
6
7
8
9
10
11
12
13
|
public function openCallback() { $redirect = urldecode( $this ->requestParam( 'redirect' ); $authCode = $this ->requestParam( 'code' ); $result = $this ->model->connectQQ->getAccessToken( $authCode , $this ->getOpenLoginRedirectUrl( $accountType , $redirect )); $accessToken = $result [ 'access_token' ]; $result = array_merge ( $result , $this ->model->connectQQ->getOpenId( $accessToken )); $openId = $result [ 'openid' ]; $loginResult = $this ->model->login->openAccountLogin( $accountType , $openId , $accessToken ); if ( $loginResult ->isOK()) { redirect( empty ( $redirect ) ? '/' : $redirect ); } } |
继续对代码进行分析:
1、$redirect = urldecode($this->requestParam('redirect');
这个是获取参数redirect的值 这里的值为 /user_center/index
2、$authCode = $this->requestParam('code');
这个是获取参数code的值 这里是 authorization code
3、$result = $this->model->connectQQ->getAccessToken($authCode, $this->getOpenLoginRedirectUrl($accountType, $redirect));
$this->getOpenLoginRedirectUrl($accountType, $redirect);
这个和上面介绍的一样,这里取得结果是 /login/openCallback/?type=$accountType&/user_center/index
$this->model->connectQQ->getAccessToken();
这个方法就是调用M层的connectQQModel.php里的getAccessToke()方法,
M层:connectQQModel.php
1
2
3
4
5
6
7
|
public function getAccessToken( $authCode , $redirectUrl ) { $result = $this ->callApi( "https://graph.qq.com/oauth2.0/token?grant_type=authorization_code&client_id={$this->appId}&client_secret={$this->appKey}&code={$authCode}&redirect_uri={$redirectUrl}" ); if (isset( $result [ 'error' ])) { throw new ConnectQQException( $result [ 'error_description' ], intval ( $result [ 'error' ])); } return $result ; } |
1、$result = $this->callApi("https://graph.qq.com/oauth2.0/token?grant_type=authorization_code&client_id={$this->appId}&client_secret={$this->appKey}&code={$authCode}&redirect_uri={$redirectUrl}");
先看$this->callApi()里面的参数,此参数就是通过Authorization Code获取Access Token的请求URL地址
接下来我们看看$this->callApi()方法,此方法是发起一个Api请求,参数$params是参数数组,$method是请求类型;
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
|
private function callApi( $apiUrl , $params = array (), $method = 'GET' ) { $resultText = curl_request_text( $error , $apiUrl , $params , $method ); if (0 === strncmp ( '{' , ltrim( substr ( $resultText , 0, 10)), 1)) { $result = json_decode( $resultText , true); } else if ( strpos ( $resultText , "callback" ) !== false) { $lpos = strpos ( $resultText , "(" ); $rpos = strrpos ( $resultText , ")" ); $errorText = substr ( $resultText , $lpos + 1, $rpos - $lpos -1); $result = json_decode( $errorText , true); } else { parse_str ( $resultText , $result ); } return $result ; } |
$resultText = curl_request_text($error, $apiUrl, $params, $method);
先看一下这个自定义函数curl_requesr_text(),作用是 发起一个 HTTP(S) 请求, 并返回响应文本,至于有关CURL的知识可以点击链接参考我的另一篇博文去了解
http://www.cnblogs.com/it-cen/p/4240663.html,当然也可以百度搜一下,这里我就不过多讲述了;
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
|
/** * 发起一个 HTTP(S) 请求, 并返回响应文本 * * @param array 错误信息: array($errorCode, $errorMessage) * @param string url * @param array 参数数组 * @param string 请求类型 GET|POST * @param int 超时时间 * @param array 扩展的包头信息 * @param array $extOptions * * @return string */ function curl_request_text(& $error , $url , $params = array (), $method = 'GET' , $timeout = 15, $extheaders = null, $extOptions = null) { if (!function_exists( 'curl_init' )) exit ( 'Need to open the curl extension.' ); $method = strtoupper ( $method ); $curl = curl_init(); curl_setopt( $curl , CURLOPT_CONNECTTIMEOUT, $timeout ); curl_setopt( $curl , CURLOPT_TIMEOUT, $timeout ); curl_setopt( $curl , CURLOPT_RETURNTRANSFER, true); curl_setopt( $curl , CURLOPT_SSL_VERIFYPEER, false); curl_setopt( $curl , CURLOPT_SSL_VERIFYHOST, false); curl_setopt( $curl , CURLOPT_HEADER, false); switch ( $method ) { case 'POST' : curl_setopt( $curl , CURLOPT_POST, TRUE); if (! empty ( $params )) { curl_setopt( $curl , CURLOPT_POSTFIELDS, http_build_query( $params )); } break ; case 'DELETE' : case 'GET' : if ( $method == 'DELETE' ) { curl_setopt( $curl , CURLOPT_CUSTOMREQUEST, 'DELETE' ); } if (! empty ( $params )) { $url = $url . ( strpos ( $url , '?' ) ? '&' : '?' ) . ( is_array ( $params ) ? http_build_query( $params ) : $params ); } break ; } curl_setopt( $curl , CURLINFO_HEADER_OUT, TRUE); curl_setopt( $curl , CURLOPT_URL, $url ); if (! empty ( $extheaders )) { curl_setopt( $curl , CURLOPT_HTTPHEADER, ( array ) $extheaders ); } if (! empty ( $extOptions )) { foreach ( $extOptions as $key => $value ) curl_setopt( $curl , $key , $value ); } $response = curl_exec( $curl );<br> curl_close( $curl ); return $response ; } |
再回到$this->getAccessToken()方法,经过判断是否有$result['error'],如果有就代表api返回有错误,则抛出一个异常
if(isset($result['error'])) {
throw new ConnectQQException($result['error_description'], intval($result['error']));
}
return $result;
最终返回的是一个数组给C层 login.php 里openCallback()里所调用的$this->model->connectQQ->getAccessToken();
现在我们回到C层 login.php 里openCallback();
1
2
3
4
5
6
7
8
9
10
11
12
13
|
public function openCallback() { $redirect = urldecode( $this ->requestParam( 'redirect' ); $authCode = $this ->requestParam( 'code' ); $result = $this ->model->connectQQ->getAccessToken( $authCode , $this ->getOpenLoginRedirectUrl( $accountType , $redirect )); $accessToken = $result [ 'access_token' ]; $result = array_merge ( $result , $this ->model->connectQQ->getOpenId( $accessToken )); $openId = $result [ 'openid' ]; $loginResult = $this ->model->login->openAccountLogin( $accountType , $openId , $accessToken ); if ( $loginResult ->isOK()) { redirect( empty ( $redirect ) ? '/' : $redirect ); } } |
4、此时到了 $accessToken = $result['access_token'];
将获得的Access Token赋给$accessToken
5、$result = array_merge($result, $this->model->connectQQ->getOpenId($accessToken));
先看 $this->model->connectQQ->getOpenId($accessToken);这个就是用来获取openId,
先来补充些获取openId的资料:
1 请求地址
PC网站:https://graph.qq.com/oauth2.0/me
WAP网站:https://graph.z.qq.com/moc2/me
2 请求方法
GET
3 请求参数
请求参数请包含如下内容:
参数 | 是否必须 | 含义 |
---|---|---|
access_token | 必须 | 在Step1中获取到的access token。 |
4 返回说明
PC网站接入时,获取到用户OpenID,返回包如下:
1
|
callback( {"client_id":"YOUR_APPID","openid":"YOUR_OPENID"} );
|
WAP网站接入时,返回如下字符串:
client_id=100222222&openid=1704************************878C
openid是此网站上唯一对应用户身份的标识,网站可将此ID进行存储便于用户下次登录时辨识其身份,或将其与用户在网站上的原有账号进行绑定。
接下来我们看M层connectQQModel.php的getOpenId()方法:
M层 connectQQModel.php:
1
2
3
4
5
6
7
|
public function getOpenId( $accessToken ) { if (isset( $result [ 'error' ])) { throw new ConnectQQException( $result [ 'error_description' ], intval ( $result [ 'error' ])); } return $result ; } |
此方法还是调用了callApi()方法 发起Api请求,返回的是一个数组,具体的和上面所有的获取Access Token的流程一样;
继续返回C层 login.php 里openCallback();
1
2
3
4
5
6
7
8
9
10
11
12
13
|
public function openCallback() { $redirect = urldecode( $this ->requestParam( 'redirect' ); $authCode = $this ->requestParam( 'code' ); $result = $this ->model->connectQQ->getAccessToken( $authCode , $this ->getOpenLoginRedirectUrl( $accountType , $redirect )); $accessToken = $result [ 'access_token' ]; $result = array_merge ( $result , $this ->model->connectQQ->getOpenId( $accessToken )); $openId = $result [ 'openid' ]; $loginResult = $this ->model->login->openAccountLogin( $accountType , $openId , $accessToken ); if ( $loginResult ->isOK()) { redirect( empty ( $redirect ) ? '/' : $redirect ); } } |
然后就是获取到了$openId;
openID的作用:openid是此网站上唯一对应用户身份的标识,网站可将此ID进行存储便于用户下次登录时辨识其身份,或将其与用户在网站上的原有账号进行绑定。
接下来就是$loginResult = $this->model->login->openAccountLogin($accountType, $openId, $accessToken); 也就是通过$openId和$accessToken查询下用户表是否有对应的用户,如果没有就进行绑定啊或者直接存储啊,也就是一系列登录绑定的逻辑了,这里我就不多说了,大家都应该会。
好了,第三方登录--QQ登录的整个逻辑处理已经详细地讲解完毕,希望大家能通过此博文能顺利给自己网站接入第三方登录。文章中的代码都是我们项目中用的代码,基本不会有问题。希望大家多多支持。
(转)第三方登录(QQ登录)开发流程详解的更多相关文章
- C++的性能C#的产能?! - .Net Native 系列《二》:.NET Native开发流程详解
之前一文<c++的性能, c#的产能?!鱼和熊掌可以兼得,.NET NATIVE初窥> 获得很多朋友支持和鼓励,也更让我坚定做这项技术的推广者,希望能让更多的朋友了解这项技术,于是先从官方 ...
- 第三方登录(QQ登录)开发流程详解
原文:http://www.cnblogs.com/it-cen/p/4338202.html 近排由于工作的繁忙,已经一个星期没写博文做分享了,接下来我对网站接入第三方登录----QQ登录的实现逻辑 ...
- PHP cURL应用实现模拟登录与采集使用方法详解
对于做过数据采集的人来说,cURL一定不会陌生.虽然在PHP中有file_get_contents函数可以获取远程链接的数据,但是它的可控制性太差了,对于各种复杂情况的采集情景,file_get_co ...
- 迅为4412开发板Linux驱动教程——总线_设备_驱动注册流程详解
本文转自:http://www.topeetboard.com 视频下载地址: 驱动注册:http://pan.baidu.com/s/1i34HcDB 设备注册:http://pan.baidu.c ...
- PHP cURL实现模拟登录与采集使用方法详解教程
来源:http://www.zjmainstay.cn/php-curl 本文将通过案例,整合浏览器工具与PHP程序,教你如何让数据 唾手可得 . 对于做过数据采集的人来说,cURL一定不会陌生.虽然 ...
- FFmpeg开发笔记(五):ffmpeg解码的基本流程详解(ffmpeg3新解码api)
若该文为原创文章,未经允许不得转载原博主博客地址:https://blog.csdn.net/qq21497936原博主博客导航:https://blog.csdn.net/qq21497936/ar ...
- Cocos2d-x 3.X手游开发实例详解
Cocos2d-x 3.X手游开发实例详解(最新最简Cocos2d-x手机游戏开发学习方法,以热门游戏2048.卡牌为例,完整再现手游的开发过程,实例丰富,代码完备,Cocos2d-x作者之一林顺和泰 ...
- Linux启动流程详解【转载】
在BIOS阶段,计算机的行为基本上被写死了,可以做的事情并不多:一般就是通电.BIOS.主引导记录.操作系统这四步.所以我们一般认为加载内核是linux启动流程的第一步. 第一步.加载内核 操作系统接 ...
- 《iOS 7 应用开发实战详解》
<iOS 7 应用开发实战详解> 基本信息 作者: 朱元波 管蕾 出版社:人民邮电出版社 ISBN:9787115343697 上架时间:2014-4-25 出版日期:2014 年5 ...
随机推荐
- linq 实现动态 orderby
class Pet { public string Name{get;set;} public int Age{get;set;} } void Main() { Pet[] pets = { }, ...
- [转] How to generate multiple outputs from single T4 template (T4 输出多个文件)
本文转自:http://www.olegsych.com/2008/03/how-to-generate-multiple-outputs-from-single-t4-template/ Updat ...
- lable自动适配大小
#import "ViewController.h" @interface ViewController () @end @implementation ViewControlle ...
- 使用ObjectAnimator开发打开、关闭书本动画
动画效果 动画效果-分享链接 (想做成gif图的,尝试各种工具无果) ObjectAnimator简单介绍及实现思路 ObjectAnimator是从api level 11 (Android3.0x ...
- Fragment禁止预加载
项目中经常会用到ViewPager+Fragment组合,然而,有一个很让人头疼的问题就是,去加载数据的时候由于ViewPager的内部机制所限制,所以它会默认至少预加载一个. 1.既然说是ViewP ...
- 畅捷通T+12.2升级时发生的错误及处理方法图解
前言:最近处理一个客户单位的财务数据,需要从2004年的U820版本的数据升级到畅捷通T+12.2版本.经查,该升级先要将原数据升级到T6,再从T6升级到畅捷通T+12.2版本.U820升级到T6很简 ...
- java实现链栈
package linkstack; /** * Created by Administrator on 2019/4/18. */ public class LinkStack { private ...
- head语法
head 与 tail 就像它的名字一样的浅显易懂,它是用来显示开头或结尾某个数量的文字区块,head 用来显示档案的开头至标准输出中,而 tail 想当然尔就是看档案的结尾.1.命令格式:head ...
- MapGIS DataStore
http://www.mapgis.com/index.php/index-show-tid-206.html 异构数据同时加载 DCServer感觉已经集成到 IGServer中了. >> ...
- P4396 [AHOI2013]作业
题目链接 luogu4396 思路 唯有水题暖人心 咕了4天,今天跟着std对拍才做出来不得不说题解真的水的一批 先离散化一下 第一问差分询问,权值树状数组套一套就好了 \(nlog_{n}\) 第二 ...