Implementing Login With Google + In PHP


In the last post, I introduced you to a PHP OAuth Class named OAuth API. In this post I’m going to tell you how to implement Login With Google + feature in PHP using the class I introduced. It’s very simple. I will tell the ways of implementing step by step. This tutorial includes placing a Login with Google + button on web site to authorization and finishes when we get user details. You should read this post before starting this tutorial.

Appearance

First of all, we will design our Login With Google + button. Then we will move on to the server side. We are going to design the button using HTMLCSS and a small icon.

Place the below HTML code on the place where you want to show the button :

Login With Google +

You should need a Google + small logo for making the button attractive. I have included the image below :

g+_icon

Here is the CSS code that will decorate the button. I have provided the image URL as https://lab.subinsb.com/projects/blog/uploads/2013/12/g+_icon.png

#login_with_google{

display: inline-block;

height: 43px;

margin: 0px;

padding: 0px 20px 0px 52px;

font-family: ‘Ubuntu’, sans-serif;

font-size: 18px;

font-weight: 400;

color: #fff;

line-height: 41px;

background:rgb(231, 38, 54) url(https://lab.subinsb.com/projects/blog/uploads/2013/12/g+_icon.png) no-repeat 14px 8px scroll;

-webkit-border-radius: 4px;

-moz-border-radius: 4px;

border-radius: 4px;

text-decoration: none;

cursor:pointer;

}

The finished button will look something like below :

Login With Google + button

Server Side

login_with_google.php

This is the file that handles the authorization. You need the oauth_client.php which we mentioned in the previous post. You need a client id and client secret which you get when you create an app @ http://code.google.com/apis/console. You have to mention the redirect URL in the app settings of Google Console.

Here is the complete code :

<?php

require(‘http.php’);

require(‘oauth_client.php’);

$client = new oauth_client_class;

$client->server = ‘Google’;

$client->debug = false;

$client->debug_http = true;

$client->redirect_uri = ‘http://’.$_SERVER[‘HTTP_HOST’].dirname(strtok($_SERVER[‘REQUEST_URI’],’?’)).’/login_with_google.php’;

$client->client_id = ”;/*Client ID*/

$client->client_secret = ”;/*Client Secret*/

$client->scope = ‘https://www.googleapis.com/auth/userinfo.email https://www.googleapis.com/auth/userinfo.profile https://www.googleapis.com/auth/plus.me&#8217;;

$application_line = \__LINE__;

if(strlen($client->client_id) == 0 || strlen($client->client_secret) == 0){

 die(‘Please go to Google APIs console page ‘.

  ‘http://code.google.com/apis/console in the API access tab, &#8216;.

  ‘create a new client ID, and in the line ‘.$application_line.

  ‘ set the client_id to Client ID and client_secret with Client Secret. ‘.

  ‘The callback URL must be ‘.$client->redirect_uri.’ but make sure ‘.

  ‘the domain is valid and can be resolved by a public DNS.’);

}

if(($success = $client->Initialize())){

 if(($success = $client->Process())){

  if(strlen($client->authorization_error)){

   $client->error = $client->authorization_error;

   $success = false;

  }elseif(strlen($client->access_token)){

   $success = $client->CallAPI(‘https://www.googleapis.com/oauth2/v1/userinfo&#8217;, &#8216;GET&#8217;, array(), array(&#8216;FailOnAccessError&#8217;=>true), $user);

   if($success){

    $email=$user->email;

    $name=$user->name;

    $gender=$user->gender;

    $birthday=date(‘d/m/Y’, strtotime($user->birthday));

    $image=$user->picture;

   }

  }

 }

 $success = $client->Finalize($success);

}

if($client->exit){

 die(“Something Happened”,”redirect_uri.”‘>Try Again”);

}

if(!$success){

?>

 <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”>

 

  

   Error

  

  

   

OAuth client error

   

Error: <?php echo HtmlSpecialChars($client->error); ?>

  

 

<?}?>

Don’t forget to replace client_idclient_secret values.

How It Works

  1. When a user clicks Login With Google + button, the user will be redirected to the login_with_google.php page.
  2. The PHP file will redirect the user to Google‘s authorization page with all the app details needed by Google.
  3. When the user authorizes the app, he/she will be redirected back to login_with_google.php page with a GET parameter named code.
  4. OAuth API library will request an access token to Google with the given code.
  5. When it receives the access token, It sends a request to https://www.googleapis.com/oauth2/v1/userinfo with the access_token and the URL will return the details of the user.

Variables

$email – The E-Mail of the user

$name – The Name of the user

$gender – The Gender of the user

$birthday – The Birthday of the user

$image – The Image URL of the user

Isn’t this tutorial simple ?

If you encountered any problems or have a suggestion, please say it on the comments. I will be happy to respond.