外部 ID を使用してユーザーを認証する

このクイックスタートでは、Identity-Aware Proxy(IAP)と外部 ID でアプリを保護する方法について説明します。IAP と Identity Platform を組み合わせることで、Google アカウントだけでなく、OAuthSAMLOIDC など、さまざまな ID プロバイダを使用してユーザーの認証を行うことができます。

このクイックスタートでは、Facebook 認証を使用して App Engine のサンプルアプリを保護します。

始める前に

  1. Google Cloud Console の [プロジェクト セレクタ] ページで、Google Cloud プロジェクトを選択または作成します。

    プロジェクト セレクタに移動

  2. Google Cloud プロジェクトで課金が有効になっていることを確認します

  3. Google Cloud CLI をインストールし、次のコマンドを実行して初期化します。

    gcloud init

  4. プロジェクト用に App Engine を初期化します。

    gcloud app create --project=project-id
    
  5. Git をインストールします。

  6. Node.js の最新バージョンをインストールします。

  7. Firebase コマンドライン ツールをインストールします

    npm install -g firebase-tools
    

API を有効にする

まず、Identity Platform を有効にします。

  1. Google Cloud コンソールで Identity Platform の Marketplace ページに移動します。

    Identity Platform の Marketplace ページに移動

  2. [Identity Platform を有効化] をクリックします。Google Cloud コンソールに ID プラットフォームのページが表示されます。

次に、IAP を有効にします。

  1. Google Cloud コンソールで [IAP] ページに移動します。

    IAP ページに移動

  2. Identity Platform で使用したものと同じプロジェクトを選択します。別のプロジェクトを使用することはできません。

  3. [API を有効にする] をクリックします。

サンプルコードをダウンロードしてデプロイする

このクイックスタートのコードには、クライアント アプリ認証アプリの 2 つのコンポーネントがあります。

クライアント アプリは IAP で保護されています。認証されていないユーザーからリクエストを受信すると、認証アプリにリクエストをリダイレクトし、ユーザーの本人確認を行います。ユーザーがログインに成功すると、認証アプリが JSON Web Token(JWT)を返します。デモ用のため、ここではクライアント アプリに JWT が表示されます。

まず、コードをダウンロードして、クライアント アプリをデプロイします。

  1. サンプルコードをダウンロードします。

    git clone https://github.com/GoogleCloudPlatform/iap-gcip-web-toolkit.git
    
  2. クライアント アプリのディレクトリに移動します。

    cd iap-gcip-web-toolkit/sample/app
    
  3. 依存関係をインストールします。

    npm install
    
  4. クライアント アプリを App Engine にデプロイします。

    npm run deploy
    

    クライアント アプリが次の URL で起動します。

    https://[PROJECT-ID].appspot.com
    

次に、認証アプリをデプロイします。

  1. 認証アプリのディレクトリに移動します。

    cd ../authui-firebaseui
    
  2. 依存関係をインストールします。

    npm install
    
  3. Firebase Hosting を使用するように認証アプリを構成します。IAP で保護されたクライアント アプリを含む Google Cloud プロジェクトの Google Cloud プロジェクト ID を指定します。

    firebase use project-id
    
  4. アプリをデプロイします。

    npm run deploy
    

    認証アプリが次の URL で起動します。

    https://[PROJECT-ID].firebaseapp.com
    

これで、クライアント アプリと認証アプリがデプロイされました。次に、Identity Platform と IAP を構成します。

Identity Platform を設定する

IAP は Identity Platform を使用して外部 ID の認証を行います。このクイックスタートでは Facebook を例にしていますが、Identity Platform はさまざまな ID プロバイダに対応しています。

Facebook アプリを作成する

Facebook の認証情報でユーザーの認証を行うには、アプリ ID とアプリのシークレットが必要です。

  1. Facebook for Developers にログインします。Facebook アカウントがない場合は、アカウントを作成します。

  2. Facebook の Apps ページに移動します。

  3. [Add a New App] をクリックします。

  4. 左側のメニューで、[Settings] > [Basic] の順に選択します。

  5. [Privacy Policy URL] ボックスに、有効な URL を入力します。アプリをあとで本番環境にデプロイする場合は、独自のプライバシー ポリシーを参照するように URL を更新できます。

  6. アプリ ID とアプリ シークレットをメモします。これらは次のセクションで必要になります。

Facebook を ID プロバイダとして追加する

認証に Facebook を使用するように Identity Platform を構成します。

  1. Google Cloud コンソールで [ID プロバイダ] ページに移動します。

    [ID プロバイダ] ページに移動

  2. [プロバイダを追加] をクリックします。

  3. プロバイダのリストから Facebook を選択します。

  4. 前のセクションで取得したアプリ ID とアプリ シークレットを入力します。

  5. [保存] をクリックします。

OAuth リダイレクト URI を構成する

Facebook が認証アプリからのリクエストの処理を完了したときに、リダイレクト先の URI が必要になります。

  1. Facebook の Apps ページに戻り、アプリを選択します。

  2. 左側のメニューで [Products] をクリックします。

  3. Facebook Login を選択して、[Set Up] をクリックします。

  4. 左側のナビゲーション メニューで [Settings] を選択します(ガイド付きのクイックスタート フローを完了する必要はありません)。

  5. [Valid OAuth Redirect URIs] ボックスに、リダイレクト先の URI を入力します。

    https://project-id.firebaseapp.com/__/auth/handler
    

    この URI は、Identity Platform プロバイダの構成ページでも確認できます。

  6. [Save Change] をクリックします。

これで、Identity Platform の設定が完了しました。認証に IAP を使用するように構成されました。

IAP を有効にして外部 ID を使用する

  1. Google Cloud コンソールで [IAP] ページに移動します。

    IAP ページに移動

  2. [アプリケーション] タブをクリックします。

  3. 以前にデプロイした App Engine サンプルアプリを選択します。[公開済み] カテゴリに、次のような URL が表示されます。

    https://project-id.appspot.com
    
  4. [IAP] 列で、スイッチをオンに切り替えます。

  5. サイドパネルで、[承認には外部 ID を使用します] の [開始] をクリックします。

  6. [ログインページ] で、[自分で提供する] を選択します。

  7. 次のように、[認証 URL] フィールドに認証アプリの URL を入力します。

    https://project-id.firebaseapp.com/
    

    URL を入力すると、Google Cloud コンソールに API キーが自動的に追加されます。

  8. プロジェクト名のチェックボックスをオンにします。ID プロバイダとして Facebook が表示されるはずです。

  9. [保存] をクリックします。

これで IAP の設定が完了しました。

ユーザー認証をテストする

IAP がアプリを保護し、Facebook でユーザーを認証していることをテストするには:

  1. ブラウザで、App Engine クライアント アプリに移動します。

    https://project-id.appspot.com
    

    読み込み画面が表示された後、Identity Platform のログインページにリダイレクトされます。

  2. 画面の手順に従って Facebook で認証を行います。

  3. クライアント アプリにリダイレクトされ、Identity Platform から返された JWT が表示されます。

完全にログアウトするには、作成したサンプルアプリと Facebook からログアウトする必要があります。Firebase は 1 時間有効な Facebook とのセッションを確立するため、両方のアプリからログアウトする必要があります。詳細については、ユーザー セッションを管理するをご覧ください。

これで完了です。App Engine にアプリがデプロイされ、IAP と外部 ID で保護されました。

クリーンアップ

このページで使用したリソースについて、Google Cloud アカウントに課金されないようにするには、次の手順を行います。

  1. Google Cloud コンソールで、[リソースの管理] ページに移動します。

    [リソースの管理] に移動

  2. プロジェクト リストで、削除するプロジェクトを選択し、[削除] をクリックします。
  3. ダイアログでプロジェクト ID を入力し、[シャットダウン] をクリックしてプロジェクトを削除します。

作成した Facebook アプリを削除することもできます。

次のステップ