Googleのアカウントを利用してユーザ登録、ログインページを作成する(OAuth認証)

先日はFacebookの情報を取得する方法を2回に分けて書きました。今回はGoogleのアカウントでユーザ登録、ログインを対応してみようと思います。Facebookよりも日本語の情報が少なかったのですが、「GoogleでOpenID Connectを体験!」という記事が参考になりました。

1.Googleでアプリを作成
最初にAPI Consoleでアプリケーションを登録します。Googleのアカウント認証がありますので、ログインすると、下記の画面が表示されます(初めてアクセスした場合)。

Google APIs console画面

ログイン後は下記の画面が表示されますので、左のメニューにある「API Access」をクリックします。

Google apisサービス一覧画面

まだアプリケーションの登録をしていない場合は下記の画面が表示されますので、「Create an OAuth 2.0 client ID…」ボタンをクリックします。既に登録済みの場合は一番最後のページが表示されます。

Google APIアクセス画面

ポップアップウィンドウでアプリケーションの名前、ロゴを登録し、「Update」ボタンをクリックします。

プロダクト情報

クライアントIDの作成を行います。内容の入力後、「Create client ID]ボタンをクリックします。

Google APIクライアントID作成画面

登録が完了すると下記のようにClient ID、Client secretが表示されますので控えておきます。

Google API登録結果

2. サンプルコードをサイトに設置
Facebookと同様、OAuthに関するGoogleのページも英語のものしかありません。かつFacebookのものよりも、私には読みにくかったです。

今回は、Facebookのようにサンプルコードがありませんでしたので、簡単に作ってみました。エラー処理などは一切行っておりません。下記のソースコードはFacebookと同じ変数を利用しています。$app_idは1で控えた「Client ID」、$app_secretも1で控えた「Client secret」、$my_urlは下記のソースコードを設置するURL(例:https://ssl.poitan.net/gg_login.php)を入力します。

簡単な解説ですが、$codeを取得しaccess_tokenを取得します。そのaccess_tokenを用いてプロフィール情報を取得するという内容です。print_r ($response)でプロフィール内容を表示しています。

<?php
$app_id = "YOUR_APP_ID";
$app_secret = "YOUR_APP_SECRET";
$my_url = "YOUR_URL";

$code = $_REQUEST["code"];

if(empty ($code))
{
    $dialog_url = "https://accounts.google.com/o/oauth2/auth?"
       . "scope=https%3A%2F%2Fwww.googleapis.com%2Fauth%2Fuserinfo.email+https%3A%2F%2Fwww.googleapis.com%2Fauth%2Fuserinfo.profile&"
       . "client_id=" . $app_id . "&redirect_uri=" . urlencode ($my_url) . "&response_type=code";

    echo("<script> top.location.href='" . $dialog_url . "'</script>");
}

$token_url = "https://accounts.google.com/o/oauth2/token";
$params = "code=" . $code;
$params .= "&client_id=" . $app_id;
$params .= "&client_secret=" . $app_secret;
$params .= "&redirect_uri=" . urlencode ($my_url);
$params .= "&grant_type=authorization_code";
$response = dorequest ($token_url, $params, 'POST');

$response = json_decode ($response);
if (isset ($response->access_token))
{
	$info_url = 'https://www.googleapis.com/oauth2/v1/userinfo';
	$params = 'access_token=' . urlencode ($response->access_token);
	unset ($response);
	$response = dorequest ($info_url, $params, 'GET');
	if (isset ($response->id))
	{
		$response = json_decode ($response);
		print_r ($response);
	}
}

function dorequest ($url, $params, $type)
{
	$ch = curl_init ();
	if ($type == 'POST')
	{
		curl_setopt ($ch, CURLOPT_URL, $url);
		curl_setopt ($ch, CURLOPT_POSTFIELDS, $params);
		curl_setopt ($ch, CURLOPT_POST, 1);
	}
	else
		curl_setopt ($ch, CURLOPT_URL, $url . "?" . $params);
	curl_setopt ($ch, CURLOPT_RETURNTRANSFER, 1);
	unset ($response);
	$response = curl_exec ($ch);
	curl_close ($ch);
	return $response;
}
?>

3.ブラウザから認証ページにアクセス
YOUR_APP_IDが1で控えた「Client ID」、YOUR_URLがGoogleの認証ページからリダイレクトする時のURLを入力します。上記の例だとhttps://ssl.poitan.net/gg_login.phpとなります。

https://accounts.google.com/o/oauth2/auth?scope=https%3A%2F%2Fwww.googleapis.com%2Fauth%2Fuserinfo.email+https%3A%2F%2Fwww.googleapis.com%2Fauth%2Fuserinfo.profile&client_id=YOUR_APP_ID&redirect_uri=YOUR_URL&response_type=code

YOUR_APP_IDとYOUR_URLを自分の環境に合わせて、URLをブラウザのアドレス欄に入力すると、ログインしていない場合はログイン認証ページが表示されます。既にログイン済みの場合は下記の画面は飛ばされます。

Googleのログイン画面

ログインが正常に行われると作成したアプリがアクセスする内容が表示されます。「アクセス許可」を選択すると認証されます。

Googleのアクセス許可・拒否

認証が正常に行われると2で設置したURLにリダイレクトされ、$responseに入っているものが出力されます。

Googleの情報にアクセス

サイトのユーザ登録でGoogleで取得できない項目がある場合は、上記で取得した情報をデータベースに格納した後、個別に登録できるようにすればユーザ登録が完了します。次にログインの場合は、データベースのGoogle IDと一致する情報を取得かをチェックすればログインは可能なはずです。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください