採用はこちら!

Shinonome Tech Blog

株式会社Shinonomeの技術ブログ
4 min read

OAuth 2.0 を使用してGoogle API にアクセスする方法

OAuth 2.0 を用いてGoogle APIにアクセスし、googleアカウントの情報を取得する方法を紹介したいを思います。

自己紹介

こんにちは!
Webバックエンド勉強中の堀智基です
最近、暖かくなってきたので散歩にいくようになりました

はじめに

OAuth 2.0 を用いてGoogle APIにアクセスし、googleアカウントの情報を取得する方法を紹介したいを思います。
実際のプロジェクトでは、各言語に対応したライブラリを使用して、アクセストークンを取得しAPIにアクセスすると思います。その際、この記事を読んでもらえたら、ライブラリがやってくれている処理のフローが理解しやすくなると思います。
参考にしていただけたら幸いです。

OAuth 2.0 とは

OAuth 2.0とは、アクセストークンを用いて、パスワードやIdを入力することなくアプリケーションをGoole, Twitter, Facebookなどのプロバイダーと連携させる事ができ、連携先のプロバイダーに保存されている情報にアクセスするための仕組みです。

Google APIのアクセストークン取得までの手順

  1. Google API Console でOAuth2.0の認証情報を作成し、クライアントID及びクライアントシークレットの取得
  2. 認可コードの取得
  3. アクセストークンの取得

以下、順を追って説明していきます。

1. Google API ConsoleでOAuth2.0の認証情報を取得

まず、Google API ConsoleにプロジェクトとOAuth 2.0 クライアント認証情報を作成し、クライアントIDとクライアントシークレットを取得する必要があります。

まずプロジェクトを作成します。

次に認証情報画面からOAuth2.0クライアント認証情報を作成します。
一度、OAuth同意画面に飛ばされると思いますが、googleに指示された通り設定すれば問題ないです。

最終的には以下のような画面になると思います。

  • 「承認済みのJavaScript 生成元」にはプロトコルとドメイン名
  • 「承認済みのリダイレクトURI」には認証が終わった後にリダイレクトさせるためのURI (コールバックURI)

を指定します。

ローカル環境で動作確認などをする時は「承認済みのJavaScript 生成元」にはhttp://localhost:8080http://127.0.0.1のように指定します。

これらの設定が終わるとクライアントIDとクライアントシークレットが表示されます。
これは後で使用するので、メモしたり、コピーしておきましょう。

2. 認可コードの取得

アクセストークンを取得するにはまず、認可コードを取得する必要があります。

認可コードとは、ユーザーがリソースサーバーへのアクセスを認可することによって発行される短命のコードで、ユーザーが認可を行ったことを証明するコードです。後で、認可コードとアクセストークンを交換します。

まず、googleのOAuth 2.0のサーバーにアクセスし、認可および認証のプロセスを開始します。
そのためにはhttps://accounts.google.com/o/oauth2/v2/authにアクセスします。
以下のようにクエリパラメータを設定します。

https://accounts.google.com/o/oauth2/v2/auth?
scope=スコープ
&access_type=offline
&include_granted_scope=true
&response_type=code
&redirect_uri=手順1で設定したリダイレクトURI
&client_id=手順1で取得したクライアントID

実際にアクセスすると、googleのOAuth 2.0サーバーはユーザーを認証し、アプリケーションが要求するスコープにアクセスするために、ユーザーの同意を得る必要があります。そのため、認証画面に飛ばされます。
連携したいアカウントを選択すると、redirect_uriに設定したURIに「code」というクエリパラメータ が追加され、リダイレクトされます。

ここの「code」の値が認可コードです。

3. アクセストークンの取得

  1. で取得した認可コードをhttps://accounts.google.com/o/oauth2/tokenに送ります。

今回はわかりやすさに重きを置きたいのでcurlコマンドを使用してPOSTしたいと思います。

curl 
-d code=手順2で取得した認可コード 
-d client_id=クライアントID
-d client_secret=クライアントシークレット
-dredirect_uri=リダイレクトURI
-d grant_type=authorization_code 
https://accounts.google.com/o/oauth2/token

json形式でレスポンスが返ってきますが文字列が長いので、雰囲気だけ記載します。

{
  "access_token": "アクセストークン",
  "expires_in": 3599,
  "refresh_token": "リフレッシュトークン",
  "scope": "スコープ",
  "token_type": "Bearer",
  "id_token": "IDトークン"
}

APIを使って、連携したgoogleアカウントの情報を取得してみる

アクセス トークンを取得した後、アプリケーションはトークンを使用して、承認済みの API リクエストをユーザーの代わりに送信できます。

3. で取得したアクセストークンを使って連携したアカウント情報を取得してみます。

アクセストークンをHTTP リクエスト ヘッダーの値として指定する方法と、クエリ パラメータの値として指定する方法があります。
今回は推奨されている前者の方法でアカウント情報を取得してみます。

curl -H "Authorization: Bearer アクセストークン" https://www.googleapis.com/oauth2/v1/userinfo

json形式でレスポンスが返ってきます。個人情報がふくまれますので、こちらも雰囲気だけ記載します。

{"id": "ユーザーID",
"email": "メールアドレス",
"verified_email": true,
"name": "フルネーム",
"given_name": "名前",
"family_name": "苗字",
"picture": "プロフィール画像",
"locale": "ja"}

さいごに

今回、OAuth 2.0を使用してGoogle APIにアクセスするためのアクセストークン取得、実際にアカウント情報を取得するところをみてきました。
Qiitaでも定期的の情報発信してるのでみてみてください!

ありがとうございました。

参考