Google Picker をデスクトップ アプリとモバイルアプリに統合する

このドキュメントでは、Google Picker API を使用して、デスクトップ アプリとモバイルアプリに Google Picker を統合する方法について説明します。

Google Picker API を使用すると、ユーザーは Google ドライブのファイルを選択またはアップロードできます。ユーザーは、デスクトップ アプリ、モバイルアプリ、ウェブアプリにドライブデータへのアクセス権を付与して、安全かつ認可された方法でファイル操作を行うことができます。

機能

Google Picker には次のような機能があります。

  • Google ドライブ の UI と同様のルック＆フィール。
  • ドライブ ファイルのプレビューとサムネイル画像を表示する複数のビュー。
  • 特定のファイルタイプ（PDF や画像など）または特定のフォルダのみを表示する事前フィルタリングされたビュー。
  • ユーザーのデフォルト ブラウザの新しいタブで Google Picker にリダイレクト。

Google Picker ではファイルの選択とアップロードはできますが、フォルダ間のファイルの整理、移動、コピーはできません。ファイルを管理するには、Google Drive API またはドライブの UI を使用する必要があります。

前提条件

Google Picker を使用するアプリは、既存の 利用規約 をすべて遵守する必要があります。最も重要なことは、リクエストで自分自身を正しく識別することです。

また、Google Cloud プロジェクトが必要です。

環境の設定

Google Picker API の使用を開始するには、環境を設定する必要があります。

API を有効にする

Google API を使用する前に、Google Cloud プロジェクトで API を有効にする必要があります。 1 つの Google Cloud プロジェクトで 1 つ以上の API を有効にできます。

認証と権限付与の設定

エンドユーザーを認証してアプリ内のユーザーデータにアクセスするには、1 つ以上の OAuth 2.0 クライアント ID を作成する必要があります。クライアント ID は、Google の OAuth サーバーで個々のアプリを識別するために使用します。アプリが複数のプラットフォームで実行される場合は、プラットフォームごとに個別のクライアント ID を作成する必要があります。

デスクトップ アプリの認証情報を認可する

OAuth 2.0 クライアント ID を作成する手順は次のとおりです。

  1. Google API Console で、メニュー アイコン > [Google Auth platform] > [Clients] に移動します。

    [Clients] に移動

  2. [Create Client] をクリックします。
  3. [Application type] > [Desktop app] をクリックします。
  4. [Name] フィールドに、認証情報の名前を入力します。この名前は Google API Console にのみ表示されます。
  5. [Create] をクリックします。

    新しく作成した認証情報が [OAuth 2.0 クライアント ID] に表示されます。

アプリが以前に付与されたファイルへの認可を取得するには、次の手順を行います。

  1. OAuth 2.0 を使用して Google API にアクセスするの手順に沿って、drive.file、drive、または drive.readonly スコープで OAuth 2.0 トークンを取得する必要があります。スコープの詳細については、 Google Drive API のスコープを選択する をご覧ください。

  2. OAuth 2.0 トークンを Drive API に渡して、ユーザーが以前にアクセス権を付与したファイルを読み取り、変更します。

モバイルアプリの認証情報を認可する

OAuth 2.0 クライアント ID を作成するには、モバイルアプリの認証情報を認可する の手順に沿って操作してください。

ウェブアプリの認証情報を認可する

OAuth 2.0 クライアント ID を作成するには、ウェブアプリの認証情報を認可する の手順に沿って操作してください。

Google Picker を表示する

デスクトップ アプリとモバイルアプリ用の Google Picker API は、ユーザーのデフォルト ブラウザの新しいタブで Google Picker にリダイレクトします。ユーザーがアクセス権を付与して関連ファイルを選択すると、Google Picker はコールバック URL を介して呼び出し元のアプリに戻ります。

Google Picker API をクライアント ページで開くには、ウェブアプリ用の Google Picker API を使用します。詳細については、ウェブアプリに Google Picker を統合するをご覧ください。

ユーザーが他のファイルへのアクセス権を付与したり、アプリフローで使用するファイルを選択したりできるようにするには、次の手順を行います。

  1. OAuth 2.0 を使用して Google API にアクセスするの手順に沿って、drive.file スコープへのアクセスをリクエストし、新しいブラウザタブで OAuth 2.0 アクセス ページを開きます。スコープの詳細については、 Google Drive API のスコープを選択する をご覧ください。

    これらのアプリでは drive.file スコープのみが許可されており、他のスコープと組み合わせることはできません。

  2. 新しいブラウザタブの URL は、標準の OAuth クエリ文字列 パラメータをすべて受け入れます。

    OAuth 2.0 認証 URL リクエストに prompt と trigger_onepick URL パラメータを追加する必要があります。必要に応じて、他のパラメータを使用して Google Picker をカスタマイズすることもできます。

    パラメータ 説明 ステータス
    prompt=consent ファイル アクセスのプロンプトを表示します。 必須
    trigger_onepick=true Google Picker を有効にします。 必須
    allow_multiple=true true の場合、ユーザーは複数のファイルを選択できます。 省略可
    mimetypes=MIMETYPES 検索結果をフィルタする MIME タイプのカンマ区切りのリスト。設定しない場合、すべての MIME タイプのファイルがビューに表示されます。 省略可
    file_ids=FILE_IDS 検索結果をフィルタするファイル ID のカンマ区切りのリスト。設定しない場合、すべてのファイルがビューに表示されます。 省略可
    allow_folder_selection=true true の場合、ユーザーはフォルダも選択できます。 省略可

    OAuth 2.0 認証 URL リクエストの例を次に示します。

    https://accounts.google.com/o/oauth2/v2/auth? \
client_id=CLIENT_ID \
&scope=https://www.googleapis.com/auth/drive.file \
&redirect_uri=REDIRECT_URI \
&response_type=code \
&access_type=offline \
&prompt=consent \
&trigger_onepick=true

    次のように置き換えます。

    • CLIENT_ID: アプリのクライアント ID。

    • REDIRECT_URI: 認証が成功した後、認証サーバーがユーザーのブラウザをリダイレクトする場所。例: https://www.cymbalgroup.com/oauth2callback。

      指定した redirect_uri は、公開 HTTPS URL である必要があります。redirect_uri にカスタム プロトコルまたは localhost URL を使用する場合は、カスタム プロトコルまたは localhost URL にリダイレクトする公開 HTTPS URL を使用する必要があります。

  3. ユーザーがアクセス権を付与して関連ファイルを選択すると、OAuth はリクエストで指定された redirect_uri にリダイレクトし、次の URL パラメータが追加されます。

    • picked_file_ids: ユーザーがアクセス権を付与してファイルを選択した場合、選択したファイル ID のカンマ区切りのリスト。

    • code: リクエストで設定された response_type パラメータに基づくアクセス トークンまたはアクセス コード。このパラメータには、新しい 認証コードが含まれています。

    • scope: リクエストに含まれるスコープ。

    • error: 同意フロー内でユーザーがリクエストをキャンセルした場合、エラーが表示されます。

    OAuth 2.0 認証 URL レスポンスの例を次に示します。

    https://REDIRECT_URI?picked_file_ids=PICKED_FILE_IDS&code=CODE&scope=SCOPES

  4. アプリは、ステップ 3 の認証コードを新しい OAuth 2.0 トークンと交換する必要があります。詳細については、更新トークンとアクセス トークンの認証コードを交換するをご覧ください。

  5. アプリは、ステップ 3 の URL パラメータのファイル ID とステップ 4 で取得した OAuth 2.0 トークンを使用して、Drive API を呼び出すことができます。詳細については、Google Drive API の概要をご覧ください。

Android アプリで Google Picker を使用する

Android モバイルアプリでも Google Picker を使用できます。

モバイルアプリの認証情報を認可する

Android アプリで Google Picker を使用するには、 OAuth 2.0 を使用してユーザーを認可する必要があります。デスクトップ アプリと同様です。Android 認証の詳細については、 Google ユーザーデータへのアクセスを認可する をご覧ください。

認可中に Google Picker を表示するには、 AuthorizationRequest を作成し、PICKER_OAUTH_TRIGGER リソース パラメータを AuthorizationRequest.ResourceParameter オブジェクトで使用します。

AuthorizationRequest を作成する場合:

  • drive.file スコープを使用します。

  • setOptOutIncludingGrantedScopes を true に設定して、返されるトークンが drive.file スコープ のみで、以前に付与されたスコープではないことを確認します。

  • 以前に同意が付与されている場合でも、ユーザーに同意を求めるように AuthorizationRequest.Prompt フィールドを CONSENT に設定します。

  • 必要に応じて、ビットマップ「OR」（|）演算子を使用して AuthorizationRequest.Prompt フィールドを SELECT_ACCOUNT に設定し、同意プロンプトが表示される前にユーザーがアカウントを選択できるようにすることもできます。

Google Picker を呼び出す

デスクトップ アプリと同様に、いくつかのオプション パラメータを使用して Google Picker をカスタマイズできます。

  • PICKER_ALLOW_MULTIPLE: ユーザーが複数のファイルを選択できるようにします。
  • PICKER_MIMETYPES: 検索結果をフィルタする MIME タイプのカンマ区切りリストを受け入れます。設定しない場合、すべての MIME タイプのファイルがビューに表示されます。
  • PICKER_FILE_IDS: 検索結果をフィルタするファイル ID のカンマ区切りのリストを受け入れます。設定しない場合、すべてのファイルがビューに表示されます。
  • PICKER_ALLOW_FOLDER_SELECTION: ユーザーがフォルダも選択できるようにします。

デスクトップ アプリのオプション パラメータの詳細については、Display the Google Pickerをご覧ください。

ユーザーがアクセス権を付与して関連ファイルを選択すると、 getTokenResponseParams リソースの AuthorizationResult オブジェクトが返されます。ユーザーがアクセス権を付与した場合、このオブジェクトには picked_file_ids 値が含まれます。これは、選択したファイル ID のカンマ区切りのリストです。