`
flex_莫冲
  • 浏览: 1074088 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

facebook和新浪微博的oauth2.0登錄

    博客分类:
  • web
阅读更多
用facebook和新浪微博做oauth登入

facebook
參考資料
https://developers.facebook.com/docs/javascript/quickstart/v2.1
<!DOCTYPE html>
<html>
	<head>
		<title>Facebook Login JavaScript Example</title>
		<meta charset="UTF-8">
	</head>
	<body>
		<script>
			// This is called with the results from from FB.getLoginStatus().
			function statusChangeCallback(response) {
				console.log('statusChangeCallback');
				console.log(response);
				// The response object is returned with a status field that lets the
				// app know the current login status of the person.
				// Full docs on the response object can be found in the documentation
				// for FB.getLoginStatus().
				if (response.status === 'connected') {
					// Logged into your app and Facebook.
					testAPI();
				} else if (response.status === 'not_authorized') {
					// The person is logged into Facebook, but not your app.
					document.getElementById('status').innerHTML = 'Please log ' + 'into this app.';
				} else {
					// The person is not logged into Facebook, so we're not sure if
					// they are logged into this app or not.
					document.getElementById('status').innerHTML = 'Please log ' + 'into Facebook.';
				}
			}

			// This function is called when someone finishes with the Login
			// Button.  See the onlogin handler attached to it in the sample
			// code below.
			function checkLoginState() {
				FB.getLoginStatus(function(response) {
					statusChangeCallback(response);
				});
			}


			window.fbAsyncInit = function() {
				FB.init({
					appId : 'xxxx',
					cookie : true, // enable cookies to allow the server to access
					// the session
					xfbml : true, // parse social plugins on this page
					version : 'v2.1' // use version 2.1
				});

				// Now that we've initialized the JavaScript SDK, we call
				// FB.getLoginStatus().  This function gets the state of the
				// person visiting this page and can return one of three states to
				// the callback you provide.  They can be:
				//
				// 1. Logged into your app ('connected')
				// 2. Logged into Facebook, but not your app ('not_authorized')
				// 3. Not logged into Facebook and can't tell if they are logged into
				//    your app or not.
				//
				// These three cases are handled in the callback function.

				FB.getLoginStatus(function(response) {
					statusChangeCallback(response);
				});

			};

			// Load the SDK asynchronously
			( function(d, s, id) {
					var js, fjs = d.getElementsByTagName(s)[0];
					if (d.getElementById(id))
						return;
					js = d.createElement(s);
					js.id = id;
					js.src = "//connect.facebook.net/en_US/sdk.js";
					fjs.parentNode.insertBefore(js, fjs);
				}(document, 'script', 'facebook-jssdk'));

			// Here we run a very simple test of the Graph API after login is
			// successful.  See statusChangeCallback() for when this call is made.
			function testAPI() {
				console.log('Welcome!  Fetching your information.... ');
				FB.api('/me', function(response) {
					console.log('Successful login for: ' + response.name);
					document.getElementById('status').innerHTML = 'Thanks for logging in, ' + response.name + '!';
				});
			}
		</script>

		<!--
		Below we include the Login Button social plugin. This button uses
		the JavaScript SDK to present a graphical Login button that triggers
		the FB.login() function when clicked.
		-->

		<fb:login-button scope="public_profile,email" onlogin="checkLoginState();" auto_logout_link="true" show_faces="false" 
			size="xlarge"></fb:login-button>


		<div id="status"></div>

	</body>
</html>


請注意:
1 website url必須用.com,.net等符合網站域名的後綴結束。
2 爲了匹配website url,vhost也需要設置跟website一樣的domain
3 //connect.facebook.net/en_US/sdk.js 無法加載,請解決以上2個問題就可以加載了。必須在backend端執行。不能直接訪問下載sdk.js。
login 成功後會返回

		
	
authResponse
	Object { accessToken="xxx...xxx", userID="xxx", expiresIn=5422, 更多...}
	
accessToken
	"xxxx"
	
expiresIn
	5422
	
signedRequest
	"xxx"
	
userID
	"xxxx"
	
status


新浪微博
新浪微博要在控制臺中設置callback url和取消callback url。
http://open.weibo.com/apps/698437227/info/advanced
OAuth2.0 授权设置编辑
授权回调页:http://weibo-oauth-local/callback.php
取消授权回调页:http://weibo-oauth-local/cancelCallback.php

下載php sdk。修改config.php
<?php
header('Content-Type: text/html; charset=UTF-8');

define( "WB_AKEY" , 'xxx' );
define( "WB_SKEY" , 'xxx' );
define( "WB_CALLBACK_URL" , 'http://weibo-oauth-local/callback.php' );


WB_CALLBACK_URL要跟在控制台配置的一致。否則無法調用。
<?php
session_start();

include_once( 'config.php' );
include_once( 'saetv2.ex.class.php' );

$o = new SaeTOAuthV2( WB_AKEY , WB_SKEY );

if (isset($_REQUEST['code'])) {
	$keys = array();
	$keys['code'] = $_REQUEST['code'];
	$keys['redirect_uri'] = WB_CALLBACK_URL;
	var_dump($keys);
	try {
		$token = $o->getAccessToken( 'code', $keys ) ;
		var_dump($token);
		echo $o->client_id;
	} catch (OAuthException $e) {
	}
}

if ($token) {
	$_SESSION['token'] = $token;
	setcookie( 'weibojs_'.$o->client_id, http_build_query($token) );
?>
授权完成,<a href="weibolist.php">进入你的微博列表页面</a><br />
<?php
} else {
?>
授权失败。
<?php
}
?>



回調的php代碼中會返回accesstoken和uid。
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics