Please wait for 15 seconds...

Sunday 18 November 2012



Today Facebook is leading social networking website in the world but Google Plus is not far behind from Facebook. As Google Plus will get more user base they will give more free hands to developers to develop more interactive apps but that is not today's topic.

Today I will explain you how to create Google Plus oauth system.

First download google library bundle and extract folder called "g_api_php_client" in a separate location.

Now create a project(app) for Google oauth login. Go to console.developers.google.com and create a project(app). I am attaching instructions here in images step by step.

Note:

This interface is in older version now so switch your console.developers.google.com screen to older version if you do not see similar interface like below.











Set services for your project(app) means for what purpose you want to use this project(app). Enable services you want to use through this project(app) and do not forgot to enable Google plus API.



Now we are ready to access app details like app credentials app secret, app ID etc.



Now get back to Google login directory and create a file for login functions and name it google_login.php. Copy below code and paste it in google_login.php.


google_login.php


<?php
require_once 'g_api_php_client/src/Google_Client.php';
require_once 'g_api_php_client/src/contrib/Google_PlusService.php';

$user_info = array();
/*************** Google Oauth Credentials ***************/
$config['app_name'] = 'APP_NAME';# Your app name in console.google.com
$config['client_id'] = 'CLIENT_ID'; #for web application
$config['client_secret'] = 'CLIENT_SECRET';
$config['redirect_uri'] = 'REQUEST_URI';
$config['developer_key'] = 'API_KEY';
/********************************************************/
$client = new Google_Client();
$client->setApplicationName($config['app_name']);
$client->setClientId($config['client_id']);
$client->setClientSecret($config['client_secret']);
$client->setRedirectUri($config['redirect_uri']);
$client->setDeveloperKey($config['developer_key']);
$scope[] = 'https://www.googleapis.com/auth/plus.me';
$scope[] = 'https://www.googleapis.com/auth/userinfo.email';
$scope[] = 'https://www.googleapis.com/auth/userinfo.profile';
$client->setScopes($scope);
$plus = new Google_PlusService($client);

if(isset($_GET['login'])){
    header('location:'.$client->createAuthUrl());
}
else{
    if(isset($_GET['code'])) {
        $client->authenticate();
        $token = $client->getAccessToken();

        $token_json = json_decode($token);
        $url = "https://www.googleapis.com/oauth2/v1/userinfo?alt=json&access_token=".$token_json->access_token;
$user_info = json_decode(curl_function($url), true);
    }
}
function curl_function($url){
    $ch = curl_init();
    $timeout = 10;
    curl_setopt($ch,CURLOPT_URL,$url);
    curl_setopt($ch,CURLOPT_RETURNTRANSFER,1);
    curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, FALSE);
    curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, 2);
    curl_setopt($ch,CURLOPT_CONNECTTIMEOUT,$timeout);
    $response = curl_exec($ch);
    curl_close($ch);
    return $response;
}
include 'google_login.html';
?>

Create google_login.html and copy & paste below code.

google_login.html


<!DOCTYPE>
<html>
<head>
<title>Google Oauth Login in PHP</title>
<link rel="shortcut icon" href="images/others/favicon.ico">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="I am showing you here how to login with google plus oauth">
<meta name="author" content="https://plus.google.com/+AtulPrasadGupta24">
<style type="text/css">
.login_btn_hold{
width: 600px;
position:absolute;
left:50%;
margin-left:-300px;
top:50%;
}
.login_btn{
width: 525px;
padding: 7px 12px 7px 12px;
background-color: #C53228;
color: white;
font-weight: bold;
font-size:25pt;
text-decoration:none;
}
</style>
</head>
<body>
<div>
<?if($user_info){?>
<div>
<table>
<tr>
<td>ID: </td>
<td><?=$user_info['id']?></td>
</tr>
<tr>
<td>Email: </td>
<td><?=$user_info['email']?></td>
</tr>
<tr>
<td>Is Email Verified: </td>
<td><?=$user_info['verified_email']?></td>
</tr>
<tr>
<td>Name: </td>
<td><?=$user_info['name']?></td>
</tr>
<tr>
<td>First Name: </td>
<td><?=$user_info['given_name']?></td>
</tr>
<tr>
<td>Last Name: </td>
<td><?=$user_info['family_name']?></td>
</tr>
<tr>
<td>Google Plus Profile: </td>
<td><?=$user_info['link']?></td>
</tr>
<tr>
<td>Google Plus Profile Picture: </td>
<td><?=$user_info['picture']?></td>
</tr>
<tr>
<td>Gender: </td>
<td><?=$user_info['gender']?></td>
</tr>
<tr>
<td>Language: </td>
<td><?=$user_info['locale']?></td>
</tr>
</table>
</div>
<?}?>
<div class="login_btn_hold">
<a href="index.php?login=true" class="login_btn">Click to Login with Google Plus Oauth</a>
</div>
</div>
</body>
</html>

Now get back to google console page and copy app details and paste them in google_login.php page.

Save the file on server. Open file URL in browser and click on big red google login button.

Note:

In app setting on console.developers.google.com you have give full TLD path so I resommend you to test your application on server, not on local server.

I hope my effort will help you. If you have any doubt or question feel free to ask me. Good luck. 

Posted by Atul

1 comment:

  1. How can I get people's email id along with people list?

    ReplyDelete

Techsirius on Facebook