데스크톱 및 모바일 앱에 Google Picker 통합

이 문서에서는 Google Picker API를 사용하여 데스크톱 및 모바일 앱에 Google Picker를 통합하는 방법을 설명합니다.

Google Picker API는 사용자가 Google Drive 파일을 선택하거나 업로드할 수 있는 방법입니다. 사용자는 데스크톱, 모바일 또는 웹 앱에 Drive 데이터에 액세스할 수 있는 권한을 부여하여 파일과 안전하고 승인된 방식으로 상호작용할 수 있습니다.

기능

Google Picker에는 다음과 같은 여러 기능이 있습니다.

  • Google Drive UI와 유사한 디자인입니다.
  • 드라이브 파일의 미리보기 및 썸네일 이미지를 보여주는 여러 뷰
  • 특정 파일 형식 (예: PDF 또는 이미지) 또는 특정 폴더만 표시하는 사전 필터링된 뷰
  • 사용자의 기본 브라우저에 있는 새 탭 내의 Google 선택기로 리디렉션됩니다. Google Picker API가 클라이언트 페이지에서 열리도록 하려면 Google Picker API for web apps를 대신 사용하세요.

Google 선택 도구를 사용하여 파일을 선택하고 업로드할 수는 있지만, 사용자가 한 폴더에서 다른 폴더로 파일을 정리하거나 이동하거나 복사할 수는 없습니다. 파일을 관리하려면 Google Drive API 또는 Drive UI를 사용해야 합니다.

기본 요건

Google Picker를 사용하는 앱은 기존의 모든 서비스 약관을 준수해야 합니다. 무엇보다도 요청에서 자신을 올바르게 식별해야 합니다.

Google Cloud 프로젝트도 있어야 합니다.

환경 설정

Google Picker API를 사용하려면 환경을 설정해야 합니다.

API 사용 설정

Google API를 사용하려면 먼저 Google Cloud 프로젝트에서 사용 설정해야 합니다. 단일 Google Cloud 프로젝트에서 하나 이상의 API를 사용 설정할 수 있습니다.
  • Google Cloud 콘솔에서 Google Picker API를 사용 설정합니다.

    API 사용 설정

인증 및 승인 설정

최종 사용자를 인증하고 앱에서 사용자 데이터에 액세스하려면 OAuth 2.0 클라이언트 ID를 하나 이상 만들어야 합니다. 클라이언트 ID는 Google OAuth 서버에서 단일 앱을 식별하는 데 사용됩니다. 앱이 여러 플랫폼에서 실행되는 경우 플랫폼별로 별도의 클라이언트 ID를 만들어야 합니다.

데스크톱 앱의 사용자 인증 정보 승인

OAuth 2.0 클라이언트 ID를 만들려면 다음 단계를 따르세요.

  1. Google API 콘솔에서 메뉴 > Google 인증 플랫폼 > 클라이언트로 이동합니다.

    클라이언트로 이동

  2. 클라이언트 만들기를 클릭합니다.
  3. 애플리케이션 유형 > 데스크톱 앱을 클릭합니다.
  4. 이름 필드에 사용자 인증 정보의 이름을 입력합니다. 이 이름은 Google API 콘솔에만 표시됩니다.
  5. 만들기를 클릭합니다.

    새로 만든 사용자 인증 정보가 '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 선택 도구 UI 인증 화면

    Google Picker를 트리거하여 앱을 인증합니다.

  • Google 로그인 및 권한 대화상자

    Google 계정으로 로그인하고 요청된 권한을 부여합니다.

  • 선택기 내부의 Google Drive 파일 선택 인터페이스

    Google 선택기에서 Google Drive 파일을 탐색하고 원하는 항목을 선택합니다.

  • 삽입 버튼이 표시된 파일 삽입 확인 화면

    선택한 항목을 확인하고 삽입을 탭하여 앱에 파일을 추가합니다.

앱에 Google Picker 통합

사용자가 추가 파일에 대한 액세스 권한을 부여하거나 앱 흐름에서 사용할 파일을 선택하도록 허용하려면 다음 단계를 따르세요.

  1. drive.file 범위에 대한 액세스를 요청하여 OAuth 2.0을 사용하여 Google API에 액세스의 안내에 따라 새 브라우저 탭에서 OAuth 2.0 액세스 페이지를 엽니다. 범위에 관한 자세한 내용은 Google Drive API 범위 선택하기를 참고하세요.

    이러한 앱에는 drive.file 범위만 허용되며 다른 범위와 결합할 수 없습니다.

  2. 새 브라우저 탭의 URL은 모든 표준 OAuth 쿼리 문자열 매개변수를 허용합니다.

    OAuth 2.0 승인 URL 요청에 prompttrigger_onepick URL 매개변수를 추가해야 합니다. 선택적으로 다음과 같은 다른 매개변수를 사용하여 Google Picker를 맞춤설정할 수도 있습니다.

    매개변수 설명 상태
    prompt=consent 파일 액세스 권한을 묻는 메시지 필수
    trigger_onepick=true Google 선택기를 사용 설정합니다. 필수
    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을 사용하려면 먼저 공개 HTTPS URL을 사용한 다음 커스텀 프로토콜 또는 localhost 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 선택 도구 사용

Android 모바일 앱에서 Google 선택기를 사용할 수도 있습니다.

모바일 앱의 사용자 인증 정보 승인

Android 앱에서 Google Picker를 사용하려면 데스크톱 앱과 마찬가지로 OAuth 2.0을 사용하여 사용자를 승인해야 합니다. Android 인증에 관한 자세한 내용은 Google 사용자 데이터에 대한 액세스 권한 승인을 참고하세요.

승인 중에 Google 선택기를 표시하려면 AuthorizationRequest를 만들고 AuthorizationRequest.ResourceParameter 객체에서 PICKER_OAUTH_TRIGGER 리소스 매개변수를 사용합니다.

AuthorizationRequest를 빌드할 때:

  • drive.file 범위를 사용합니다.

  • setOptOutIncludingGrantedScopes에서 true까지 호출하여 반환된 토큰이 drive.file 범위에만 해당하고 이전에 부여된 범위에는 해당하지 않는지 확인합니다.

  • AuthorizationRequest.Prompt 필드를 CONSENT로 설정하여 이전에 동의가 부여된 경우에도 사용자에게 동의를 요청합니다.

  • 비트맵 'OR' (|) 연산자를 사용하여 AuthorizationRequest.Prompt 필드를 SELECT_ACCOUNT로 설정하여 동의 메시지가 표시되기 전에 사용자가 계정을 선택하도록 할 수도 있습니다.

Google 선택 도구 호출

데스크톱 앱과 마찬가지로 다음과 같은 여러 선택적 매개변수를 사용하여 Google Picker를 맞춤설정할 수 있습니다.

  • PICKER_ALLOW_MULTIPLE: 사용자가 여러 파일을 선택할 수 있습니다.
  • PICKER_MIMETYPES: 검색 결과를 필터링하기 위해 MIME 유형의 쉼표로 구분된 목록을 허용합니다. 설정하지 않으면 모든 MIME 유형의 파일이 뷰에 표시됩니다.
  • PICKER_FILE_IDS: 검색 결과를 필터링하기 위해 쉼표로 구분된 파일 ID 목록을 허용합니다. 설정하지 않으면 모든 파일이 뷰에 표시됩니다.
  • PICKER_ALLOW_FOLDER_SELECTION: 사용자가 폴더도 선택할 수 있도록 허용합니다.

데스크톱 앱의 선택적 매개변수에 대한 자세한 내용은 Google Picker 표시를 참고하세요.

사용자가 액세스 권한을 부여하고 관련 파일을 선택하면 AuthorizationResult 리소스의 getTokenResponseParams 객체가 반환됩니다. 사용자가 액세스 권한을 부여한 경우 이 객체에는 선택한 파일 ID의 쉼표로 구분된 목록인 picked_file_ids 값이 포함됩니다.