废话少说,咱们直奔主题!
对于整个流程的详细文档可以到QQ互联官网([http://wiki.connect.qq.com])查看,我这里就简单地进行描述,主要是分析代码的实现过程。
本次流程是基于CI框架下实现的。
下图为整个接入流程:
一、准备工作
接入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登录按钮”
V层:index.tpl
<a href="{$openLoginUrl.connectQQ}" class="icon connect-qq"><span icon-bg2="icon_qq_n"></span> QQ登录</a>
三、使用Authorization_Code获取Access_Token
- 获取Authorization Code;
- 通过Authorization Code获取Access Token
Step1:获取Authorization Code
请求地址:
PC网站:https://graph.qq.com/oauth2.0/authorize
WAP网站:https://graph.z.qq.com/moc2/authorize
请求方法:
GET
请求参数:
请求参数请包含如下内容:
返回说明:
- 如果用户成功登录并授权,则会跳转到指定的回调地址,并在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分钟内过期。
- 如果用户在登录授权过程中取消登录流程,对于PC网站,登录页面直接关闭;对于WAP网站,同样跳转回指定的回调地址,并在redirect_uri地址后带上usercancel参数和原始的state值,其中usercancel值为非零,如:
http://open.z.qq.com/demo/index.jsp?usercancel=1&state=test
下面我们来构造请求地址:
C层:login.php
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登录还是微博登录,它们的实现过程基本一致。
我先附上这个方法的代码:
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:
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了
<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
请求参数:
请求参数请包含如下内容:
返回说明:
如果成功返回,即可在返回包中获取到Access Token。 如:
access_token=FE04************************CCE2&expires_in=7776000&refresh_token=88E4************************BE14
然后点击此链接,跳转到QQ登录界面,然后如果登录成功,就跳到 redirect_uri 的参数里 ,我这的参数的
<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>
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
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是请求类型;
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=curlrequesttext( error, apiUrl, params, $method);
先看一下这个自定义函数curl_requesr_text(),作用是 发起一个 HTTP(S) 请求, 并返回响应文本,至于有关CURL的知识可以点击链接参考我的另一篇博文去了解
http://www.cnblogs.com/it-cen/p/4240663.html,当然也可以百度搜一下,这里我就不过多讲述了;
/**
* 发起一个 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′])) thrownewConnectQQException($result[′errordescription′],intval($result[‘error′])); return
result;
最终返回的是一个数组给C层 login.php 里openCallback()里所调用的$this->model->connectQQ->getAccessToken();
现在我们回到C层 login.php 里openCallback();
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=arraymerge( 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 请求参数
请求参数请包含如下内容:
4 返回说明
PC网站接入时,获取到用户OpenID,返回包如下:
WAP网站接入时,返回如下字符串:
client_id=100222222&openid=1704************************878C
openid是此网站上唯一对应用户身份的标识,网站可将此ID进行存储便于用户下次登录时辨识其身份,或将其与用户在网站上的原有账号进行绑定。
接下来我们看M层connectQQModel.php的getOpenId()方法:
M层 connectQQModel.php:
public function getOpenId($accessToken) {
$result = $this->callApi("https://graph.qq.com/oauth2.0/me?access_token={$accessToken}");
if(isset($result['error'])) {
throw new ConnectQQException($result['error_description'], intval($result['error']));
}
return $result;
}
此方法还是调用了callApi()方法 发起Api请求,返回的是一个数组,具体的和上面所有的获取Access Token的流程一样;
继续返回C层 login.php 里openCallback();
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查询下用户表是否有对应的用户,如果没有就进行绑定啊或者直接存储啊,也就是一系列登录绑定的逻辑了,这里我就不多说了,大家都应该会。
如文章中有解释错的地方,欢迎指出。互相学习,共同进步!