CordovaでOAuthを利用する(GoogleID利用編)

ng-cordova-oauthを使ってCordovaアプリでOAuthを利用してみます。このライブラリはAndroid,iOS,Windowsへ対応しています。

Googleアカウントでログインしてみます。

bowerやリポジトリからダウンロードするなどしてファイルを読み込みます。
<script src="lib/ng-cordova-oauth/ng-cordova-oauth.min.js"></script>

必要なプラグインを入れます。

cordova plugin add cordova-plugin-inappbrowser --save
cordova plugin add cordova-plugin-whitelist --save

Googleの開発者コンソールでプロジェクトを作成します。

「OauthクライアントID」タイプは「ウェブアプリケーション」で作成します。
承認済みのリダイレクト URIには"http://localhost/callback"を登録しておきます。

モジュールを関連付けます。

var module = angular.module('app', ['onsen','ngCordovaOauth']);

OAuth呼び出し

$cordovaOauth.google("Access ID", ["email"]).then(function(result) {

            //Success

        }, function(error) {

            //Error

        });

Successの場合のresult
{
  "access_token":"*****",
  "token_type":"Bearer",
  "expires_in":"3600",
  "id_token":"*****"
}

Androidの場合の画面遷移

Inappbrowserが中に開いてログイン画面が表示されます。ブラウザ標準の拡大・縮小画面が表示されるので違和感は少しあります。デバイスの戻るボタン以外で元の画面に戻る術はありませんでした。

iOSの画面遷移

"Done"をクリックすると元の画面へ戻ります。問題はApple社の審査をこの動作で通過できるかですが、issueには上がっていないようです。